PagerBottomTabStrip

An bottom navigation bar for Android

2,845

396

2,845

View on GitHub

Top Related Projects

BottomNavigationViewEx

3,450

An android lib for enhancing BottomNavigationView. 一个增强BottomNavigationView的安卓库。

BottomBar

8,421

(Deprecated) A custom view component that mimics the new Material Design Bottom Navigation pattern.

ahbottomnavigation

3,834

A library to reproduce the behavior of the Bottom Navigation guidelines from Material Design.

BottomNavigation

4,351

This Library helps users to use Bottom Navigation Bar (A new pattern from google) with ease and allows ton of customizations

Material-BottomNavigation

1,465

Bottom Navigation widget component inspired by the Google Material Design Guidelines at https://www.google.com/design/spec/components/bottom-navigation.html

NavigationTabStrip

2,236

Navigation tab strip with smooth interaction.

Quick Overview

PagerBottomTabStrip is an Android library that provides a customizable bottom navigation bar with a ViewPager. It offers a material design-inspired interface for switching between different sections of an app, supporting various styles, animations, and badge notifications.

Pros

Highly customizable with multiple built-in styles and animation options
Supports badge notifications for individual tabs
Easy integration with ViewPager for smooth navigation between fragments
Lightweight and easy to implement in Android projects

Cons

Limited documentation, especially for advanced customization
May require additional effort to adapt to specific design requirements
Not actively maintained, with the last update being several years ago
Lacks support for newer Android navigation patterns like the Navigation component

Code Examples

Basic implementation:

val navigationController = BottomNavigationBar.builder(this)
    .addItem(BottomNavigationItem("Home", R.drawable.ic_home))
    .addItem(BottomNavigationItem("Search", R.drawable.ic_search))
    .addItem(BottomNavigationItem("Profile", R.drawable.ic_profile))
    .build()

navigationController.setupWithViewPager(viewPager)

Adding a badge to a tab:

navigationController.setMessageNumber(1, 5) // Set badge with number 5 on second tab

Customizing tab appearance:

val navigationController = BottomNavigationBar.builder(this)
    .addItem(BottomNavigationItem("Home", R.drawable.ic_home))
    .addItem(BottomNavigationItem("Search", R.drawable.ic_search))
    .addItem(BottomNavigationItem("Profile", R.drawable.ic_profile))
    .setMode(BottomNavigationBar.MODE_FIXED)
    .setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC)
    .setActiveColor(R.color.colorPrimary)
    .setInActiveColor(R.color.colorGray)
    .build()

Getting Started

Add the dependency to your build.gradle file:

dependencies {
    implementation 'me.majiajie:pager-bottom-tab-strip:2.4.0'
}

Add the BottomNavigationBar to your layout XML:

<me.majiajie.pagerbottomtabstrip.BottomNavigationBar
    android:id="@+id/bottom_navigation_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"/>

Initialize and configure the BottomNavigationBar in your Activity or Fragment:

val navigationController = BottomNavigationBar.builder(this)
    .addItem(BottomNavigationItem("Home", R.drawable.ic_home))
    .addItem(BottomNavigationItem("Search", R.drawable.ic_search))
    .addItem(BottomNavigationItem("Profile", R.drawable.ic_profile))
    .build()

navigationController.setupWithViewPager(viewPager)

Competitor Comparisons

BottomNavigationViewEx

3,450

An android lib for enhancing BottomNavigationView. 一个增强BottomNavigationView的安卓库。

Pros of BottomNavigationViewEx

Built on top of the official Android BottomNavigationView, ensuring better compatibility and future updates
Offers more customization options, including badge support and custom typeface
Provides methods for programmatically selecting items and disabling shifting mode

Cons of BottomNavigationViewEx

Limited to the Material Design style, which may not suit all app designs
Requires the Android Support Library or AndroidX, potentially increasing app size
Less flexible in terms of custom animations compared to PagerBottomTabStrip

Code Comparison

PagerBottomTabStrip:

NavigationController navigationController = tab.material()
    .addItem(R.drawable.ic_home, "Home")
    .addItem(R.drawable.ic_search, "Search")
    .build();

BottomNavigationViewEx:

BottomNavigationViewEx bnve = findViewById(R.id.bnve);
bnve.enableAnimation(false);
bnve.enableShiftingMode(false);
bnve.enableItemShiftingMode(false);

Both libraries offer easy setup, but BottomNavigationViewEx provides more granular control over appearance and behavior through method chaining. PagerBottomTabStrip focuses on a more declarative approach to configuration.

