国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

????? ?? ??? / Fragment實(shí)例精講——底部導(dǎo)航欄的實(shí)現(xiàn)(方法2)

Fragment實(shí)例精講——底部導(dǎo)航欄的實(shí)現(xiàn)(方法2)

本節(jié)引言:

上一節(jié)中我們使用LinearLayout + TextView實(shí)現(xiàn)了底部導(dǎo)航欄的效果,每次點(diǎn)擊我們都要重置 所有TextView的狀態(tài),然后選中點(diǎn)擊的TextView,有點(diǎn)麻煩是吧,接下來(lái)我們用另一種方法: RadioGroup + RadioButton來(lái)實(shí)現(xiàn)我們上一節(jié)的效果!


1.一些碎碎念

本節(jié)用到的是實(shí)現(xiàn)單選效果的RadioButton,如果你不熟悉,或者沒(méi)用過(guò),可先移步到:RadioButton簡(jiǎn)單點(diǎn)說(shuō)就是我們就是一個(gè)RadioGroup包著四個(gè)RadioButton,和前面一樣用比例來(lái)劃分:1:1:1:1;
另外我們只需重寫RadioGroup的onCheckedChange,判斷checkid即可知道點(diǎn)擊的是哪個(gè)RadioButton! 好的,下面開(kāi)始堆碼!


2.實(shí)現(xiàn)流程

PS:這里的素材什么的,直接使用的是上一節(jié)中的素材!另外drawable類的資源都是將selected 狀態(tài)修改成checked!


Step 1:寫底部選項(xiàng)的一些資源文件

圖片Drawable資源:tab_menu_channel.xml

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

其他三個(gè)照葫蘆畫瓢!

文字資源:tab_menu_text.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/text_yellow" android:state_checked="true" />
    <item android:color="@color/text_gray" />
</selector>

背景資源:tab_menu_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true">
        <shape>
            <solid android:color="#FFC4C4C4" />
        </shape>
    </item>
    <item>
        <shape>
            <solid android:color="@color/transparent" />
        </shape>
    </item>
</selector>

Step 2:編寫我們的Activity布局

在前面用TextView實(shí)現(xiàn)底部導(dǎo)航欄我們就發(fā)現(xiàn)了一個(gè)問(wèn)題,每個(gè)TextView的屬性都幾乎是差不多 的,而在建議那里我們也說(shuō)讓大家把相同的屬性抽取出來(lái)寫到Style中,可能部分朋友懶或者不知道 如何抽取出來(lái),以及用,這里就給大家示范下:

首先我們?nèi)〕銎渲幸粋€(gè)RadioGroup的標(biāo)簽:

<RadioButton
            android:id="@+id/rb_channel"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="../style/images/tab_menu_bg"
            android:button="@null"
            android:drawableTop="@drawable/tab_menu_channel"
            android:gravity="center"
            android:paddingTop="3dp"
            android:text="@string/tab_menu_alert"
            android:textColor="@drawable/tab_menu_text"
            android:textSize="18sp" />

我們可以把每個(gè)RadioButton都相同的屬性抽取出來(lái),寫到style.xml文件中:

<style name="tab_menu_item">
    <item name="android:layout_width">0dp</item>
    <item name="android:layout_weight">1</item>
    <item name="android:layout_height">match_parent</item>
    <item name="android:background">@drawable/tab_menu_bg</item>
    <item name="android:button">@null</item>
    <item name="android:gravity">center</item>
    <item name="android:paddingTop">3dp</item>
    <item name="android:textColor">@drawable/tab_menu_text</item>
    <item name="android:textSize">18sp</item>
</style>

然后我們的activity_main.xml中的RadioButton就用不著次次都寫相同的代碼了, 只需讓RadioButton的style="@style/tab_menu_item"就可以了!

activity_main.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:background="../style/images/bg_gray"
    tools:context=".MainActivity">


    <RelativeLayout
        android:id="@+id/ly_top_bar"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:background="../style/images/bg_topbar">

        <TextView
            android:id="@+id/txt_topbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_centerInParent="true"
            android:gravity="center"
            android:text="信息"
            android:textColor="@color/text_topbar"
            android:textSize="18sp" />

        <View
            android:layout_width="match_parent"
            android:layout_height="2px"
            android:layout_alignParentBottom="true"
            android:background="../style/images/div_white" />

    </RelativeLayout>

    <RadioGroup
        android:id="@+id/rg_tab_bar"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_alignParentBottom="true"
        android:background="../style/images/bg_white"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/rb_channel"
            style="@style/tab_menu_item"
            android:drawableTop="@drawable/tab_menu_channel"
            android:text="@string/tab_menu_alert" />

        <RadioButton
            android:id="@+id/rb_message"
            style="@style/tab_menu_item"
            android:drawableTop="@drawable/tab_menu_message"
            android:text="@string/tab_menu_profile" />

        <RadioButton
            android:id="@+id/rb_better"
            style="@style/tab_menu_item"
            android:drawableTop="@drawable/tab_menu_better"
            android:text="@string/tab_menu_pay" />

        <RadioButton
            android:id="@+id/rb_setting"
            style="@style/tab_menu_item"
            android:drawableTop="@drawable/tab_menu_setting"
            android:text="@string/tab_menu_setting"/>

    </RadioGroup>

    <View
        android:id="@+id/div_tab_bar"
        android:layout_width="match_parent"
        android:layout_height="2px"
        android:layout_above="@id/rg_tab_bar"
        android:background="../style/images/div_white" />

    <FrameLayout
        android:id="@+id/ly_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/div_tab_bar"
        android:layout_below="@id/ly_top_bar"></FrameLayout>

</RelativeLayout>

Step 3:隱藏頂部導(dǎo)航欄

AndroidManifest.xml設(shè)置下theme屬性

android:theme="@style/Theme.AppCompat.NoActionBar"

Step 4:創(chuàng)建一個(gè)Fragment的簡(jiǎn)單布局與類:

直接照搬上一節(jié)的布局跟Fragment:

fg_content.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="../style/images/bg_white">

    <TextView
        android:id="@+id/txt_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="呵呵"
        android:textColor="@color/text_yellow"
        android:textSize="20sp"/>

</LinearLayout>

MyFragment.java:

/**
 * Created by Coder-pig on 2015/8/29 0028.
 */
public class MyFragment extends Fragment {

    private String content;
    public MyFragment(String content) {
        this.content = content;
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fg_content,container,false);
        TextView txt_content = (TextView) view.findViewById(R.id.txt_content);
        txt_content.setText(content);
        return view;
    }
}

Step 5:編寫MainActivity.java

這個(gè)比起TextView實(shí)現(xiàn)簡(jiǎn)單多了,就不詳細(xì)講解了,很簡(jiǎn)單,直接上代碼:

MainActivity.java

/**
 * Created by Coder-pig on 2015/8/29 0028.
 */
public class MainActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener{

    private RadioGroup rg_tab_bar;
    private RadioButton rb_channel;

    //Fragment Object
    private MyFragment fg1,fg2,fg3,fg4;
    private FragmentManager fManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        fManager = getFragmentManager();
        rg_tab_bar = (RadioGroup) findViewById(R.id.rg_tab_bar);
        rg_tab_bar.setOnCheckedChangeListener(this);
        //獲取第一個(gè)單選按鈕,并設(shè)置其為選中狀態(tài)
        rb_channel = (RadioButton) findViewById(R.id.rb_channel);
        rb_channel.setChecked(true);
    }


    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        FragmentTransaction fTransaction = fManager.beginTransaction();
        hideAllFragment(fTransaction);
        switch (checkedId){
            case R.id.rb_channel:
                if(fg1 == null){
                    fg1 = new MyFragment("第一個(gè)Fragment");
                    fTransaction.add(R.id.ly_content,fg1);
                }else{
                    fTransaction.show(fg1);
                }
                break;
            case R.id.rb_message:
                if(fg2 == null){
                    fg2 = new MyFragment("第二個(gè)Fragment");
                    fTransaction.add(R.id.ly_content,fg2);
                }else{
                    fTransaction.show(fg2);
                }
                break;
            case R.id.rb_better:
                if(fg3 == null){
                    fg3 = new MyFragment("第三個(gè)Fragment");
                    fTransaction.add(R.id.ly_content,fg3);
                }else{
                    fTransaction.show(fg3);
                }
                break;
            case R.id.rb_setting:
                if(fg4 == null){
                    fg4 = new MyFragment("第四個(gè)Fragment");
                    fTransaction.add(R.id.ly_content,fg4);
                }else{
                    fTransaction.show(fg4);
                }
                break;
        }
        fTransaction.commit();
    }

    //隱藏所有Fragment
    private void hideAllFragment(FragmentTransaction fragmentTransaction){
        if(fg1 != null)fragmentTransaction.hide(fg1);
        if(fg2 != null)fragmentTransaction.hide(fg2);
        if(fg3 != null)fragmentTransaction.hide(fg3);
        if(fg4 != null)fragmentTransaction.hide(fg4);
    }

}

PS:在上一節(jié)忘記講一點(diǎn)了,F(xiàn)ragmentTransaction只能使用一次,每次使用都要調(diào)用FragmentManager 的beginTransaction()方法獲得FragmentTransaction事務(wù)對(duì)象哦!


3.運(yùn)行效果圖

其實(shí)和上一節(jié)實(shí)現(xiàn)的效果是一樣的:

1.gif


4.代碼下載:

FragmentDemo2.zipFragmentDemo2.zip 下載


5.本節(jié)小結(jié):

本節(jié)講解的是實(shí)現(xiàn)底部導(dǎo)航欄的第二種方法:RadioGroup + RadioButton,有了單選,我們 就不用像TextView一樣,每次點(diǎn)擊后先重置所有TextView的Selected狀態(tài),再讓點(diǎn)擊的TextView 的Selected為true,這樣就可以寫少一點(diǎn)代碼了~本節(jié)就到這里~謝謝