使用BottomTabBar+Fragment实现底部导航页

  注:详细见链接

   http://www.jianshu.com/p/ade8485a16be

1、导入依赖

   compile 'com.hjm:BottomTabBar:1.1.1'
2、在XML中定义控件

     <com.hjm.bottomtabbar.BottomTabBar
         android:id="@+id/fragment"
         android:layout_width="match_parent"
         android:layout_height="match_parent">
     </com.hjm.bottomtabbar.BottomTabBar>
3、定义每一个Fragment这里只列举一个
   public class FragmentFour extends Fragment {
       @Nullable
       @Override
       public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
           View view = View.inflate(getActivity(),R.layout.fragmentfour,null);
           return view;
         }
   }
4、MainActivity中的设置

    public class MainActivity extends AppCompatActivity {
        private BottomTabBar fragment;
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            fragment = findViewById(R.id.fragment);
            fragment.init(getSupportFragmentManager())
                .setImgSize(50,50)
                .setFontSize(8)
                .setTabPadding(4,6,10)
                .setChangeColor(Color.RED,Color.DKGRAY)
                .addTabItem("月光茶人",R.drawable.tab_home, FragmentOne.class)
                .addTabItem("优惠",R.drawable.tab_topic, FragmentThree.class)
                .addTabItem("购物车",R.drawable.ic_launcher_background, FragmentTwwo.class)
                .addTabItem("我的",R.drawable.ic_launcher_background, FragmentFour.class)
                .isShowDivider(false)
                .setOnTabChangeListener(new BottomTabBar.OnTabChangeListener() {
                     @Override
                    public void onTabChange(int position, String name) {
                    }
               });
        }
    }
             




  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ViewPager和Fragment可以很好地实现底部导航的功能。下面是一些实现方法: 1. 创建一个包含ViewPager和底部导航的布局文件,底部导航可以使用TabLayout或者自定义的布局。 2. 创建Fragment类,每个Fragment表示一个底部导航项对应的页面内容。 3. 创建PagerAdapter类,继承自FragmentPagerAdapter或者FragmentStatePagerAdapter,用于管理ViewPager中的Fragment。 4. 在Activity中找到ViewPager和TabLayout(或者自定义的底部导航),设置PagerAdapter和TabLayout的关联。 5. 实现TabLayout的OnTabSelectedListener接口,在回调方法中切换ViewPager的当前页面。 6. 在Fragment中添加需要展示的布局和逻辑代码。 下面是一个示例代码: MainActivity.java ``` public class MainActivity extends AppCompatActivity implements TabLayout.OnTabSelectedListener { private ViewPager viewPager; private TabLayout tabLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); viewPager = findViewById(R.id.viewPager); tabLayout = findViewById(R.id.tabLayout); PagerAdapter adapter = new PagerAdapter(getSupportFragmentManager()); viewPager.setAdapter(adapter); tabLayout.setupWithViewPager(viewPager); tabLayout.addOnTabSelectedListener(this); } @Override public void onTabSelected(TabLayout.Tab tab) { viewPager.setCurrentItem(tab.getPosition()); } @Override public void onTabUnselected(TabLayout.Tab tab) { } @Override public void onTabReselected(TabLayout.Tab tab) { } private static class PagerAdapter extends FragmentPagerAdapter { private static final int NUM_PAGES = 3; public PagerAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int position) { switch (position) { case 0: return new HomeFragment(); case 1: return new NewsFragment(); case 2: return new SettingsFragment(); default: return null; } } @Override public int getCount() { return NUM_PAGES; } @Override public CharSequence getPageTitle(int position) { switch (position) { case 0: return "Home"; case 1: return "News"; case 2: return "Settings"; default: return null; } } } } ``` activity_main.xml ``` <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="match_parent"/> <android.support.design.widget.TabLayout android:id="@+id/tabLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:background="@android:color/white"/> </RelativeLayout> ``` HomeFragment.java ``` public class HomeFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_home, container, false); // 添加布局和逻辑代码 return view; } } ``` NewsFragment.java ``` public class NewsFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_news, container, false); // 添加布局和逻辑代码 return view; } } ``` SettingsFragment.java ``` public class SettingsFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_settings, container, false); // 添加布局和逻辑代码 return view; } } ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值