BottomBar

8,421

(Deprecated) A custom view component that mimics the new Material Design Bottom Navigation pattern.

Pros of BottomBar

More customization options for appearance and behavior
Better documentation and examples
Larger community and more frequent updates

Cons of BottomBar

Slightly more complex implementation
Higher memory usage due to additional features

Code Comparison

PagerBottomTabStrip:

NavigationController navigationController = ((DefaultNavigationController) pagerBottomTabLayout.getNavigationController());
navigationController.addTab(new NormalItemView(this).initialize(R.drawable.ic_home, R.drawable.ic_home_selected, "Home"));
navigationController.addTab(new NormalItemView(this).initialize(R.drawable.ic_search, R.drawable.ic_search_selected, "Search"));

BottomBar:

BottomBar bottomBar = findViewById(R.id.bottomBar);
bottomBar.setOnTabSelectListener(new OnTabSelectListener() {
    @Override
    public void onTabSelected(@IdRes int tabId) {
        // Handle tab selection
    }
});

Both libraries provide easy-to-use bottom navigation bars for Android applications. PagerBottomTabStrip offers a simpler implementation with fewer features, while BottomBar provides more customization options and better documentation. BottomBar has a larger community and more frequent updates, but it may have slightly higher memory usage due to its additional features. The choice between the two depends on the specific requirements of your project and the level of customization needed.

ahbottomnavigation

3,834

A library to reproduce the behavior of the Bottom Navigation guidelines from Material Design.

Pros of ahbottomnavigation

More customization options for appearance and behavior
Supports badges and notifications out of the box
Better documentation and examples provided

Cons of ahbottomnavigation

Larger library size, potentially impacting app performance
Less frequent updates and maintenance compared to PagerBottomTabStrip
Steeper learning curve due to more complex API

Code Comparison

PagerBottomTabStrip:

BottomNavigationItem item = new BottomNavigationItem
    .Builder(context)
    .setIcon(R.drawable.ic_home)
    .setText("Home")
    .build();
bottomNavigation.addItem(item);

ahbottomnavigation:

AHBottomNavigationItem item = new AHBottomNavigationItem(
    "Home",
    ContextCompat.getDrawable(this, R.drawable.ic_home),
    ContextCompat.getColor(this, R.color.color_home)
);
bottomNavigation.addItem(item);

Both libraries offer similar functionality for creating bottom navigation bars in Android applications. PagerBottomTabStrip provides a simpler API and lighter footprint, making it easier to implement and potentially more performant. On the other hand, ahbottomnavigation offers more advanced features and customization options, which may be beneficial for complex applications requiring detailed control over the navigation bar's appearance and behavior.

BottomNavigation

4,351

This Library helps users to use Bottom Navigation Bar (A new pattern from google) with ease and allows ton of customizations

Pros of BottomNavigation

More comprehensive documentation and usage examples
Supports both fixed and shifting modes out of the box
Offers more customization options for tab appearance

Cons of BottomNavigation

Larger library size, potentially impacting app performance
Less frequent updates and maintenance compared to PagerBottomTabStrip

Code Comparison

PagerBottomTabStrip:

NavigationController navigationController = new NavigationController.Builder(this)
    .addItem(new BottomTabItem(R.drawable.ic_home, "Home"))
    .addItem(new BottomTabItem(R.drawable.ic_search, "Search"))
    .build();

BottomNavigation:

BottomNavigationBar bottomNavigationBar = findViewById(R.id.bottom_navigation_bar);
bottomNavigationBar
    .addItem(new BottomNavigationItem(R.drawable.ic_home, "Home"))
    .addItem(new BottomNavigationItem(R.drawable.ic_search, "Search"))
    .initialise();

Both libraries offer similar functionality for creating bottom navigation bars in Android applications. PagerBottomTabStrip provides a more lightweight solution with recent updates, while BottomNavigation offers more extensive customization options and documentation. The choice between the two depends on specific project requirements, such as the need for advanced features or a smaller library footprint.

Material-BottomNavigation

1,465

Bottom Navigation widget component inspired by the Google Material Design Guidelines at https://www.google.com/design/spec/components/bottom-navigation.html

Pros of Material-BottomNavigation

More comprehensive implementation of Material Design guidelines
Supports shifting mode for bottom navigation
Better integration with Android's native components

Cons of Material-BottomNavigation

