android開發學習筆記系列（5）--fragment與viewpage

前言

在前面的博客寫到我針對一個項目完成了動態佈局的效果，頓時感受很爽，那麼下面我針對我在前文中所講的tabhost的實現作出一個新的方法，tabhost基本已經被啓用，如今基本使用Fragment與viewpage進行實現相同的功能，在園子裏有不少這樣的博客，如今我在這裏呢，繼續是參考了一些博客進行了一些總結！

緣由：在加載過程當中，你會發現使用tabhost的內存資源比fragment大得多，所以我沒有不少的安卓的截圖的緣由在於我一直使用真機作開發，這樣雖然在博客園上不多可以圖文並茂，但也使開發的安卓軟件是真實可靠的，固然我沒有任何對使用虛擬機開發的人有任何意見。

特別是如今我徹底使用android studio進行開發，雖然這個IDE，我本身也不太熟悉，可是使用這個IDE仍是至關之方便的！還能看內存的使用狀況

Fragment簡介

好了，迴歸正途了，咱們今天要討論的是傳說中Fragment，這玩意能夠作好多事，就像咱們的Activity同樣，只要繼承這個類就能激發其各類能力！說說Fragment的實質吧

Fragment自Android3.0引入的API，能夠將其看做是Activity的子模塊，其英文翻譯是就是片斷的意思！

使用fragment的佈局文件

main_activity.xml

在這裏，我須要規定我使用的viewpage的局域與我使用的至關於tabhost的按鍵佈局文件

<LinearLayout 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"
    tools:context=".MainActivity"
    android:background="#f0f3f5"
    android:orientation="vertical"
    >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        >
     </android.support.v4.view.ViewPager>
    <include layout="@layout/bottom"
    />
   </LinearLayout>

include layout="@layout/bottom"表示我包含了一個叫bottom的layout文件

先看這個佈局的效果圖！

在這裏，咱們能夠知道上面的

那麼bottom這個文件咋麼寫呢？在這裏我還更改了button的樣式，讓頁面更加好看！

<?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="98px"
    android:orientation="horizontal"
    android:layout_gravity="center"
    android:background="#ffffff"
    android:layout_alignParentBottom="true"
    android:id="@+id/tab"
    >
  <LinearLayout
    android:id="@+id/tab_home"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_weight="1"
    android:clickable="true"

    >
    <RadioButton
        android:gravity="center"
        android:id="@+id/btnhometab"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        style="@style/Widget.AppCompat.ActionButton"
        android:checked="true"
        android:button="@null"
        android:text="首頁"
        android:textSize="10sp"
        android:drawableTop="@drawable/tab_home"
        android:textColor="@drawable/tab_text_color"
        android:clickable="false"
        />
</LinearLayout>
    <LinearLayout
    android:id="@+id/tab_activity"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_weight="1"
        android:clickable="true"
    >
        <RadioButton
            android:gravity="center"
            android:id="@+id/btnactivitytab"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            style="@style/Widget.AppCompat.ActionButton"
            android:checked="true"
            android:button="@null"
            android:text="活動"
            android:textSize="10sp"
            android:drawableTop="@drawable/tab_activity"
            android:textColor="@drawable/tab_text_color"
            android:clickable="false"
            />
</LinearLayout>
    <LinearLayout
        android:id="@+id/tab_me"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_weight="1"
        android:clickable="true"
        >
        <RadioButton
            android:gravity="center"
            android:id="@+id/btnmetab"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            style="@style/Widget.AppCompat.ActionButton"
            android:checked="true"
            android:button="@null"
            android:text="我"
            android:textSize="10sp"
            android:drawableTop="@drawable/tab_me"
            android:textColor="@drawable/tab_text_color"
            android:clickable="false"
            />
    </LinearLayout>
</LinearLayout>

咱們來看一下效果圖：

在這裏咱們能夠看到我將button的styke樣式改爲了actionButton樣式，固然，還有一點要注意的是我將linearout作爲了點擊事件，而底下的radiobutton使之觸發效果失效（android:clickable="false"）這樣可使沒點到圖片只要在這個區域內即可以實現點擊事件在textcolor這個屬性我又設置了

