Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> 標簽欄主界面實現(四)

標簽欄主界面實現(四)

編輯:關於Android編程

ViewPager + Fragment + TabPageIndicator 實現標簽欄主界面。

效果圖:

\


1、頭部的布局文件,這個很簡單:
  1.  
  2. android:layout_height="wrap_content"
  3. android:background="@color/light_blue"
  4. android:orientation="horizontal">
  5.  
  6.  
  7. android:layout_width="wrap_content"
  8. android:layout_height="wrap_content"
  9. android:layout_gravity="center_vertical"
  10. android:layout_marginLeft="8dp"
  11. android:layout_marginRight="4dp"
  12. android:src="@drawable/biz_navigation_tab_news_pressed"/>
  13.  
  14.  
  15. android:layout_width="wrap_content"
  16. android:layout_height="wrap_content"
  17. android:layout_gravity="center_vertical"
  18. android:layout_marginLeft="4dp"
  19. android:layout_marginRight="4dp"
  20. android:src="@drawable/base_action_bar_back_divider"/>
  21.  
  22.  
  23. android:id="@+id/headTV"
  24. android:layout_width="0dp"
  25. android:layout_height="wrap_content"
  26. android:layout_gravity="center_vertical"
  27. android:layout_marginLeft="4dp"
  28. android:layout_weight="1"
  29. android:text="CSDN資訊"
  30. android:textColor="@color/white"
  31. android:textSize="21sp"
  32. android:textStyle="bold">
  33.  
  34.  
  35.  
  36.  
  37.  

顯示一個圖標和標題。

 

2、主布局文件:
  1.  
  2. android:layout_width="match_parent"
  3. android:layout_height="match_parent"
  4. android:background="#eee"
  5. android:orientation="vertical">
  6.  
  7.  
  8.  
  9.  
  10.  
  11. android:id="@+id/id_indicator"
  12. android:layout_width="fill_parent"
  13. android:layout_height="wrap_content"
  14. android:background="@color/transparentblue">
  15.  
  16.  
  17.  
  18. android:id="@+id/id_pager"
  19. android:layout_width="fill_parent"
  20. android:layout_height="0dp"
  21. android:layout_weight="1"/>
  22.  
  23.  

一個TabPageIndicator和一個ViewPager。

3、主Activity
  1. packagecom.zhy.csdndemo;
  2.  
  3.  
  4. importcom.viewpagerindicator.TabPageIndicator;
  5.  
  6.  
  7. importandroid.os.Bundle;
  8. importandroid.support.v4.app.FragmentActivity;
  9. importandroid.support.v4.app.FragmentPagerAdapter;
  10. importandroid.support.v4.view.ViewPager;
  11.  
  12.  
  13. publicclassMainActivityextendsFragmentActivity
  14. {
  15. privateTabPageIndicatormIndicator;
  16. privateViewPagermViewPager;
  17. privateFragmentPagerAdaptermAdapter;
  18.  
  19.  
  20. @Override
  21. protectedvoidonCreate(BundlesavedInstanceState)
  22. {
  23. super.onCreate(savedInstanceState);
  24. setContentView(R.layout.activity_main);
  25.  
  26. mIndicator=(TabPageIndicator)findViewById(R.id.id_indicator);
  27. mViewPager=(ViewPager)findViewById(R.id.id_pager);
  28. mAdapter=newTabAdapter(getSupportFragmentManager());
  29. mViewPager.setAdapter(mAdapter);
  30. mIndicator.setViewPager(mViewPager,0);
  31.  
  32.  
  33.  
  34. }
  35.  
  36. }
TabAdapter.java
  1. packagecom.zhy.csdndemo;
  2.  
  3.  
  4. importandroid.support.v4.app.Fragment;
  5. importandroid.support.v4.app.FragmentManager;
  6. importandroid.support.v4.app.FragmentPagerAdapter;
  7.  
  8.  
  9. publicclassTabAdapterextendsFragmentPagerAdapter
  10. {
  11.  
  12.  
  13. publicstaticfinalString[]TITLES=newString[]{"業界","移動","研發","程序員雜志","雲計算"};
  14.  
  15.  
  16. publicTabAdapter(FragmentManagerfm)
  17. {
  18. super(fm);
  19. }
  20.  
  21.  
  22. @Override
  23. publicFragmentgetItem(intarg0)
  24. {
  25. MainFragmentfragment=newMainFragment(arg0);
  26. returnfragment;
  27. }
  28.  
  29.  
  30. @Override
  31. publicCharSequencegetPageTitle(intposition)
  32. {
  33. returnTITLES[position%TITLES.length];
  34. }
  35.  
  36.  
  37. @Override
  38. publicintgetCount()
  39. {
  40. returnTITLES.length;
  41. }
  42.  
  43. }

MainFragment.java

  1. packagecom.zhy.csdndemo;
  2.  
  3.  
  4. importandroid.annotation.SuppressLint;
  5. importandroid.os.Bundle;
  6. importandroid.support.v4.app.Fragment;
  7. importandroid.view.LayoutInflater;
  8. importandroid.view.View;
  9. importandroid.view.ViewGroup;
  10. importandroid.widget.TextView;
  11.  
  12.  
  13. @SuppressLint("ValidFragment")
  14. publicclassMainFragmentextendsFragment
  15. {
  16.  
  17.  
  18. privateintnewsType=0;
  19.  
  20.  
  21. publicMainFragment(intnewsType)
  22. {
  23. this.newsType=newsType;
  24. }
  25.  
  26.  
  27. @Override
  28. publicvoidonActivityCreated(BundlesavedInstanceState)
  29. {
  30. super.onActivityCreated(savedInstanceState);
  31. }
  32.  
  33.  
  34. @Override
  35. publicViewonCreateView(LayoutInflaterinflater,ViewGroupcontainer,BundlesavedInstanceState)
  36. {
  37. Viewview=inflater.inflate(R.layout.tab_item_fragment_main,null);
  38. TextViewtip=(TextView)view.findViewById(R.id.id_tip);
  39. tip.setText(TabAdapter.TITLES[newsType]);
  40. returnview;
  41. }
  42.  
  43.  
  44. }

4、在styles.xml中自定義Theme

  1.  
  2. @style/MyWidget.TabPageIndicator
  3. @drawable/init_pic
  4. true
  5. 5000
  6. @null
  7.  
  8.  
  9.  
  10. center
  11. @drawable/vpi__tab_indicator
  12. 22dip
  13. 22dip
  14. 8dp
  15. 8dp
  16. @style/MyTextAppearance.TabPageIndicator
  17. 16sp
  18. 1
  19.  
  20.  
  21.  
  22.  
  23. bold
  24. @color/black
  25.  
在AndroidManifest中注冊使用:
  1.  
  2. android:versionCode="1"
  3. android:versionName="1.0">
  4.  
  5.  
  6. android:minSdkVersion="13"
  7. android:targetSdkVersion="17"/>
  8.  
  9.  
  10. android:allowBackup="true"
  11. android:icon="@drawable/ic_launcher"
  12. android:label="@string/app_name"
  13. android:theme="@style/AppTheme">
  14. android:name="com.zhy.csdndemo.MainActivity"
  15. android:label="@string/app_name"
  16. android:theme="@style/MyTheme">
  17.  
  18.  
  19.  
  20.  
  21.  
  22.  
  23.  
  24.  
  25.  
  26.  
  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved