Android 开发之BottomBar+ViewPager+Fragment实现炫酷的底部导航效果

BottomBar

  BottomBar是Github上的一个开源框架,因为从1.3.3开始不支持fragments了,要自己配置,弄了很久,不管是app的fragment还是V4 的程序总是总是闪退。于是就用这种方式实现了,效果还不错。github有详细说明,多余的就不说了。

  这个roughike是这个项目的所有者(大神致敬)。

  我用的是Android studio开发,fragment全部导的V4的包(以为最开始就支持的是v4的,后面也支持了app.fragment).

首先是dependencies

compile 'com.jakewharton:butterknife:7.0.0'
compile 'com.roughike:bottom-bar:1.3.3'

添加第二个就行了,我这用到了butterknife(不知道的可以百度,出自jakewharton大神的一款View注入框架)。

从menu添加items

res/menu/bottombar_menu.xml

<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/bb_menu_recents" android:icon="@drawable/ic_recents" android:title="Recents" /> <item android:id="@+id/bb_menu_favorites" android:icon="@drawable/ic_favorites" android:title="Favorites" /> <item android:id="@+id/bb_menu_nearby" android:icon="@drawable/ic_nearby" android:title="Nearby" /> <item android:id="@+id/bb_menu_friends" android:icon="@drawable/ic_friends" android:title="Friends" /> <item android:id="@+id/bb_menu_food" android:icon="@drawable/ic_restaurants" android:title="Food" /> </menu>

在activity中初始化BottomBar和ViewPager

public class MainActivity extends FragmentActivity { @Bind(R.id.viewPager) ViewPager viewPager; @Bind(R.id.myCoordinator) CoordinatorLayout myCoordinator; private BottomBar mBottomBar; private List<Fragment> fragmentList; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ButterKnife.bind(this); initViewPager(); createBottomBar(savedInstanceState); } private void createBottomBar(Bundle savedInstanceState) { mBottomBar = BottomBar.attachShy(myCoordinator,viewPager, savedInstanceState); mBottomBar.setItemsFromMenu(R.menu.bottombar_menu, new OnMenuTabClickListener() { @Override public void onMenuTabSelected(@IdRes int menuItemId) { switch (menuItemId) { case R.id.bb_menu_recents: viewPager.setCurrentItem(0); break; case R.id.bb_menu_favorites: viewPager.setCurrentItem(1); break; case R.id.bb_menu_nearby: break; case R.id.bb_menu_friends: break; case R.id.bb_menu_food: break; } } @Override public void onMenuTabReSelected(@IdRes int menuItemId) { } }); // Setting colors for different tabs when there's more than three of them. // You can set colors for tabs in three different ways as shown below. mBottomBar.mapColorForTab(0, ContextCompat.getColor(this, R.color.colorAccent)); mBottomBar.mapColorForTab(1, 0xFF5D4037); mBottomBar.mapColorForTab(2, "#7B1FA2"); mBottomBar.mapColorForTab(3, "#FF5252"); mBottomBar.mapColorForTab(4, "#FF9800"); } @Override public void onSaveInstanceState(Bundle outState) { super.onSaveInstanceState(outState); // Necessary to restore the BottomBar's state, otherwise we would // lose the current tab on orientation change. mBottomBar.onSaveInstanceState(outState); } private void initViewPager() { fragmentList = new ArrayList<>(); fragmentList.add(new FragmentOne()); fragmentList.add(new FragmentTwo()); viewPager.setAdapter(new FragmentStatePagerAdapter(getSupportFragmentManager()) { @Override public Fragment getItem(int position) { return fragmentList.get(position); } @Override public int getCount() { return fragmentList.size(); } }); viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { mBottomBar.selectTabAtPosition(position, true); } @Override public void onPageScrollStateChanged(int state) { } }); } }