Less customization options for tab appearance
More complex setup process
Limited support for ViewPager integration

Code Comparison

PagerBottomTabStrip:

NavigationController navigationController = tab.material()
    .addItem(R.drawable.ic_home, "Home", Color.BLUE)
    .addItem(R.drawable.ic_search, "Search", Color.RED)
    .build();

Material-BottomNavigation:

BottomNavigation bottomNavigation = findViewById(R.id.bottom_navigation);
bottomNavigation.setOnMenuItemClickListener(item -> {
    switch (item.getItemId()) {
        case R.id.action_home:
            // Handle home action
            return true;
        case R.id.action_search:
            // Handle search action
            return true;
    }
    return false;
});

PagerBottomTabStrip offers a more straightforward setup with a fluent API, while Material-BottomNavigation requires more boilerplate code but provides better integration with Android's native components. The former allows for easier customization of tab appearance, while the latter adheres more closely to Material Design guidelines and supports shifting mode for bottom navigation.

NavigationTabStrip

2,236

Navigation tab strip with smooth interaction.

Pros of NavigationTabStrip

More customizable appearance with various animation options
Supports both icon and text-based tabs
Offers a wider range of design possibilities

Cons of NavigationTabStrip

Less actively maintained (last update was 4 years ago)
Fewer stars and forks on GitHub, indicating potentially lower community adoption
Limited documentation and examples compared to PagerBottomTabStrip

Code Comparison

NavigationTabStrip:

<com.gigamole.navigationtabstrip.NavigationTabStrip
    android:layout_width="match_parent"
    android:layout_height="50dp"
    app:nts_active_color="#000"
    app:nts_inactive_color="#c4c4c4"
    app:nts_size="15sp"
    app:nts_weight="3dp"
    app:nts_factor="2.5"
    app:nts_titles="@array/titles"/>

PagerBottomTabStrip:

<me.majiajie.pagerbottomtabstrip.PageNavigationView
    android:id="@+id/tab"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:layout_alignParentBottom="true"
    android:background="#FFF" />

Both libraries offer easy-to-use XML implementations, but NavigationTabStrip provides more customization options directly in the XML, while PagerBottomTabStrip relies more on programmatic customization.

Convert designs to code with AI

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

PagerBottomTabStrip

|ä½¿ç¨æå|DEMO.apk

Android é¡µé¢åºé¨åä¾§è¾¹çå¯¼èªæ ã

æ¯æMaterial Designè§èçæ ·å¼
èªå¸¦æ¶æ¯åç¹
å¯å¨æå»ºå®æä¹åå¨æå¢å /å é¤å¯¼èªæé®ãä¿®æ¹å¾æ åæå
æ¹ä¾¿ééå¸¸ç¨çViewPager
æ¯æä¸Navigation Architecture Componentéåä½¿ç¨
æ¯æAndroidX

å®ç°ææå¾

èªå®ä¹æ©å±ä¾å

Libraryä¸å·²ç»å®ç°çä¸ä¸ªææ®éçææ

Demoä¸çä¾å	Demoä¸çä¾å

å¼å¥åº

repositories {
  mavenCentral()
}

dependencies {
  implementation 'me.majiajie:pager-bottom-tab-strip:2.4.0'
}

èç³»æ

QQ: 809402737

éè¯¯åé¦

è¿ä¸ªåºæBUGï¼è¯·ç¹è¿é Github Issues

Top Related Projects

Convert designs to code with AI

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

Top Related Projects

Quick Overview

Pros

Cons

Code Examples

Getting Started

Competitor Comparisons

Pros of BottomNavigationViewEx

Cons of BottomNavigationViewEx

Code Comparison

Pros of BottomBar

Cons of BottomBar

Code Comparison

Pros of ahbottomnavigation

Cons of ahbottomnavigation

Code Comparison

Pros of BottomNavigation

Cons of BottomNavigation

Code Comparison

Pros of Material-BottomNavigation

Cons of Material-BottomNavigation

Code Comparison

Pros of NavigationTabStrip

Cons of NavigationTabStrip

Code Comparison

Convert designs to code with AI

README

PagerBottomTabStrip

å®ç°ææå¾

èªå®ä¹æ©å±ä¾å­

å¼å ¥åº

èç³»æ

éè¯¯åé¦

Top Related Projects

Convert designs to code with AI

å®ç°ææå¾

èªå®ä¹æ©å±ä¾å

å¼å¥åº

èç³»æ

éè¯¯åé¦