scrollerview和tableview的结合使用

本文的主要目的是使用scrollview和tableview，实现下面的图的效果，其中数据都是静态的。Mychannel和all channel两个tap可以自由切换。

http://stackoverflow.com/questions/19561269/autolayout-with-hidden-uiviews

这里面有一个思路需要参考：如果左边没有image view，则通过constant和priority来调整，似的文字往左边顶！

结构分析：

1. 最上面是一个scroll view，允许左右滑动，其中每个卡片都能响应事件，所以这里每一个item都是一个button，用image作为button的背景图

2. 下面是一个大的container UIView，包含了一个标题栏，里面有两个Tap；还有一个是scrollView，左右可以滑动在My Channel和All Channels之间切换，同时也可以直接点击切换

3. 第一个Tap下面添加了一个独立的controller，里面放入了tableview

最终实现的效果图

制作scroll view实现左右滑动

collection View

1. 首先要声明scroll view的内容宽度：topScrollView!.contentSize=CGSizeMake(CGFloat(180*4),0)//因为是横向滚动，是四张图片，每张的宽度是180

2. 每一个item是一个button，然后给button加上的背景图片

3. 最后将每一个button作为subview添加到这个scrollerview里面

制作两个Tap View

tap view

因为这两个tap可以左右切换，所以放了两个button。

container里面放入scroll view

animation view & channel scrollview

1. tap下面还放了一个指示左右滚动的滑条

2. 因为放了两个tap，所以整个contentsize是两个container view的宽度

如何将table view添加到scroll view里面

1. scroll view里面放了两个controller，通过tap来切换

2. 如何实现根据文字（description的高度来自适应cell的高度）：关键是autolayout

3. 这里我们单独创建了一个view controller，里面放了一个tableview，撑满整个view；其中autolayout最重要的第一点就是tableview的height=top layout

4. 单独设计了tableview cell 的prototype，左边是一个图片，右边是文字+文字

5. cell里面为了实现内容的自适应，根据文字的高度来调整cell的高度，其中图片的大小是固定的（包括宽和高），这里最重要的就是image view和description lable view的距离底部的content view的约束条件都是>=0

约束的定义

如何实现cell的自适应高度还有一点比较重要：预估高度，讲rowHeigh的属性设置为AutomaticDimension

self sizing cell

如何添加controller到scroll view里面：

1. 初始化storybaord里面的两个controller

2. 这里需要注意添加addChildViewController：否则点击cell之后 数据源都是消失，答案在爆栈上扎到http://stackoverflow.com/questions/14798516/uitableview-custom-cells-disappearing-content-after-scrolling

添加controller

scroller view滚动，如何让蓝条跟着滚动

animation Bar

1. animationbar前面讲到了，是放在第一个button下面的一个UIView

2. 要让它随着scroll 一起滚动，其实目的就是为了改变它的frame；这里有一个比例关系，channelscrllview的一个宽度是scrollerview的宽度，以为蓝条这个animation只是在my channel和all channel之间切换，也就是说移动的中心是my channel的中心到all channel的中心之间，也就是100；所以有了上面的一个比例关系

3. 为什么要偏移40，是因为这个animationview的起点是中心靠左位置