<p style="margin-top:0px; margin-bottom:1.1em; color:rgb(51,51,51); font-family:'microsoft yahei'; font-size:14.44444465637207px; line-height:25.98958396911621px"> 最近又有大片上映了,前几天刚看完《末日崩塌》,《侏罗纪世界》又来了,对于大片迷来说是一种福利,所以这几天手机上装了各种电影票团购软件,没办法,同样的电影同样的电影院同样的座位,但是不同的团购软件,价格就不一样。ok,言归正传</p>
<p style="margin-top:0px; margin-bottom:1.1em; color:rgb(51,51,51); font-family:'microsoft yahei'; font-size:14.44444465637207px; line-height:25.98958396911621px"> 在淘宝电影上面有这样一个功能,日期可以滑动,并且选中的是在正中间,效果如下: <br style=""> <img alt="这里写图片描述" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-71a0e6f51b66dbffea35fc87d3d054d9" style="border:none; max-width:100%" title=""></p>
<p style="margin-top:0px; margin-bottom:1.1em; color:rgb(51,51,51); font-family:'microsoft yahei'; font-size:14.44444465637207px; line-height:25.98958396911621px"> 看完了,那么问题来了。这个功能怎么实现呢?</p>
<p style="margin-top:0px; margin-bottom:1.1em; color:rgb(51,51,51); font-family:'microsoft yahei'; font-size:14.44444465637207px; line-height:25.98958396911621px"> 我们先来分析一下: <br style=""> 把功能拆分一下来看,如果不能滚动,是不是很好实现?其实就是一个 tab 栏,我在前面的 blog 中<a href="http://blog.csdn.net/jxxfzgy/article/details/44162211" rel="noopener noreferrer" style="color:rgb(51,102,153); text-decoration:none" target="_blank">Android 快速实现 ViewPager 滑动页卡切换(可用作整个 app上导航)</a> 中就实现了此功能,然后在此功能的基础上加上滚动功能即可,具体的实现原理是通过水平滚动控件 HorizontalScrollView把 tab 栏包含起来,然后通过 tab 的选中item 来控制HorizontalScrollView的滚动。</p>
<p style="margin-top:0px; margin-bottom:1.1em; color:rgb(51,51,51); font-family:'microsoft yahei'; font-size:14.44444465637207px; line-height:25.98958396911621px"> 代码实现:</p>
<p style="margin-top:0px; margin-bottom:1.1em; color:rgb(51,51,51); font-family:'microsoft yahei'; font-size:14.44444465637207px; line-height:25.98958396911621px"> 1、实现 自定义 tab,这里就不细讲了,跟前面那篇 blog 几乎一样,直接贴代码了,不清楚的请看前面的 blog</p>
<pre class="blockcode" name="code" style="white-space: nowrap; word-wrap: break-word; box-sizing: border-box; margin-top: 0px; margin-bottom: 1.1em; font-family: 'Source Code Pro', monospace; padding: 5px 5px 5px 60px; font-size: 14.44444465637207px; line-height: 1.45; word-break: break-all; color: rgb(51, 51, 51); background-color: rgba(128, 128, 128, 0.0470588); border: 1px solid rgba(128, 128, 128, 0.0745098); border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; position: relative; overflow-y: hidden; overflow-x: auto;"><code class="hljs java has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">package</span> toolbar.scrollstripview;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.content.Context;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Canvas;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Color;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Paint;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.util.AttributeSet;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.util.TypedValue;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.view.View;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.widget.LinearLayout;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.widget.TextView;
<span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
* Create |
|