好久没写东西了，感觉有点虚度光阴了，也感觉有点生疏了，刚好最近项目里面有个跑马灯的需求，TextView一通设置之后还是出现各种冲突,尤其是当TextView与EditText共存的时候，所以干脆自己自定义了一个跑马灯MarqueeView 老规则，先上效果图 ，gif录制出来有点怪，可以安装看看实际效果:
控件具体特性为：
有三种滚动模式 ：
滚动一次直接结束
滚动结束一次完全之后，继续第二次滚动
滚动到尾部出现之后，头部紧跟着滚动
文本内容的设置可以是String 类型，也可以是List类型
文本与文本之间的间距可设置
文本滚动的初始位置可设置
文本的大小、颜色、滚动速度可设置
点击文本是否暂停或继续可设置
再次设置文本内容的时候，是否初始化移动位置可设置
此控件效果不是很难，不过很适合对于自定义View不熟悉的同学练一练，尤其是里面那隐隐约约的数学计算和分析，还是蛮有一番滋味的，有需要的朋友也可以省点时间直接用了。
下面来具体说一下实现思路：
自定义控件属性
按照控件特性，就能很容易的自定义出来，这里不多解释了，属性如下：
<attr name="marqueeview_repet_type" format="enum">
<enum name="repet_oncetime" value="0"/><!-- 播放一次 -->
<enum name="repet_interval" value="1"/> <!--连续播放 循环结束再继续下次循环-->
<enum name="repet_continuous" value="2"/> <!--连续播放 到末尾直接继续下次循环-->
</attr><!--循环模式-->
<attr name="marqueeview_text_distance" format="integer"/><!--每个item之间的距离-->
<attr name="marqueeview_text_startlocationdistance" format="float"/><!--开始的起始位置 按距离控件左边的百分比 0~1之间 -->
<attr name="marqueeview_text_speed" format="float"/><!--播放速度 也就是文字滚动速度-->
<attr name="marqueeview_text_color" format="color|reference"/><!-- 文字颜色 -->
<attr name="marqueeview_text_size" format="float"/><!-- 文字大小 -->
<attr name="marqueeview_isclickalbe_stop" format="boolean"/><!--是否点击暂停-->
<attr name="marqueeview_is_resetLocation" format="boolean"/><!--重新改变内容的时候 ， 是否初始化 位置，默认为true，改变-->
实现文本展示与滚动
首先是文本展示，这个很简单，直接在onDraw方法里面调用 drawText(String text, float x, float y, Paint paint)就可以实现，就可以把文本画出来，不过这里面存在个大大的坑，就是这里面的y坐标getHeight() / 2 + textHeight / 2，文本高度计算如果直接调用rect.height()方法获得的值是比实际高度大的，就导致了文本会偏下一点，准确的获取方法为：
private float getContentHeight() {
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
return Math.abs((fontMetrics.bottom - fontMetrics.top)) / 2;
}
下面就是让他滚动起来，实现方式是开启死循环，在很短的时间内，改变xLocation的值，再调用 postInvalidate() 方法重新绘制文本就实现了滚动。
@Override
public void run() {
while (isRoll && !TextUtils.isEmpty(content)) {
try {
Thread.sleep(10);
xLocation = xLocation - speed;
postInvalidate();//每隔10毫秒重绘视图
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
实现三种滚动模式
需求的地基已经实现了，很简单，难的就是添枝加叶了，先来看下MarqueeView的重要属性:
private String string;//最终绘制的文本
private float speed = 1;//移动速度
private int textColor = Color.BLACK;//文字颜色,默认黑色
private float textSize = 12;//文字颜色,默认黑色
private int textDistance1= 10;//item间距，dp单位,默认10dp
private int textdistance ;//textDistance1 转化而来的px宽度
private String black_count = "";//间距转化成空格距离
private int repetType = REPET_INTERVAL;//滚动模式
public static final int REPET_ONCETIME = 0;//一次结束
public static final int REPET_INTERVAL = 1;//一次结束以后，再继续第二次
public static final int REPET_CONTINUOUS = 2;//紧接着 滚动第二次
private float xLocation = 0;//文本的x坐标
private int contentWidth;//内容的宽度
private float startLocationDistance = 1.0f;//开始的位置选取，百分比来的，距离左边，0~1，0代表不间距，1的话代表，从右面，1/2代表中间。
private boolean isClickStop = false;//点击是否暂停
private boolean isResetLocation = true;//默认为true
private boolean isRoll = false;//是否继续滚动
private float oneBlack_width;//空格的宽度
其中repetType是该View的核心围绕点，根据repetType的值，在滚动的时候根据 contentWidth(注意是内容的宽度)与xLocation(滚出屏幕左边的距离)的值的大小来采取相应的措施就可以了。
如果是REPET_ONCETIME //一次结束，此时只需要判断是否contentWidth < (-xLocation)，如果是的话，停止死循环就可以了，具体是 stopRoll()方法:
/**
* 停止滚动
*/
public void stopRoll() {
isRoll = false;
if (thread != ) {
thread.interrupt();
thread = ;
}
}
如果是 REPET_INTERVAL //一次结束以后，再继续第二次，同样判断contentWidth <= (-xLocation)如果为true 的话，我们令 xLocation = getWidth(); 就直接实现了需求。
如果是 REPET_CONTINUOUS //首尾相连 滚动第二次，这种方式是比较复杂的，
这种模式的滚动，首先我们可以在脑海中想象一下，当内容本身的宽度本来就大于屏幕宽度是什么样的，当内容本身很短的时候，又是什么样子的。如果想象不出，我把两种状态画出来就明白了，刚好直观理解一下contentWidth，他不是指文本总长度，而是指初始化设置的文本的宽度。
首先我们要明确，REPET_CONTINUOUS模式下在给控件设置文本的时候，就要考虑到控件可以同时容纳几个 文本，计算方法我统一成了 int contentCount = (getWidth() / contentWidth) + 2;也就是当宽度盛不下一个文本的时候，(getWidth() / contentWidth)为0，加2得contentCount为2，我们复制两份去添加。而当宽度盛下三个，不足4个的时候，我们复制五分去添加 ，不过这里要注意，复制的文本之间存在要存在间距，也就是说 此时contentWidth为文本宽度加上间距，而间距是可以设置的，这里我的处理是把宽度量化为” “（空格）,也就是转化为几个空格的宽度，然后追加上去，这里处理有点low，不过没想大其他好的办法。设复制完的初始化内容就叫string。
这里把间距转化为空格的个数，首先要计算出空格的宽度，然后把宽度除以空格的宽度，得到空格的个数，然后就能用空格来表示我们要的间距了。这里有个有意思的事情，先看三个字符串：
String s1=" ";
String s2="嗯 ";
String s3="嗯 嗯";
这里用rect去测量以后，其中s1的宽度为0，s2的宽度其实就是一个“嗯”的宽度，而s3得到的是实际宽度。所以就采用了差值去计算的思路：
/**
* 计算出一个空格的宽度
* @return
*/
private float getBlacktWidth() {
String text1 = "en en";
String text2 = "enen";
return getContentWidth(text1) - getContentWidth(text2);
}
这样初始化文本就完成了，那么当初始化的滚动到最后了怎么办呢？可以脑中意淫一下，我想到了两种方法去解决：
首先
也就是当移动到左边的距离xLocation 刚好等于contentWidth的时候，我们再把xLocation 重置为0 ，这样就出现了他一直在滚动的障眼法，实现方式是
if ((-xLocation) == contentWidth){
xLocation=0;
}
不过这种方法只能意淫了，不管xLocation的值重置为0 ，还是speed(滚动速度)，还是-speed;都会出现抖动一下的bug,所以想了第二个办法。
解释一下，这个方法xLocation一直在负增长，每当xLocation负增长一个contentWidth长度的时候，我们在string 后面在追加一个文本就可以了，实现方式：
int beAppend = (int) ((-xLocation) / contentWidth);
if (beAppend >= repetCount) {
repetCount++;
string = string + content;
}
有同学就疑惑为何不直接用(-xLocation)%contentWidth==0来判断呢，这是为了避免，移动的速度大的时候捕捉不到这个临界点，所以采取了整除然后去比较。
初始化的一些属性
首先是xLocation 的初始值：xLocation = getWidth() * startLocationDistance, 其中 startLocationDistance是我们设置的一个百分比。
设置文本内容的方法用了个重载，当传入List类型的时候，先把List遍历转化成了String
/**
* 设置滚动的条目内容 字符串形式的
*
* @parambt_control00
*/
public void setContent(String content2) {
if (TextUtils.isEmpty(content2)){
return;
}
if (isResetLocation) {//控制重新设置文本内容的时候，是否初始化xLocation。
xLocation = getWidth() * startLocationDistance;
}
if (!content2.endsWith(black_count)) {
content2 = content2 + black_count;//避免没有后缀
}
this.content = content2;
//这里需要计算宽度啦，当然要根据模式来搞
if (repetType == REPET_CONTINUOUS) {
//如果说是循环的话，则需要计算 文本的宽度 ，然后再根据屏幕宽度 ， 看能一个屏幕能盛得下几个文本
contentWidth = (int) (getContentWidth(content) + textdistance);//可以理解为一个单元内容的长度
repetCount = 0;//从0 开始计算重复次数了， 否则到最后 会跨不过这个坎而消失。
int contentCount = (getWidth() / contentWidth) + 2;
this.string = "";
for (int i = 0; i <= contentCount; i++) {
this.string = this.string + this.content;//根据重复次数去叠加。
}
} else {
if (xLocation < 0 && repetType == REPET_ONCETIME) {
if (-xLocation > contentWidth) {
xLocation = getWidth() * startLocationDistance;
}
}
contentWidth = (int) getContentWidth(content);
this.string = content2;
}
if (!isRoll) {//如果没有在滚动的话，重新开启线程滚动
continueRoll();
}
}
文字的基本属性：
/**
* 设置文字大小
*
* @param textSize
*/
public void setTextSize(float textSize) {
if (textSize > 0) {
this.textSize = textSize;
paint.setTextSize(dp2px(textSize));//文字颜色值,可以不设定
contentWidth = (int) (getContentWidth(content) + textdistance);//大小改变，需要重新计算宽高
}
}
这个文字大小设置以后，要注意把间距再contentWidth重新测量获取，要不会导致错乱的。关于文本间距textdistance的设置，还是比较复杂的
/**
* 设置文字间距 不过如果内容是List形式的，该方法不适用 ,list的数据源，必须在设置setContent之前调用此方法。
* @param textdistance2
*/
public void setTextDistance(int textdistance2) {
//设置之后就需要初始化了
String black = " ";
oneBlack_width = getBlacktWidth();//空格的宽度
textdistance2 = dp2px(textdistance2);
int count = (int) (textdistance2 / oneBlack_width);//空格个数，有点粗略，有兴趣的朋友可以精细
if (count == 0) {
count = 1;
}
textdistance = (int) (oneBlack_width * count);
black_count = "";
for (int i = 0; i <= count; i++) {
black_count = black_count + black;//间隔字符串
}
setContent(content);
}
不单单的是个thi.textdistance=textdistance就解决了，因为这个属性设置以后如果我们不去重新把他使用给现有文本，是没有效果的，所以需要重新改变black_count（几个空格组成的字符串），再调用setContent(String string)方法，改变间距。
</div>
1138
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