fragment配合viewpage實現tabhost外加活動功能！

咱們先來看一下我所相匹配的mainactivity文件

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.Window;
import android.widget.LinearLayout;
import android.widget.RadioButton;

import java.util.ArrayList;
import java.util.List;


public class MainActivity extends android.support.v4.app.FragmentActivity {


    /******
     *各種聲明
     */
    private ViewPager viewPager;

    private FragmentPagerAdapter pagerAdapter;
    private List<Fragment> fragments;

    private LinearLayout homeTab;
    private LinearLayout activityTab;
    private LinearLayout meTab;

    private RadioButton homeRbtn;
    private RadioButton activityRbtn;
    private RadioButton meRbtn;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        GetView();//你能夠先將其註釋掉
        initView();
        initEvent();
        setSelect(0);
    }
    /*****
     * 動態佈局實現 請參考我寫的動態佈局
     */
    private void GetView(){
        Autosize autosize = new Autosize();
        // 獲取實際的屏幕寬度
        autosize.setScreensize(autosize.Metricwidth(this));
        LinearLayout bottom = (LinearLayout) findViewById(R.id.tab);
        autosize.llinearlayoutheight(98,bottom);
    }
    /******
     * famage 處理
     *
     */
    private void initView() {

        viewPager = (ViewPager) findViewById(R.id.viewpager);

        //bottom的tab linearlayout id
        homeTab = (LinearLayout) findViewById(R.id.tab_home);
        activityTab = (LinearLayout) findViewById(R.id.tab_activity);
        meTab = (LinearLayout) findViewById(R.id.tab_me);

        homeRbtn = (RadioButton) findViewById(R.id.btnhometab);
        activityRbtn = (RadioButton) findViewById(R.id.btnactivitytab);
        meRbtn = (RadioButton) findViewById(R.id.btnmetab);

        fragments = new ArrayList<Fragment>();
        //添加tab
        fragments.add(new FragmentHome());
        fragments.add(new FragmentActivity());
        fragments.add(new FragmentMe());
        //相應的適配器
        pagerAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {

            @Override
            public android.support.v4.app.Fragment getItem(int position) {
                return fragments.get(position);
            }

            @Override
            public int getCount() {
                return fragments.size();
            }
        };
        // 綁定適配器
        viewPager.setAdapter(pagerAdapter);
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                int currentItem = viewPager.getCurrentItem();
                setTab(currentItem);
            }

            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });
    }
    //設置事件
    private  void initEvent(){
        View.OnClickListener listener = new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (v.getId()) {
                    case R.id.tab_home:
                        setSelect(0);
                        break;
                    case R.id.tab_activity:
                        setSelect(1);
                        break;
                    case R.id.tab_me:
                        setSelect(2);
                        break;
                    default:
                        break;

                }
            }
        };
        homeTab.setOnClickListener(listener);
        activityTab.setOnClickListener(listener);
        meTab.setOnClickListener(listener);

    }


    private void setTab(int i){
        resetbtn();
// 切換內容區域
        switch (i)
        {
            case 0:
                homeRbtn.setChecked(true);
                break;
            case 1:
                activityRbtn.setChecked(true);
                break;
            case 2:
                meRbtn.setChecked(true);
                break;
        }

    }
    private void setSelect(int i){
        viewPager.setCurrentItem(i);
        setTab(i);
    }

    private void resetbtn(){
        homeRbtn.setChecked(false);
        activityRbtn.setChecked(false);
        meRbtn.setChecked(false);
    }

}

相信你們對此有了必定的瞭解，我是經過radiobutton的不一樣狀態來肯定更改的顏色的！

tab_text_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="#64c32f"/>
    <!-- not selected -->
    <item android:state_checked="false" android:color="#000000"/>
</selector>

tab_me.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:state_checked="false"
        android:drawable="@drawable/firsttab2"/>
    <item
        android:state_checked="true"
        android:drawable="@drawable/firsttab" />
</selector>

經過這兩個xml文件，我作了相應的效果！

後記

後面我將寫一篇有關百度定位最新版本的使用博客，若是你喜歡我寫的博客呢！求關注！