  BottomBar的github上提供了两种初始化方式,这里是第二种实现下滑隐藏,因为是fragment滚动所以fragment的布局要被NestedScrollView包裹(下面贴代码,很简单的),同时注意viewPager.setOnPageChangeListener已经过时了。

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/myCoordinator" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:context="com.example.bottombar.bottombar.MainActivity"> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="match_parent"/> </android.support.design.widget.CoordinatorLayout>

FragmentOne.Java

public class FragmentOne extends Fragment { View v; Context context; @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { v = inflater.inflate(R.layout.fragment_one, container,false); context = getActivity(); return v; } }

layout/fragment_one.xml

<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.NestedScrollView android:id="@+id/myScrollView" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:padding="20dp"> <TextView android:layout_centerInParent="true" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/baiduInfo"/> </RelativeLayout> </android.support.v4.widget.NestedScrollView>

以上所述是小编给大家介绍的Android 开发之BottomBar+ViewPager+Fragment实现炫酷的底部导航效果的相关知识,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

时间: 2024-10-26 23:46:57

Android 开发之BottomBar+ViewPager+Fragment实现炫酷的底部导航效果的相关文章

Android 开发之BottomBar+ViewPager+Fragment实现炫酷的底部导航效果_Android

BottomBar BottomBar是Github上的一个开源框架,因为从1.3.3开始不支持fragments了,要自己配置,弄了很久,不管是app的fragment还是V4 的程序总是总是闪退.于是就用这种方式实现了,效果还不错.github有详细说明,多余的就不说了. 这个roughike是这个项目的所有者(大神致敬). 我用的是Android studio开发,fragment全部导的V4的包(以为最开始就支持的是v4的,后面也支持了app.fragment). 首先是dependen

Android开发之Activity和Fragment生命周期对比图

一.Activity 生命周期 二.Fragment 生命周期 三.对比图 四.测试代码 [java] view plaincopy package com.goso.testapp;      import android.app.Activity;   import android.app.ListFragment;   import android.os.Bundle;   import android.util.Log;   import android.view.LayoutInfla

Android开发之ListView的head消失页面导航栏的渐变出现和隐藏_Android

1.Fragment页面xml布局: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"

Android开发之ListView的head消失页面导航栏的渐变出现和隐藏

1.Fragment页面xml布局: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"

消息推送的问题-Android开发之bmob消息推送

问题描述 Android开发之bmob消息推送 bmob实现消息推送时,部分手机收不到什么鬼?不论是指定或是发送所有手机. 解决方案 你检查过那些手机是否有网络吗? 解决方案二: 看看官文文档 介绍 或者换极光推动 或者 友盟的推送 解决方案三: 只是个别手机有问题,说明通道应该没问题,检查手机环境,或者联系服务商咨询

Android开发之ViewSwitcher用法实例_Android

本文实例讲述了Android开发之ViewSwitcher用法.分享给大家供大家参考,具体如下: android.widget.ViewSwitcher是ViewAnimator的子类,用于在两个View之间切换,但每次只能显示一个View. ViewSwitcher的addView函数的代码如下: /** * {@inheritDoc} * * @throws IllegalStateException if this switcher already contains two childre

Android开发之Animations动画用法实例详解_Android

本文实例讲述了Android开发之Animations动画用法.分享给大家供大家参考,具体如下: 一.动画类型 Android的animation由四种类型组成:alpha.scale.translate.rotate XML配置文件中 alpha 渐变透明度动画效果 scale 渐变尺寸伸缩动画效果 translate 画面转换位置移动动画效果 rotate 画面转移旋转动画效果 Java Code代码中 AlphaAnimation 渐变透明度动画效果 ScaleAnimation 渐变尺寸

Android开发之旅:android架构

引言 通过前面两篇: Android 开发之旅:环境搭建及HelloWorld Android 开发之旅:HelloWorld项目的目录结构 我 们对android有了个大致的了解,知道如何搭建android的环境及简单地写一个HelloWorld程序,而且知道一个android项目包括哪 些文件夹和文件及相应的作用.本篇将站在顶级的高度--架构,来看android.我开篇就说了,这个系列适合0基础的人且我也是从0开始按照这个步骤来 学的,谈架构是不是有点螳臂挡车,自不量力呢?我觉得其实不然,如

Android开发之旅:应用程序基础及组件

--成功属于耐得住寂寞的人,接下来几篇将讲述Android应用程序的原理及术语,可能会比较枯燥.如果能够静下心来看,相信成功将属于你. 引言 为了后面的例子做准备,本篇及接下来几篇将介绍Android应用程序的原理及术语,这些也是作为一个Android的开发人员必须要了解,且深刻理解的东西.本篇的主题如下: 1.应用程序基础 2.应用程序组件 2.1.活动(Activities) 2.2.服务(Services) 2.3.广播接收者(Broadcast receivers) 2.4.内容提供者(