不操千曲而后晓声,观千剑而后识器。这篇文章主要讲述Android AutoWrapTextView 解决中英文排版问题相关的知识,希望能为你提供帮助。
1.概述
最近项目有新需求,UED给了个卡券密码的UI样式,如图:
文章图片
我一看很简单啊,一个TextView解决问题,然后做好以后在模拟器里一看.....
文章图片
纳尼,这个时候才想起来,TextView 中英文在一起会有排版问题,那怎么解决呢......
思路
刚开始的想法是一个字符一个字符的去绘制,绘制到最右边的临界点就换行绘制,结果实践以后发现不同的字符之间的间距不一样,显示会非常凌乱,又没有什么好的方案解决这个间距问题,所以这个方案pass;
单个字符绘制不行那就一行一行绘制,根据View的长度把文本拆分成N行,然后一行一行的绘制。
2.实现
首先创建一个继承自View的AutoWrapTextView
文章图片
init方法里分别调用了initStyle方法和initPaint方法;
initStyle方法主要解析自定义的属性
文章图片
属性名含义都很明显不用过多解释,initPaint方法就是初始化一个文本画笔
文章图片
接下来我们看看设置文本的方法setText方法
文章图片
首先把文本转换成Char数组,然后循环数组把整个文本拆分成N行文本,下面来看看核心方法splitText方法
文章图片
首先创建一个属性名为mSplitTextList的List集合用来存放拆分的文本;
mSingleTextWidth 为单行文本显示的宽度;
currentSingleTextWidth 为当前一行累计计算的宽度;
然后开始循环Char数组,getSingleCharWidth方法就是计算单个Char的宽度;
如果currentSingleTextWidth 小于 mSingleTextWidth 就把Char添加到lineStringBuffer 当中,如果是最后一个Char就直接把lineStringBuffer添加到mSplitTextList集合当中
如果currentSingleTextWidth 大于 mSingleTextWidth,就把lineStringBuffer添加到mSplitTextList集合当中,重新给lineStringBuffer赋值,currentSingleTextWidth 归0;
循环结束以后拆分好的文本就都添加到mSplitTextList集合当中了。
拆分完成以后循环mSplitTextList集合,得到每一行文本的Rect值,绘制文本的时候会用到,然后设置View的宽高。
接下来就是绘制方法drawText
文章图片
首先得到第一行文本距离顶部的高度marginTop,然后循环文本绘制每一行文本内容。
效果图
我们来看下最后的效果
文章图片
至此整个类的逻辑分析就结束了,想看完整源码的可以移步:
【Android AutoWrapTextView 解决中英文排版问题】https://github.com/chenpengfei88/AutoWrapTextView
推荐阅读
- Android 音频系统(从 AudioTrack 到 AudioFlinger)
- 直播APP开发助您搭建更高大上的直播平台
- call 与 apply,bind 的使用思路
- 利用微信支付的订单查询接口可以在APP 中提高支付的可靠性
- Android NFC近场通信02----读写卡的准备工作
- 日程管理app(bug report)
- Android 开机优化
- Android自定义组合控件--图片加文字,类似视频播放软件的列表
- Android 架构设计实现——MVP模式