Android development bottombar+viewpager+fragment to achieve cool bottom navigation effect _android

Bottombar

Bottombar is an open source framework on GitHub, because fragments is not supported from 1.3.3, to configure itself for a long time, whether the app's fragment or V4 program always flashes. So it was achieved in this way, the effect is not bad. GitHub has detailed explanation, the superfluous will not say.

This roughike is the owner of the project (a tribute to the great God).

I'm using Android Studio development, fragment all the V4 packages (thought to be the first to support the V4, back to support the app.fragment).

First, dependencies.

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

Add a second on the line, I used to butterknife (do not know can Baidu, from the Jakewharton of the great God of a view injection framework).

Add Items from Menu

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"
@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>

Initialization of Bottombar and Viewpager in activity

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.
can set colors for tabs in three different ways as shown.
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 Resto
Re the Bottombar ' s state, otherwise we would//lose the current tab in orientation change.
Mbottombar.onsaveinstancestate (outstate); private void Initviewpager () {fragmentlist = new arraylist<> (); Fragmentlist.add (new Fragmentone ()); Fragmentlis
T.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) {Mbottom
Bar.selecttabatposition (position, true);
@Override public void onpagescrollstatechanged (int state) {}}); }
}

Bottombar's GitHub provides two types of initialization, and here is the second implementation slide hide, because it is fragment scrolling so fragment layout to be Nestedscrollview parcel (the following code, very simple), Also note that Viewpager.setonpagechangelistener is out of date.

Layout/activity_main.xml

<?xml version= "1.0" encoding= "Utf-8"?>
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>

The above is a small set to introduce the Android development of the bottombar+viewpager+fragment to achieve cool bottom navigation effect of the relevant knowledge, hope to help everyone, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!