学习来源:袁峥老师的《快速集成App中顶部标题滚动条

此次博文写的是按需求分析写代码,思路条理性杠杠的,可以提高的编码实现速度哦。

效果:

 
根据这个网易新闻的界面,需求分析:
    需要的对象:
          1、导航控制器默认会生成的导航条,上面可以设置title(当然也可以另外自定义View设置导航条title)
          2、切换页面的标题滚动区是一个ScrollView,在这个ScrollView上面添加六个UIButton,按顺序UIButton的文字是“头条、热点、视频、社会、订阅、科技”六个标题
          3、切换内容的内容滚动区是一个ScrollView,在这个ScrollView上面分别和标题滚动区的标题按钮对应顺序添加关于“头条、热点、视频、社会、订阅、科技”六个View
          4、关于“头条、热点、视频、社会、订阅、科技”六个View,来自六个自定义ViewController。
     需要处理的逻辑:

          5、拖拽内容滚动区,相邻两个页面却换有换页效果,一页View自动占据当前一个页面。
          6、选中标题滚动区的某个标题按钮,选中的按钮会自动切换到中间位置,但是两端的标题按钮会由于滚动区域的缘故不会居中。
          7、选中标题滚动区的某个标题按钮,内容滚动区会切换到对应的View,呈现对应的View内容
          8、点击标题滚动区的某一个标题按钮,会切换状态,选中的标题原本是黑色大小中等的字体切换成红色偏大的字体,取消选中的标题原本是红色偏大的字体切换成黑色大小中等的字体。另外补充:字体大小和颜色切换要动态的变化,会随着拖动内容滚动区而慢慢形变或是色变,而不是一下子变化结束了。
          9、拖拽内容滚动区,滚动一页完毕之后,标题滚动区然后会自动切换对应的标题按钮,以及标题滚动区自动切换居中的效果。(注意这里是滚动完毕一页之后,不是一边滚动一边变化)
 
更多需求效果请有时间继续深入学习:《快速集成App中顶部标题滚动条
 
额外的关联产生的需求:内容滚动区的滚动范围和标题滚动区的滚动范围是由标题按钮个数决定的,六个按钮,就要设置六倍的范围。
 
好了,分析的这么详细,接下来我们就直接根据上面详细的需求分析来一步一步的实现这个网页新闻的功能模块。
 
首先,为了可以封装这部分功能,我使用了xib,但是xib使用导航控制器类的时候,遇到导航控制器类无法设置导航条的title,然后我就只好使用自定义ViewController,然后使用UIView自定义模仿设置导航条,然后在导航条中间添加UILabel,接着在这个xib上添加两个ScrollView,同时为他们添加了自动布局,这里自动布局不难,自己领悟自己弄,这里就不详述了:
然后根据上面的需求1~5

根据需求6和7,下面:

下面我再重新复述剩下的需求:

          8、点击标题滚动区的某一个标题按钮,会切换状态,选中的标题原本是黑色大小中等的字体切换成红色偏大的字体,取消选中的标题原本是红色偏大的字体切换成 黑色大小中等的字体。另外补充:字体大小和颜色切换要动态的变化,会随着拖动内容滚动区而慢慢形变或是色变,而不是一下子变化结束了。
          9、拖拽内容滚动区,滚动一页完毕之后,标题滚动区然后会自动切换对应的标题按钮,以及标题滚动区自动切换居中的效果。(注意这里是滚动完毕一页之后,不是一边滚动一边变化)

根据需求8和需求9,我们需要的逻辑事件是要根据滚动区滚动而响应的,所以这里就需要我们使用UIScrollViewDelegate的方法了:

先完成需求9:

然后再完成需求8,完成之前先分析一下:

当前相邻的按钮也要分left和right,那么left的按钮大小和right的大小比例应该是等于上图中left宽和right宽比例是一样的。

这个补充一下:

其实到这里基本所有的需求都满足了,但是还是有一个小细节没满足,那就是首次启动这个页面,标题没有默认设置选中状态,也就是没有设置默认颜色大小

好了,到这里就基本完成了所有的需求了。

因为这部分模块我基本封装完毕,所以值得下载重复利用哦:

百度云下载链接: http://pan.baidu.com/s/1hrgurIW 密码: dtgv

