Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve tab implementation #88

Merged
merged 14 commits into from
May 4, 2020

Conversation

oshorefueled
Copy link
Contributor

@oshorefueled oshorefueled commented Apr 27, 2020

Resolves

Issue #73

What's new

This PR improves the current tab implementation by

  • adding an indicator and and an icon to the tab
  • adding a position option to display the tab on the 4 sides of a page.

Relevant screenshots or logs

Screenshot 2020-04-27 at 3 05 41 PM

t.Flex.Spacing = layout.SpaceBetween
t.Flex.Layout(gtx, widgets...)
for i := range t.btns {
t.changed = false
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be outside the for. I'm not sure why it worked before

}

widgets := t.contentTabPosition(gtx, body)
t.Flex.Spacing = layout.SpaceBetween
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexport the Flex and set the spacing during the Tabs creation

Comment on lines 192 to 193
// contentTabPosition depending on the specified tab position determines the order of the tab and
// the page content.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you reword this?

)
}

// Tabs lays out a Flexed(Size) List with Selected as the first element and Item as the rest.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change this.

Comment on lines 51 to 53
// tabAlignment determines the alignment of the active tab indicator relative to the tab item
// content. It is determined by the position of the tab.
func indicatorDirection(tabPosition Position) layout.Direction {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wrong comment.

}
}

// indicator defines how the active tab indicator is drawn
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wrong comment.

// scrollButton lays out the right and left scroll buttons of the tab when Position is Horizontal.
func (t *Tabs) scrollButton(gtx *layout.Context, right bool, button *widget.Button) layout.FlexChild {
show := false
icon := mustIcon(NewIcon(icons.NavigationChevronLeft))
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Decoding the icon should be done before the icon needs to be laid out and done only once.

// Position determines what side of the page the tab would be laid out
type Position int

// TabItem displays a single child of a tab. Label and Icon in TabItem are optional.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If both Label and Icon are optional, what does it display when neither is present.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just tab items with the minimum width of the active indicator is displayed.

@oshorefueled oshorefueled merged commit 4d4aabc into planetdecred:master May 4, 2020
song50119 pushed a commit to song50119/godcr that referenced this pull request Apr 24, 2022
* add active indicator

* add alignment option with no icon

* add decred icons as bytes

* add tab to wallet pages

* make tab width and height adaptive

* display empty tab when no label defined

* add separator line to vertical tab

* add navigation arrows for horizontal tab

* add radius as optional to button widget
This pull request was closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants