Android底部选项卡简单布局

之前做项目的时候经常会遇到选项卡配合fragment来切换界面,今天给大家分享个简单的选项卡的布局 上代码:
首先是xml布局 也是很简单 不需要写注释,
tabshow1.xml


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

    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="@dimen/lin_height"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true">

        <Button 
            android:id="@+id/bt1"
            style="@style/buttonStyle"
            android:drawableTop="@drawable/button_messege_selector"
            android:text="@string/button_messege"/>

        <Button 
            android:id="@+id/bt2"
            style="@style/buttonStyle"
            android:drawableTop="@drawable/button_person_selector"
            android:text="@string/button_person"/>

        <Button 
            android:id="@+id/bt3"
            style="@style/buttonStyle"
            android:drawableTop="@drawable/button_setting_selector"
            android:text="@string/button_setting"/>

    LinearLayout>
RelativeLayout>

接下来是xml涉及到的几个状态的文件
values 目录下styles里面加上buttonStyle

version="1.0" encoding="utf-8"?>

    

drawable下新建tab_textcolor.xml


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

    <item  android:state_selected="true" android:color="@color/color_bottom_text_press"/>
    <item android:state_selected="false" android:color="@color/color_bottom_text_normal"/>

selector>

drawable下新建button_messege_selector


<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/icon_message_press" android:state_selected="true"/>
    <item android:drawable="@drawable/icon_message_normal"/>
selector>

其他两个同上,只是换了icon图标而已;
String.xml

<string name="button_messege">消息string>
<string name="button_person">个人string>
<string name="button_setting">设置string>

dimens.xml

 <dimen name="button_paddingtop">5dpdimen>
 <dimen name="button_textsize">12dpdimen>
 <dimen name="lin_height">52dpdimen>

最后在activity里的代码

public class TabShow extends Activity implements OnClickListener{
    @ViewInject(R.id.bt1)
    private Button bt1;
    @ViewInject(R.id.bt2)
    private Button bt2;
    @ViewInject(R.id.bt3)
    private Button bt3;
    private Button[] button;
    private int index = 0;
    private int currentTabIndex = 0;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        super.onCreate(savedInstanceState);
        setContentView(R.layout.tabshow1);
        ViewUtils.inject(this);
        initListener();
        initView();
    }
    private void initView() {
        button = new Button[]{bt1,bt2,bt3};
        button[index].setSelected(true);
    }
    private void initListener() {
        bt1.setOnClickListener(this);
        bt2.setOnClickListener(this);
        bt3.setOnClickListener(this);
    }
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
        case R.id.bt1:
            index = 0;
            break;
        case R.id.bt2:
            index = 1;
            break;
        case R.id.bt3:
            index = 2;
            break;
        default:
            break;
        }
        if (currentTabIndex!=index) {
            button[currentTabIndex].setSelected(false);
            button[index].setSelected(true);
            currentTabIndex = index;
        }
    }
}

上一张效果图吧

Android底部选项卡简单布局_第1张图片

有需要xutils jar包的的留邮箱

你可能感兴趣的:(get新技能)