项目中有个聊天页面,在Tab栏需要显示未读消息,好像哪个项目都有这样的需求,,,
在网上找了有好多BadgeView这样的控件,可以实现各式各样效果,但是我又不想要那么多主题,就自己写了一个,很简单的控件
首先上布局文件,很简单,就是几个布局嵌套,位置自由控制
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:id="@+id/main_tab_img"
android:layout_width="34dp"
android:layout_height="34dp"
android:layout_centerHorizontal="true" />
<TextView
android:id="@+id/main_tab_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/main_tab_img"
android:layout_centerHorizontal="true"
android:textColor="@color/tm_selector_hei2lan"
android:textSize="12dp" />
<TextView
android:id="@+id/main_tab_badge"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_marginRight="6dp"
android:layout_marginTop="2dp"
android:background="@drawable/ease_unread_count_bg"
android:gravity="center"
android:minWidth="20dp"
android:textColor="@color/white"
android:textSize="12dp"
android:visibility="gone" />
</merge>
不要奇怪为什么用merge标签,就是为了少嵌套一层
跟普通的自定义View没什么区别,定义需要声明的属性
<declare-styleable name="CustomTabView">
<attr name="tab_text" format="string" />
<attr name="tab_badge" format="string" />
<attr name="tab_img_src" format="reference|integer" />
<attr name="tab_checked" format="boolean" />
<attr name="tab_selected" format="boolean" />
<attr name="tab_badge_isshow" format="boolean" />
</declare-styleable>
最后就是用代码控制这几个控件了
首先要获取到布局并绑定控件
View.inflate(context, R.layout.custom_main_tab, this);
main_tab_img = (ImageView) findViewById(R.id.main_tab_img);
main_tab_tv = (TextView) findViewById(R.id.main_tab_tv);
main_tab_badge = (TextView) findViewById(R.id.main_tab_badge);
然后读取xml中声明的属性
TypedArray attributes = context.obtainStyledAttributes(attrs, R.styleable.CustomTabView);
if (attributes != null) {
//处理图片
int tabImg = attributes.getResourceId(R.styleable.CustomTabView_tab_img_src, -1);
main_tab_img.setImageResource(tabImg);
//处理文字
String tabTv = attributes.getString(R.styleable.CustomTabView_tab_text);
main_tab_tv.setText(tabTv);
//处理徽章
String tabBadgeTv = attributes.getString(R.styleable.CustomTabView_tab_badge);
boolean tabBadgeShow = attributes.getBoolean(R.styleable.CustomTabView_tab_badge_isshow, false);
main_tab_badge.setText(tabBadgeTv);
if (tabBadgeShow) {
main_tab_badge.setVisibility(VISIBLE);
} else {
main_tab_badge.setVisibility(GONE);
}
attributes.recycle();
}
然后是暴露出去方法来控制布局的显示形式
这个是用来标识当前是否被选中
public void setChecked(boolean isCheck) {
if (isCheck) {
main_tab_img.setSelected(true);
main_tab_tv.setSelected(true);
} else {
main_tab_img.setSelected(false);
main_tab_tv.setSelected(false);
}
}
用来标识当前有多少未读消息
(我写的是多于99就显示99+,可以自己改)
public void setTabBadge(int badgeInt) {
if (badgeInt <= 0) {
main_tab_badge.setVisibility(GONE);
} else if (badgeInt > 99) {
main_tab_badge.setVisibility(VISIBLE);
main_tab_badge.setText("99+");
} else {
main_tab_badge.setVisibility(VISIBLE);
main_tab_badge.setText(badgeInt + "");
}
}
下面的是更改上面的图片、文字、文字颜色
public void setTabImg(int imgRes) {
main_tab_img.setImageResource(imgRes);
}
public void setTabTv(String tvStr) {
main_tab_tv.setText(tvStr);
}
public void setTabTvColor(int tvColor) {
main_tab_tv.setTextColor(tvColor);
}
ok结束,等会上源码
—————–更新————–
加上了双击事件的监听,也是项目中的需求。哈哈哈
我用GestureDetector来监听双击事件的,完美,不需要自定义
上代码:下面这个方法是暴漏给外部调用的
public void setOnDoubleClick(OnDoubleClick onDoubleClick) {
//回调接口
this.onDoubleClick = onDoubleClick;
setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
return gestureDetector.onTouchEvent(event);
}
});
}
接下来的就是监听双击的方法
private GestureDetector gestureDetector = new GestureDetector(getContext(), new
GestureDetector.SimpleOnGestureListener() {
//发生确定的单击时执行
@Override
public boolean onSingleTapConfirmed(MotionEvent e) {
return super.onSingleTapConfirmed(e);
}
//双击发生时的通知
@Override
public boolean onDoubleTap(MotionEvent e) {
onDoubleClick.doubleClick();
return super.onDoubleTap(e);
}
//双击手势过程中发生的事件,包括按下、移动和抬起事件
@Override
public boolean onDoubleTapEvent(MotionEvent e) {
return super.onDoubleTapEvent(e);
}
});
最后通过回调接口把事件回调出去
public interface OnDoubleClick {
void doubleClick();
}
源码马上到。。。
源码:http://download.youkuaiyun.com/download/ximen_qing/9790125