FoldingTabBar Comes to Android. Thank You, Google!

A sort of UI revolution in Android development has happened recently. Ready for it?

Google finally added a bottom tab bar as a recommended design pattern for Android development! Hurray! Long live Google!

Obviously, there are no tab bar components by Google in the support libraries yet. So we decided that it’s time to bring our legendary FoldingTabBar to Android – before 2017 arrives.

In case you don’t know, we created FoldingTabBar for iOS about a year ago. FoldingTabBar for iOS quickly became popular, so we’re sure that the same Android Tab Bar will be just as popular.

Before we started building our Android library, we came across this implementation (for Android) of our original iOS design. But honestly, it’s far from perfect. There are lot of issues with code quality and implementation. We don’t recommend putting that piece of code in your app. Open source tab bar solutions weren't of satisying quality either.

Looks good. This is the menu that you’re using for dialogs, toolbar menus, or the navigation drawer. The coolest thing is that you can easily switch from the navigation drawer to our FoldingTabBar. Or you can use both menus simultaneously on the same screen; not all Android action bars have that flexibility.

Here’s an example of how you can implement our FoldingTabBar into your layout file:

We created two interfaces instead of one because this corresponds with the Interface Segregation principle (from SOLID).

Technology stack

We chose Kotlin as the language for our library. We already have a few components in Kotlin; we love Kotlin because it’s a powerful language that makes it much more fun to develop apps than Java does. It was a good fit for Android action bar development.

Collections

Here we’re using some functional “magic” of Kotlin collections:

mData = mMenu.visibleItems.map {
initAndAddMenuItem(it)
}

Also, note that we’ve used forEach instead of for loops.

Null Safety

This fantastic feature of Kotlin is used everywhere across our library (where needed, of course). Now our code is much cleaner and more understandable.

Lambda functions

We’ve only had this feature in Java since version 8. But Java 8 is not yet ready for Android. In Kotlin we have this feature by default.

Apply function

The apply function defines an extension function for all types. When you invoke the apply function, it calls the closure passed as a parameter and then returns the receiver object that the closure ran on. This is an amazing feature!

We constantly work on various open-source elements of navigation bar or styling tabs, and focus on providing high-quality open-source libraries for various purposes.

3.8/ 5.0

Article rating

10

Reviews

Remember those Facebook reactions? Well, we aren't Facebook but we love reactions too. They can give us valuable insights on how to improve what we're doing. Would you tell us how you feel about this article?