Imitating Android app three

Source: Internet
Author: User

This is the next blog, and then, the change is after clicking on the Leftmenufragment, showing the firstfragment, now, we need to use Viewpager + in Firstfragment Fragment form to allow Firstfragment to show more content.

The general effect of the implementation is as follows:


The main idea is to click into the firstfragment as the content interface, we add a layout file for Firstfragment, which contains fragment + Viewpager. Use Fragmentpageradapter to bind data.

The main code is as follows:

Import Java.util.arraylist;import java.util.list;import Android.graphics.color;import Android.os.Bundle;import Android.support.v4.app.fragment;import Android.support.v4.app.fragmentpageradapter;import Android.support.v4.view.viewpager;import Android.support.v4.view.viewpager.onpagechangelistener;import Android.util.displaymetrics;import Android.view.display;import Android.view.layoutinflater;import Android.view.view;import Android.view.view.onclicklistener;import Android.view.viewgroup;import Android.view.viewgroup.layoutparams;import Android.widget.imageview;import Android.widget.linearlayout;import Android.widget.textview;import Com.example.mytoolbar_04.r;import com.example.mytoolbar_04. Fragment.firstfragments.tab01;import Com.example.mytoolbar_04.fragment.firstfragments.tab02;import Com.example.mytoolbar_04.fragment.firstfragments.tab03;public class Firstfragment extends fragment implements Onclicklistener{private View mfirstfragmentview;private Viewpager mviewpager;private TextView Tab_01;private TextView tab_02;private TextView tab_03;private ImageView mimageview;private fragmentpageradapter madapter;private list<fragment> datas;private int width_1_3;private int currentpadgeindex = 0; @Overridepublic View Oncreateview (layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) {Mfirstfragmentview = Inflater.inflate (r.layout.first_page, null); Intiview (); Intievent (); Inittabline (); TAB01 view_01 = new Tab01 (); TAB02 view_02 = new TAB02 (); TAB03 view_03 = new Tab03 ();d atas = new arraylist<fragment> ();d atas.add (view_01);d atas.add (view_02);d Atas.add ( VIEW_03) Madapter = new Fragmentpageradapter (Getfragmentmanager ()) {public int getcount () {return datas.size (); Public Fragment getItem (int arg0) {return datas.get (arg0);}}; Mviewpager.setadapter (Madapter); Mviewpager.setonpagechangelistener (new Myonpagechangelistener ()); return Mfirstfragmentview;} Class Myonpagechangelistener implements onpagechangelistener{public void onpagescrollstatechanged (int arg0) {}puBlic void onpagescrolled (int arg0, float arg1, int arg2) {linearlayout.layoutparams LP = ( Android.widget.LinearLayout.LayoutParams) Mimageview. Getlayoutparams (); if (Currentpadgeindex = = arg0) { Lp.leftmargin = (int) (Width_1_3 * (Currentpadgeindex + arg1));} Else{lp.leftmargin = (int) (Width_1_3 * (currentPadgeIndex-1 + arg1));} MIMAGEVIEW.SETLAYOUTPARAMS (LP);} @Overridepublic void onpageselected (int arg0) {resettextcolor (); switch (arg0) {case 0:tab_01.settextcolor ( Color.parsecolor ("#008000")), Break;case 1:tab_02.settextcolor (Color.parsecolor ("#008000")), Break;case 2:tab_03. SetTextColor (Color.parsecolor ("#008000")); Currentpadgeindex = arg0;}} private void Inittabline () {Display display = Getactivity (). GetWindow (). Getwindowmanager (). Getdefaultdisplay ();D Isplaymetrics outmetrics = new Displaymetrics ();d isplay.getmetrics (outmetrics); width_1_3 = OUTMETRICS.WIDTHPIXELS/3; Layoutparams LP = Mimageview.getlayoutparams (); lp.width = WIDTH_1_3;MIMAGEVIEW.SETLAYOUTPARAMS (LP);} private void inTievent () {Tab_01.setonclicklistener (this), Tab_02.setonclicklistener (This), Tab_03.setonclicklistener (this);} private void Intiview () {Mviewpager = (Viewpager) Mfirstfragmentview.findviewbyid (r.id.id_viewpager); tab_01 = ( TextView) Mfirstfragmentview.findviewbyid (r.id.id_fist_tab); tab_02 = (TextView) Mfirstfragmentview.findviewbyid ( R.id.id_second_tab); tab_03 = (TextView) Mfirstfragmentview.findviewbyid (r.id.id_third_tab); Mimageview = (ImageView) Mfirstfragmentview.findviewbyid (R.id.id_imageview);} @Overridepublic void OnClick (View v) {resettextcolor (); Linearlayout.layoutparams LP = (android.widget.LinearLayout.LayoutParams) mimageview. Getlayoutparams (); lp.width = Width_1_3;switch (V.getid ()) {Case r.id.id_fist_tab:lp.leftmargin = 0;tab_01.settextcolor (Color.parsecolor ("#008000 "); Mviewpager.setcurrentitem (0); Break;case r.id.id_second_tab:lp.leftmargin = Width_1_3;tab_02.settextcolor ( Color.parsecolor ("#008000")); Mviewpager.setcurrentitem (1); Break;case R.id.id_third_tab:lp.leftmargin = width_1_3 * 2;mviewpager.setcurrentitem (2); Tab_03.settextcolor (Color.parsecolor ("#008000"); break;} MIMAGEVIEW.SETLAYOUTPARAMS (LP);} private void Resettextcolor () {Tab_01.settextcolor (Color.parsecolor ("#000000")); Tab_02.settextcolor ( Color.parsecolor ("#000000")); Tab_03.settextcolor (Color.parsecolor ("#000000"));}}


Firstfragment's Layout file

<?xml version= "1.0" encoding= "Utf-8"? ><linearlayout xmlns:android= "http://schemas.android.com/apk/res/ Android "Android:layout_width=" Match_parent "android:layout_height=" match_parent "android:orientation=" vertical " > <linearlayout android:id= "@+id/id_titlebar" android:layout_width= "Match_parent" Android:la yout_height= "40DP" android:orientation= "horizontal" > <textview android:id= "@+id/id_fist_ta B "Android:layout_width=" Wrap_content "android:layout_height=" Match_parent "android:layou        t_weight= "1" android:gravity= "center" android:text= "Cantonese Opera song" android:textsize= "16sp"/> <textview android:id= "@+id/id_second_tab" android:layout_width= "Wrap_content" an droid:layout_height= "Match_parent" android:layout_weight= "1" android:gravity= "center" and roid:text= "Cantonese Opera Pictures" Android: textsize= "16sp"/> <textview android:id= "@+id/id_third_tab" android:layout_width= "wrap _content "android:layout_height=" Match_parent "android:layout_weight=" 1 "android:gravity=         "Center" android:text= "Cantonese Opera News" android:textsize= "16sp"/> </LinearLayout> <imageview Android:id= "@+id/id_imageview" android:layout_width= "match_parent" android:layout_height= "Wrap_conte NT "android:background=" @drawable/tabline "/> <android.support.v4.view.viewpager android:id=" @+id/i D_viewpager "android:layout_width=" match_parent "android:layout_height=" match_parent "> </android.s Upport.v4.view.viewpager></linearlayout>

Then the fragment nested inside the firstfragment, they just contain a textview, need to add a complex layout for them, and then handle the corresponding event. For example, display a news list, and then click the ListView to start an activity display list of details, which is similar to the NetEase news client.


Poke me Download source code: Source Download

Imitating Android app three

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.