Android App自定义标题栏

一、前言

在android应用开发中,标题栏在界面设计中布局简单,但是复用率极高,因此封装特别必要。一个封装好的标题栏能够节约大量开发时间,而且易于维护。

二、需求分析(因具体项目而异)

1.常见样式

①只有标题内容

②有标题和左侧内容

③有标题和右侧内容

④有标题和两侧内容

⑤有两侧内容无标题

2.常见属性

①左中右是否显示

②左中右文字大小和颜色

③左右是文字or图标

④整体背景颜色

3.常见点击事件

①左侧点击事件

②右侧点击事件

4.其他

①需要适配状态栏

②背景颜色切换时,图标和文字属性自动切换(项目中背景色不为白色时,图标和文字颜色大多时候为白色)

③下划线和阴影

三、具体实现

1.父类最好为Toolbar,因为5.0好多新特性是需要和Toolbar搭配的

public class CustomToolBar extends Toolbar {

}

2.标题栏的高度参考actionBarSize就好

android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"

3.留一个View动态适配适配状态栏高度

    <FrameLayout
        android:id="@+id/fl_status"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="visible" />
FrameLayout fl_status = mView.findViewById(R.id.fl_status);
View statusBar = new View(getContext());
LayoutParams flp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT,                    Gravity.CENTER_HORIZONTAL);
flp.height = getStatusBarHeight(getContext());
fl_status.addView(statusBar,flp);

4.判断背景颜色是否为白色,如果不是文字颜色都改为白色,图标颜色渲染为白色并设置Drawable,例如:

 if (rightIcon != null){
         Drawable wrappedDrawable = DrawableCompat.wrap(rightIcon);
         DrawableCompat.setTintList(wrappedDrawable,
         ColorStateList.valueOf(Color.parseColor("#ffffff")));
         rightIcon = wrappedDrawable;
         setRightIcon(rightIcon);
  }

5.下划线用高度为1px或者1dp的View占位即可

    <View
        android:id="@+id/line"
        android:background="@color/line_color"
        android:layout_width="match_parent"
        android:layout_height="1px"/>

6.阴影分为5.0以上以及5.0以下

①>=5.0

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){
        setElevation(dp2px(5));
}

②<5.0用占位View设置渐变色即可,但是缺点是阴影会占据一定空间,因此demo中没有添加

7.属性汇总

名称 描述 值的类型
isFitStatusBar 是否适配状态栏,如果true,则会自定填充状态栏高度的留白 boolean
rightIcon 右侧图标 reference
leftIcon 左侧图标 reference
titleText 标题 String
rightText 右侧文字 String
leftText 左侧文字 String
isShowLeft 是否显示左侧内容(默认返回箭头) boolean
isShowBottomLine 是否显示底部隔线 boolean
isShowShadow 是否显示阴影(白色背景默认为true,其他背景默认为false,目前只支持5.0以上) boolean
bgColor 背景颜色(默认白色) reference
textColor 文字颜色 reference
rightTextColor 右侧文字颜色 reference
shadowColor 阴影的颜色 reference
titleTextSize 标题文字大小 dimension
leftTextSize 左侧文字大小 dimension
rightTextSize 右侧文字大小 dimension

8.方法汇总

名称 描述
setLeftOnClickListener(OnClickListener listener) 左侧点击事件监听
setRightOnClickListener(OnClickListener listener) 右侧点击事件监听
showTitleView() 展示标题
hideTitleView() 隐藏标题
showLeft() 显示左侧
showRight() 显示右侧
hideRight() 隐藏右侧
getRightView() 获取右侧父控件
getTitleView() 获取标题控件
getTextRight() 获取右侧文本控件
isWhiteBg() 是否白色背景
isTransparentBg() 是否透明背景
setTitle(int resId) 设置标题内容
setTitle(CharSequence title) 设置标题内容
setRightText(int id) 设置右侧文字
setLeftBackText(CharSequence text) 设置带返回箭头的文字
setRightText(CharSequence text) 设置右侧文字
setLeftText(int id) 设置左侧文字
setLeftText(CharSequence text) 设置左侧文字
setRightIcon(int icon) 设置右侧图片
setLeftIcon(int icon) 设置左侧图片
setRightIcon(Drawable icon) 设置右侧图片
setLeftIcon(Drawable icon) 设置左侧图片

四、Demo地址

https://github.com/JQMotee/customtoolbar

也可以直接引用到项目中

compile 'com.motee:toolbar:1.0.0'

猜你喜欢

转载自blog.csdn.net/jq_motee/article/details/80753297