转载请注明出处(http://www.cnblogs.com/goodboy-heyang/p/5134875.html),尊重劳动成果。

补充:修改了下标越界的bug。

IOS开发--仿制网易新闻的更多相关文章

  1. 【转】 iOS开发 剖析网易新闻标签栏视图切换(addChildViewController属性介绍)

    原文:http://blog.csdn.net/hmt20130412/article/details/34523235 本来只是打算介绍一下addChildViewController这个方法的,正 ...

  2. iOS开发 剖析网易新闻标签栏视图切换(addChildViewController属性介绍)

    本文转载至 http://www.tuicool.com/articles/3ymMzub CSDN博客原文  http://blog.csdn.net/hmt20130412/article/det ...

  3. iOS界面-仿网易新闻左侧抽屉式交互 续(添加新闻内容页和评论页手势)

     本文转载至  http://blog.csdn.net/totogo2010/article/details/8637430       1.介绍 有的博友看了上篇博文iOS界面-仿网易新闻左侧抽屉 ...

  4. IOS之分析网易新闻存储数据(CoreData的使用,增删改查)

    用过网易新闻客户端的朋友们都知道,获取新闻列表时有的时候他会请求网络有时候不会,查看某条新闻的时候再返回会标注已经查看的效果,接下来分析一下是如何实现的. 首先: 1.网易新闻用CoreData存储了 ...

  5. iOS学习之网易新闻简易Demo

    简易NewsDemo代码分析 界面布局就不多说了.效果图:(自定义了三套Cell,最后一套Cell是页面最下方的"正在加载中..."Cell,图三.)         主要分析工程 ...

  6. 基于VUE,VUX组件开发的网易新闻页面搭建过程

    根据妙味课堂上的一个教程练习总结,供自己复习用 一.功能介绍 一个网易新闻客户端的浏览页面,通过网易新闻的api接口实时获取新闻数据,用vux搭建样式框架,以轮播图,文字滚动,图文列表等形式把内容展示 ...

  7. iOS 网易新闻用到的框架

    网易新闻iOS版在开发过程中曾经使用过的第三方开源类库.组件 1.AFNetworking AFNetworking 采用 NSURLConnection + NSOperation, 主要方便与服务 ...

  8. iOS开发UI篇—无限轮播(新闻数据展示)

    iOS开发UI篇—无限轮播(新闻数据展示) 一.实现效果        二.实现步骤 1.前期准备 (1)导入数据转模型的第三方框架MJExtension (2)向项目中添加保存有“新闻”数据的pli ...

  9. 网易新闻iOS版使用的18个开源组件

    转载来自:http://www.jianshu.com/p/8952944f7566  原文最后编辑时间:2015.05.19 网易新闻iOS版在开发过程中曾经使用过的第三方开源类库.组件 1.AFN ...

随机推荐

  1. specify a file path to store the seed

    此问题是由于你的php没有开启open-ssl模块功能引起的. 所以解决方案为开启php的open_ssl模块功能. 开启open_ssl的方式很简单,打开php.ini文件,将行头的分号删除即可. ...

  2. 浅谈java类集框架和数据结构(1)

    在另外一篇博客我简单介绍了java类集框架相关代码和理论. 这一篇博客我主要分析一下各个类集框架的原理以及源码分析. 一:先谈谈LinkedList 这是LinkedList源码的开头,我们能看到几点 ...

  3. sql server 脚本创建数据库邮件

    sql server 脚本创建数据库邮件代码: --脚本创建数据库邮件 --1.开启数据库邮件 RECONFIGURE WITH OVERRIDE GO RECONFIGURE WITH OVERRI ...

  4. python面向对象编程(下)

    本篇详细介绍了Python 中类的成员.成员修饰符.类的特殊成员以及两个综合运用实例. 环境为:python3.5.1 类的成员 类的成员包括三大类:字段.方法和property属性 注:关于这三类成 ...

  5. Python+Selenium进行UI自动化测试项目中,常用的小技巧3:写入excel表(python,xlsxwriter)

    我们在项目中可能用到excel表生成,下面的代码就是对excel表的操作: import xlsxwriter import datetime class write_excel(): def __i ...

  6. Linux内核分析课程笔记(一)

    linux内核分析课程笔记(一) 冯诺依曼体系结构 冯诺依曼体系结构实际上就是存储程序计算机. 从两个层面来讲: 从硬件的角度来看,冯诺依曼体系结构逻辑上可以抽象成CPU和内存,通过总线相连.CPU上 ...

  7. Do not to test a private method.

    If you want to unit test a private method, something may be wrong. Unit tests are (generally speakin ...

  8. MVC ,Action方法传数据给视图有几种方式?--PS:tempData和Viewbag,还有ViewData之间的区别

    //---------------------------------控制器向视图传递数据 public ActionResult TransData() { //1.ViewBag ViewBag. ...

  9. HNU 13308 Help cupid

    Help cupid Problem's Link: http://acm.hnu.cn/online/?action=problem&type=show&id=13308&c ...

  10. ASP.NET的路由

    之前在探讨ASP.NET  MVC的路由时,无意发现原本ASP.NET也有路由机制的.在学习MVC的路由时觉得这部分的资料不太多,不怎么充实(也许是我不懂得去看微软的官方文档).后来也尝试一下ASP. ...