3. ons-tabbar and segments

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

ons-tabbar and segments

  • R

    Is there a way to combine ons-tabbar and segments? I would like for the tabbar to look exactly like the segments. I was looking at the Onsenui CSS documentation here, but I am still confused as to how to go about this. I could not find any examples of the segment component in use.

    0 1 Reply
  • Onsen UI

    @rgins16 The segment is just CSS for now, although we will probably make a custom element with it soon. If you want to show a segment instead of a tabbar, here are a few ideas:

    • Make a modifier for ons-tabbar to make it look like a segment.
    • Hide ons-tabbar (tabbar.hide()), show the segment and then use tabbar.setActiveTabIndex(...) correspondingly on each segment button.
    • Create a custom “tab bar” where you simply have multiple pages at the same level but only show one of them (display:block). Toggle the display property according to the segment.
    0
  • R

    @Fran-Diox ahhh. I thought you guys already created the custom element and that I was missing something. Thanks for the tips! #2 looks promising.

    0