tab的简单写法

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:id="@+id/fragment_layout"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
    </FrameLayout>

    <include layout="@layout/view_toolsbar"></include>

</LinearLayout>

tab栏 view_toolsbar.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="58dp">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="1px"
        android:background="#949494" />


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_vertical"
        android:orientation="horizontal">

        <Button
            android:id="@+id/id_tools1"
            style="@style/toolsItem"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/tools_icon"
            android:text="首页" />

        <Button
            android:id="@+id/id_tools2"
            style="@style/toolsItem"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/tools_icon"
            android:text="应用" />

        <Button
            android:id="@+id/id_tools3"
            style="@style/toolsItem"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/tools_icon"
            android:text="游戏" />

        <Button
            android:id="@+id/id_tools4"
            style="@style/toolsItem"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/tools_icon"
            android:text="发现" />

        <Button
            android:id="@+id/id_tools5"
            style="@style/toolsItem"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/tools_icon"
            android:text="管理" />

    </LinearLayout>
</FrameLayout>

这里用到了图片资源 tools_icon.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_selected="true" android:drawable="@drawable/tools_icon_s" />

    <!--<item android:state_pressed="true" android:drawable="@drawable/tools_icon_p" />-->

    <item android:drawable="@drawable/tools_icon_n" />

</selector>

每个按钮也用到了样式

    <style name="toolsItem">
        <item name="android:drawablePadding">2dp</item>
        <item name="android:paddingTop">6dp</item>
        <item name="android:textSize">13sp</item>
    </style>

以上XML基本完成

接着就是写MainActivity.java

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private Button tab1, tab2, tab3, tab4, tab5;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    @Override
    protected void onStart() {
        super.onStart();
        setTools(tab1);
        tab1.setSelected(true);
    }

    private void initView() {
        tab1 = (Button) findViewById(R.id.id_tools1);
        tab2 = (Button) findViewById(R.id.id_tools2);
        tab3 = (Button) findViewById(R.id.id_tools3);
        tab4 = (Button) findViewById(R.id.id_tools4);
        tab5 = (Button) findViewById(R.id.id_tools5);
        tab1.setOnClickListener(this);
        tab2.setOnClickListener(this);
        tab3.setOnClickListener(this);
        tab4.setOnClickListener(this);
        tab5.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.id_tools1:
                setTools(tab1);
                break;
            case R.id.id_tools2:
                setTools(tab2);
                break;
            case R.id.id_tools3:
                setTools(tab3);
                break;
            case R.id.id_tools4:
                setTools(tab4);
                break;
            case R.id.id_tools5:
                setTools(tab5);
                break;
        }
    }

    private void setTools(Button v) {
        tab1.setTextColor(Color.BLACK);
        tab1.setSelected(false);
        tab2.setTextColor(Color.BLACK);
        tab2.setSelected(false);
        tab3.setTextColor(Color.BLACK);
        tab3.setSelected(false);
        tab4.setTextColor(Color.BLACK);
        tab4.setSelected(false);
        tab5.setTextColor(Color.BLACK);
        tab5.setSelected(false);
        v.setTextColor(Color.RED);
        v.setSelected(true);
    }

}

基本完成了一个简单的tab切换