android實現對導航Tab設定底線選中效果

標籤：android   android開發   

直接看效果。此linearLayout只有兩個Button ,當選中Button1,Button1有個底線選中效果。當選中Buton2，Button2有個底線選中效果。

如。

 

package com.daoge.ui;import roboguice.activity.RoboActivity;import roboguice.inject.InjectView;import android.graphics.drawable.Drawable;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;import android.widget.LinearLayout;import com.daoge.utils.DensityUtils;import com.daoge.utils.ResourceReader;import com.roboguicetest.R;public class MainActivity extends RoboActivity implements OnClickListener {    @InjectView(R.id.btnTab001)    Button btnTab001;    @InjectView(R.id.btnTab002)    Button btnTab002;    @InjectView(R.id.layout_tab)    LinearLayout layout_tab;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.test_layout);        initAllViews();    }    private void initAllViews() {        btnTab001.setOnClickListener(this);        btnTab002.setOnClickListener(this);    }    public void onClick(View v) {        switch (v.getId()) {            case R.id.btnTab001 :                setTabSelected(btnTab001);                break;            case R.id.btnTab002 :                setTabSelected(btnTab002);                break;            default :                break;        }    }    private void setTabSelected(Button btnSelected) {        Drawable selectedDrawable = ResourceReader.readDrawable(this, R.drawable.shape_nav_indicator);        int screenWidth = DensityUtils.getScreenSize(MainActivity.this)[0];        int right = screenWidth / 2;        selectedDrawable.setBounds(0, 0, right, DensityUtils.dipTopx(this, 3));        btnSelected.setSelected(true);        btnSelected.setCompoundDrawables(null, null, null, selectedDrawable);        int size = layout_tab.getChildCount();        for (int i = 0; i < size; i++) {            if (btnSelected.getId() != layout_tab.getChildAt(i).getId()) {                layout_tab.getChildAt(i).setSelected(false);                ((Button) layout_tab.getChildAt(i)).setCompoundDrawables(null, null, null, null);            }        }    }}

最重要的代碼在這裡 ：

private void setTabSelected(Button btnSelected) {        Drawable selectedDrawable = ResourceReader.readDrawable(this, R.drawable.shape_nav_indicator);        int screenWidth = DensityUtils.getScreenSize(MainActivity.this)[0];        int right = screenWidth / 2;        selectedDrawable.setBounds(0, 0, right, DensityUtils.dipTopx(this, 3));        btnSelected.setSelected(true);        btnSelected.setCompoundDrawables(null, null, null, selectedDrawable);        int size = layout_tab.getChildCount();        for (int i = 0; i < size; i++) {            if (btnSelected.getId() != layout_tab.getChildAt(i).getId()) {                layout_tab.getChildAt(i).setSelected(false);                ((Button) layout_tab.getChildAt(i)).setCompoundDrawables(null, null, null, null);            }        }    }

得到這個Drawable，那麼這個Drawable從哪裡來呢？？

R.drawable.shape_nav_indicator

看這個drawable.shape檔案吧

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="rectangle" >    <solid android:color="@color/global_red" />    <size android:width="1000dp" />    <padding        android:bottom="2dp"        android:left="5dp"        android:right="5dp"        android:top="2dp" /></shape>

該Demo：http://pan.baidu.com/s/1jGGG0gm

其他精彩文章文章

在 android dialog中使用Autocompletetext 
大型網站架構設計-Solr
mysql雜湊索引
android學習筆記（32）網格視圖（GridView )和圖形切換器（ImageSwi...
android學習筆記（31）可展開的列表組件（ExpandableListView )

更多關於android開發文章

android實現對導航Tab設定底線選中效果