上一篇 Android自定义TableView (一) 原理介绍 介绍了实现这个TableView的基本原理,本篇在原理的基础上扩展一些简单的属性设置:

64f940ab4cf6

样式截图

首先说明一下,图中的所有设置项都是通过提供set方法设置的,没有做xml属性,暂时也不打算做了,有需要的话百度搜索自定义xml属性,很多文章,然后在TableView里面要做的就是在initVariable()方法里面用xml属性设置一下相关的成员变量,目前initVariable()里面初始化变量都是用的常量值(也是默认值)。

==============> 开始讲如何扩展

关于样式的扩展,在介绍 实现原理 的时候已经提到过了,基本是围绕 createHeader()和createItem() 来做的,这两个方法里面的代码基本上是一样的,这里只拿createItem()来举栗说明。

直接看createItem()扩展后的代码

private LinearLayout createItem() {

LinearLayout item = new LinearLayout(mContext);

item.setLayoutParams(mItemLayoutParams);

for (int i = 0; i < mColumnCount; i++) {

item.addView(createUnitView(i));

}

return item;

}

private TextView createUnitView(int columnIndex) {

RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(

mColumnWidth[columnIndex], LayoutParams.MATCH_PARENT);

BorderTextView view = new BorderTextView(mContext);

view.setGravity(Gravity.CENTER);

view.setLayoutParams(params);

view.setTextSize(mUnitTextSize);

view.setTextColor(mUnitTextColor);

if (mUnitSingleLine) {

view.setMaxLines(1);

}

view.setBorderColor(mUnitBorderColor);

view.setBorderWidth(mUnitBorderWidth);

view.setBackgroundColor(mUnitBackColor);

view.setPadding(mLeftPadding, mTopPadding, mRightPadding, mBottomPadding);

return view;

}

(代码里的 BorderTextView 是继承TextView的,里面就画个边框,后面会解释这个BorderTextView的)

看了代码有没有感觉很简单,基本都是TextView自带的属性

比如字体颜色

首先定义一个颜色的成员变量

private int mUnitTextColor;

随便找个地方初始化一下默认值(规范一点统一在initVariable()方法里)

mUnitTextColor = Color.parseColor(DEFAULT_TEXT_COLOR); // 自定义xml属性的话就在这里改

DEFAULT_TEXT_COLOR是个颜色代码的字符串常量值 "#000000"

在createUnitView()方法里使用这个成员变量

view.setTextColor(mUnitTextColor);

对外提供一个set方法

public void setUnitTextColor(@ColorRes int color) {

this.mUnitTextColor = ContextCompat.getColor(mContext, color);

}

这里参数可以加一个@ColorRes注解,只接受颜色资源的参数,方便自己在TableView里处理

到这里字体颜色就扩展完成了,其他属性基本也都是这个思路,就不一一介绍了

==============>如何扩展到这就讲完了

篇幅有点短,再扯扯淡讲一下遇到的一个坑吧

上面说到个继承TextView的BorderTextView,而且里面就画了个边框,实现边框效果的话直接一个带边框的背景图或者shape(单边框使用layer-list),我为啥要自定义view画边框这么麻烦呢,因为使用shape遇到了一个填不上的坑。

首先图片是不能使用了,因为要动态设置边框粗细和颜色和view的背景色的话图片很不灵活。

然后考虑使用shape(这个坑就是shape或者说是layer-list),代码大概是这样 (只有右边框和下边框)

文件名: border_back.xml (这里注意文件名啊,后面要说到 border_back.xml 别不知道是哪个)

然后直接view.setBackgroundResource(R.drawable.border_back);设置边框背景,这个是layer-list基本用法。为了能够动态设置背景的颜色和边框等,这里使用 layer-list 对应的 LayerDrawable 类,首先根据layer-list资源取得一个LayerDrawable对象,然后用LayerDrawable对象的一些set方法设置相关属性,最后view.setBackground(Drawable)即可,示例代码如下

LayerDrawable layerDrawable = (LayerDrawable) getResources().getDrawable(R.drawable.view_background, null);

layerDrawable.setLayerInset(1, 0, 0, 10, 10); //把 border_back.xml 里面的 2px 改成 10px 达到加粗边框的效果

// 取得第0层shape并 setColor 达到修改边框颜色的效果

GradientDrawable shapeDrawable = (GradientDrawable) layerDrawable.getDrawable(0);

shapeDrawable .setColor(color);

// 取得第1层shape并 setColor 达到修改背景颜色的效果

GradientDrawable sd = (GradientDrawable) layerDrawable.getDrawable(1);

sd.setColor(color);

view.setBackground(layerDrawable);//将修改完的layerDrawable设为背景

(GradientDrawable和ShapeDrawable注意一下,xml文件里面的shape对应的是GradientDrawable,可以百度了解了解,但是xml里面可以给shape设置padding,而在GradientDrawable类并没有找到相应的方法)

到这里其实已经可以实现想要的效果了,边框粗细,边框颜色,背景颜色都随便设,代码看起来也没有什么问题,但是程序跑起来显示到界面的效果却有各种奇奇怪怪的问题,单独的一个view的问题可以解决,就是不使用xml,直接new各种需要的Drawable动态创建,但是listview里面也有各种问题(头疼),最后只好放弃使用shape了。说了半天好像没说啥问题呢,实在是一言难尽,看图吧

64f940ab4cf6

图里有个坑

只看图中红框部分的代码和运行效果图就行了,点击按钮之后首先把Drawable边框加粗,然后依次创建aa,bb,cc,dd四个TextView并添加到LinearLayout里面,然后运行的结果却是aa和bb没有加粗,cc和dd加粗了,区别就是cc的字体大小是25,但是dd字体大小也是24和aa,bb一样(aa,bb,cc,dd四个view都是new出来的应该互不影响才对,注意到这一点应该能驳倒一大片猜想吧)

上面说的只是其中一个不解的问题,如果除了设置边框粗细之外同时设置背景颜色(或者边框颜色)的话,背景颜色会是预期的效果而边框却不是(没错,就是这么奇怪),还有这里我为什么选择使用24作为字体大小呢?因为在我的TableView里面使用24作为字体大小的话什么都正常(意思就是没有上面描述的问题,都是预期效果),但是如果是其他字体的话就会有上面说的问题......关于这个问题有高手看到并且知道原因的话请给我指点指点啊,好了,淡就扯到这里吧

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