android实现对导航Tab设置下划线选中效果

android实现对导航Tab设置下划线选中效果

技术人员核心竞争力还是技术啊。努力提高各种实现效果。加油哦!

直接看效果。此linearLayout只有两个Button ,当选中Button1,Button1有个下划线选中效果。当选中Buton2,Button2有个下划线选中效果。

如下图。

android实现对导航Tab设置下划线选中效果

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文件吧

android实现对导航Tab设置下划线选中效果android实现对导航Tab设置下划线选中效果

<?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下载地址:点击进入我的百度网盘下载

上一篇:玩转 H5 下拉上滑动效果


下一篇:Ubuntu16---安装mysql5.7未提示输入密码,安装后修改mysql密码默认密码