首页 > 程序开发 > 移动开发 > 其他 > 正文
如何在4.X版本实现Switch在5.X的效果
2017-08-10 10:35:01       个评论    来源:鲨鱼不会飞的博客  
收藏    我要投稿

如何在4.X版本实现Switch在5.X的效果

这个需求可能不多,不过本篇博客主旨是希望能通过记录实现这个需求的过程,给同学们一些解决问题的思路。

简单描述需求

首先应用是跑在4.4的系统上的,然后设计师大人设计了一个效果,如下图:

图片1这里写图片描述

但是在4.X的版本是这样的,如图

图片2这里写图片描述

我自定义的结果是介于两者之间,如图

图片3这里写图片描述


然后我就开始各种百度。。。结果还真是让人悲伤,大家的文章基本上都是定义thumb和track来实现如下图的样式:

图片4这里写图片描述

显然这不能满足我们的设计需求。百度无果,也不能说做不了(毕竟我也是脸皮薄(偷笑)),然后就想既然5.X可以实现,那就看看源码啦。

下面是重要源码分析

首先我这是宽度不够,就是设计图是一个圆形图标,但是我的是一个长条

    private int mThumbWidth;//这个是上面滑块的宽度,因为我的滑块是长条,所以我在这里入手,看看这个宽度是怎么计算来的
//然后一搜就到了这个菊花,mThumbWidth是取得maxTextWidth和thumbWidth中较大值
   mThumbWidth = Math.max(maxTextWidth, thumbWidth);
//再去找这两个宽度哪里来的,这里赋值,然后发现maxTextWidth是mOnLayout.getWidth()和mOffLayout.getWidth()中较大的值,还有mThumbTextPadding*2(就是左右两面的padding)
 final int maxTextWidth;
        if (mShowText) {
            maxTextWidth = Math.max(mOnLayout.getWidth(), mOffLayout.getWidth())
                    + mThumbTextPadding * 2;
        } else {
            maxTextWidth = 0;
        }
//下面继续找mOnLayout和mOffLayout了,这两个值来自于mTextOn和mTextOff
if (mShowText) {
            if (mOnLayout == null) {
                mOnLayout = makeLayout(mTextOn);
            }

            if (mOffLayout == null) {
                mOffLayout = makeLayout(mTextOff);
            }
        }
//mTextOn和mTextOff,终于到这里了,其实就是我们设置的文字了,通过如下两个属性 android:textOff=""和android:textOn=""
mTextOn = a.getText(com.android.internal.R.styleable.Switch_textOn);
        mTextOff = a.getText(com.android.internal.R.styleable.Switch_textOff);

解决方案1

既然这个文字可以影响的话,那就简单啦,多写几个空格不就好了,这里就得到解决方案了。

继续源码分析

上面我们还有一个参数也是可以影响到最终的mThumbWidth的,还记得么?没错就是mThumbTextPadding啦,字面意思很好理解吧,就是文字的padding值了,下面看看源码啦

//只是一个属性啊,这就简单了,其实对应的就是android:thumbTextPadding=""

mThumbTextPadding = a.getDimensionPixelSize(
                com.android.internal.R.styleable.Switch_thumbTextPadding, 0);

解决方案2

这就不多说了,简单设置一下就行了啊。

总结

这里主要是介绍一种解决问题的方式,问题滑块宽度不够—>去源码中看哪些值影响—>设置可影响的值—>达到目的

这也鼓励大家多看源码,难度大的看不懂,可以从简单的入手,无论如何,这也是进入高级开发的一个必经路,—–在此共勉。

点击复制链接 与好友分享!回本站首页
上一篇:listview分页
下一篇:使用options对象进行二次采样
相关文章
图文推荐
文章
推荐
点击排行

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训
版权所有: 红黑联盟--致力于做实用的IT技术学习网站