/Tinderbar

🔥 Tinder hooks up with Tabman

Primary LanguageSwiftMIT LicenseMIT

Tinderbar Tinderbar

🤔 About

Tinderbar is a recreation of the Tinder iOS app's navigation hierarchy using Tabman, a showcase of creating custom Tabman components.

Requirements

Latest version of Xcode.

🚀 Components

Tinderbar uses Tabman for its primary navigation bar and also sub navigation within the Messages section.

🔥 TinderBar

A TMBarView embedded in a TMSystemBar, added to the .top.

TMBarView<TinderBarLayout, TinderBarButton, TMBarIndicator.None>

It uses a custom layout in the form of TinderBarLayout and custom TinderBarButton bar buttons.

TinderBarLayout

  • Uses a horizontal stack view for buttons.
  • Buttons are inserted into a container, which is constrained to be 0.5x the width of the layoutGuide.
  • Padding views of 0.25x the layoutGuide are inserted at the leading and trailing edges of the stack.
  • Buttons are centered along the X-axis of their container, with a constant that is updated as the layout focusArea is adjusted (they are centered when selected, and offsetted when unselected to ensure they don't venture off screen).

TinderBarButton

  • A TMBarButton which consists of an image view.
  • Image view tint color transitions between unselectedTintColor and tintColor.
  • Image view scales to 1.0 when selected and 0.8 when unselected.

MessageBar

A more regular TMBarView using stock Tabman components, added to the .top.

TMBarView<TMHorizontalBarLayout, TMLabelBarButton, TMBarIndicator.None>
  • contentMode of the layout is set to .fit.

👨🏻‍💻 About

👮🏻‍♂️ License

The library is available as open source under the terms of the MIT License.