当前位置： 移动技术网 > IT编程>移动开发>Android > Android自定义TitleView标题开发实例

Android自定义TitleView标题开发实例

2019年07月24日  | 移动技术网IT编程  | 我要评论

情乱艳花录,张家界日报,决胜焦点

android开发过程中，经常遇到一个项目需要重复的定义相同样式的标题栏，android相继推出了actionbar, toolbar, 相信有用到的朋友也会遇到一些不如意的时候，比如标题栏居中时，需要自定义xml文件给toolbar等，不了解actionbar,toolbar的可以去找相应的文章了解，这里介绍自定义titlebar满足国内主题风格样式的情况。

为了提前看到效果，先上效果图：

前期准备

1.为标题栏titleview预定义id，在values下的ids.xml中

<?xml version="1.0" encoding="utf-8"?>
<resources>
<item name="tv_title_name" type="id"/>
<item name="tv_left_text" type="id"/>
<item name="iv_left_image" type="id"/>
<item name="iv_right_image" type="id"/>
<item name="iv_right_image_two" type="id"/>
<item name="tv_right_text" type="id"/>
<item name="tv_right_text_two" type="id"/>
</resources>

这里可以看到定义了左侧返回按钮id,标题id，后侧按钮id，左侧分两种情况：imageview/textview,右侧可以同时存在两个按钮，图片按钮、文字按钮组合。

2.自定义标题栏属性，在valuse下的attr.xml中

<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- 标题属性 -->
<declare-styleable name="titleattr">
<attr name="title_name" format="reference|string"/>
<attr name="title_text_color" format="reference|color"/>
<attr name="title_drawable_right" format="reference"/>
<attr name="title_drawable_left" format="reference"/>
<attr name="title_text_size" format="reference|dimension"/>
<attr name="left_text" format="reference|string"/>
<attr name="left_image" format="reference"/>
<attr name="small_text_size" format="reference|dimension"/>
<attr name="title_gravity">
<enum name="left" value="3"/>
<enum name="center" value="17"/>
<enum name="right" value="5"/>
</attr>
<attr name="right_image" format="reference"/>
<attr name="right_text" format="reference|string"/>
<attr name="right_image_two" format="reference"/>
<attr name="right_text_two" format="reference|string"/>
<attr name="title_height" format="dimension"/>
<attr name="right_text_drawable_right" format="reference"/>
<attr name="right_text_drawable_left" format="reference"/>
<attr name="right_text_two_drawable_right" format="reference"/>
<attr name="right_text_two_drawable_left" format="reference"/>
<attr name="left_text_drawable_right" format="reference"/>
<attr name="left_text_drawable_left" format="reference"/>
</declare-styleable>
</resources>

•编码实现

• 有了前面的准备后，现在就可以开始编码实现了，这里先看看在xml中如何引入我们自定义的控件：

<com.jarek.library.titleview
android:id="@+id/title_main"
android:layout_width="match_parent"
android:background="#0093fe"
title:title_name="标题"
title:right_text="@string/more"
title:title_text_color="@android:color/white"
title:right_image_two="@mipmap/icon_crop_rotate"
title:title_text_size="20sp"
title:small_text_size="15sp"
title:left_text="返回"
title:left_text_drawable_left="@mipmap/back_normal"
title:right_text_drawable_right="@mipmap/bar_button_right"
android:layout_height="50dp"/>

这里的title标签就是我们自定义，首先创建一个类继承自relativelayout，这里选择relativelayout作为父类容器，目的在于relativelayout便于控制相对位置。

首先我们要获得typedarray对象，所有自定义属性的值通过它来获取：

typedarray typearray = context.obtainstyledattributes(attrs, r.styleable.titleattr);

得到了typedarray对象后，就可以开始添加按钮到容器中了，首先看看左边第一个返回按钮如果添加上去，先看代码：

int lefttext = typearray.getresourceid(r.styleable.titleattr_left_text, 0);
charsequence charsequence = lefttext > 0 ? typearray.getresources().gettext(lefttext) : typearray.getstring(r.styleable.titleattr_left_text);

这里left_text就是自定义属性，表明是左侧textview显示的文字，文字可以是应用资源文件里的预定义string，也可以是直接输入文字，取到对应的styleable后，首先判断是否大于0，大于0表示是定义在string中的，通过typearray.getresources().gettext()获取值，等于0就直接取值，表示可能是通过直接赋值的方式给值的。取到值后怎么赋值给textview，这里需要首先给他宽高，这是所有控件都需要的

/**
* layout params of relativelayout
* @return layoutparams
*/
private layoutparams initlayoutparams () {
return new layoutparams(layoutparams.wrap_content, layoutparams.match_parent);
}

我们单独写一个方法，后续就可以直接通过

layoutparams params = initlayoutparams();

来获取预设宽高值了，这里可以看到都是高度填充父控件，宽度是自适应。然后就是new一个textview了：

/**
* create textview
* @param context context
* @param id the id of textview
* @param charsequence text to show
* @param params relative params
* @return the textview which is inited
*/
@nonnull
private textview createtextview(context context, int id, charsequence charsequence, layoutparams params) {
textview textview = new textview(context);
textview.setlayoutparams(params);
textview.setgravity(gravity.center);
textview.setid(id);
textview.setminwidth((int)getpixelsizebydp(minviewwidth));
textview.settext(charsequence);
return textview;
}

这里可以看到我们传入了预设的id值，需要显示的内容，以及上面给定的layoutparams 。创建好textview后还可以设置textview的drawable,通过自定义属性left_text_drawable_right，left_text_drawable_left设置，这里是设置了左右，上下对应的可以设置：

/**
* drawable of textview
* @param typearray typedarray
* @param leftdrawablestyleable leftdrawablestyleable
* @param rightdrawablestyleable rightdrawablestyleable
* @param textview which textview to set
*/
private void settextviewdrawable(typedarray typearray, int leftdrawablestyleable, int rightdrawablestyleable, textview textview) {
int leftdrawable = typearray.getresourceid(leftdrawablestyleable, 0);
int rightdrawable = typearray.getresourceid(rightdrawablestyleable, 0);
textview.setcompounddrawablepadding((int)getpixelsizebydp(drawablepadding));
textview.setcompounddrawableswithintrinsicbounds(leftdrawable, 0, rightdrawable, 0);
}

这里也是抽取了一个方法出来，然后通过：

settextviewdrawable(typearray, r.styleable.titleattr_left_text_drawable_left, r.styleable.titleattr_left_text_drawable_right, mleftbacktexttv);

即可给指定的textview设置drawable了。创建好textview后，前面提到我们用的是相对布局，需要指定位置规则：

params.addrule(relativelayout.align_parent_left);

这里居左显示。同时还可以设置字体大小，通过自定义属性：small_text_size(两侧文字大小)，title_text_size(标题文字大小)来设置字体：

/**
* get the dimension pixel size from typearray which is defined in attr
* @param typearray typedarray
* @param stylable stylable
* @param defaultsize defaultsize
* @return the dimension pixel size
*/
private float getdimensionpixelsize(typedarray typearray, int stylable, int defaultsize) {
int sizestyleable = typearray.getresourceid(stylable, 0);
return sizestyleable > 0 ? typearray.getresources().getdimensionpixelsize(sizestyleable) : typearray.getdimensionpixelsize(stylable, (int)getpiselsizebysp(defaultsize));
}

一样，这里也是单独写一个方法来做，typedarray的用法就不多讲了，可以查看其它文章了解。然后通过如下设置字体大小：

float textsize = getdimensionpixelsize(typearray, r.styleable.titleattr_small_text_size, defaultsmalltextsize);
mleftbacktexttv.settextsize(typedvalue.complex_unit_px, textsize);

文字颜色，同样的道理：

/**
* get textcolor
* @param typearray typedarray
* @return textcolor
*/
private int gettextcolorfromattr (typedarray typearray) {
int textcolorstyleable = typearray.getresourceid(r.styleable.titleattr_title_text_color, 0);
if (textcolorstyleable > 0) {
return typearray.getresources().getcolor(textcolorstyleable);
} else {
return typearray.getcolor(r.styleable.titleattr_title_text_color, textcolor);
}
}

然后调用方法设置颜色：

mleftbacktexttv.settextcolor(gettextcolorfromattr(typearray));

到这里为止，左侧的第一个文字按钮。或者文字带图片的按钮就创建好了，最后就差一步了：

mleftbacktexttv.settextcolor(gettextcolorfromattr(typearray));

其它按钮，同样的道理，可以依次添加到容器中，就不多讲了，到此为止我们需要的titleview就创建好了，以后使用就可以直接调用了，不需要每个地方去重复的coding。

项目地址：github源码下载

以上所述是小编给大家介绍的android自定义titleview标题开发实例，希望对大家有所帮助

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网