iOS 快速实现分页界面的搭建

栏目: IOS · 发布时间: 6年前

内容简介:首先我们先可以来预览一下实现效果:360云计算

女主宣言

作为一名iOS开发,最常用到的就是分页控制器了,类似于新闻首页;最近所接触的项目中经常会遇到滚动分页的设计效果,被用来对不同数据界面的展示进行分类。因此,总结了一下iOS中关于分页界面搭建的知识点。

PS:丰富的一线技术、多元化的表现形式,尽在“ 3 60云计算 ”,点关注哦!

首先我们先可以来预览一下实现效果:

iOS 快速实现分页界面的搭建

实现分析

根据动图进行实现分析:这个效果的实现分为两部分顶部的QiPageMenuView和内容展示部分QiPageContentView:

QiPageMenuView是基于UIScrollView实现的,我们可以按照自己的项目需求,定制自己需要实现的效果。QiPageMenuView提供了可设置的属性有:菜单每一项是否根据文字的大小自适应宽度还是设置固定宽度、菜单的首项和最后一项距离父视图的间距、每一项之间的间距、包括了每一项QiPageItem的展示效果自定义等。也实现了菜单项超出一屏幕时自动滑动显示的效果:

iOS 快速实现分页界面的搭建

QiPageContentView是基于UIPageViewController实现的封装,在项目中可能有多处这样的界面效果。单纯的使用UIPageViewController写在相应的控制器中,添加相应的子控制器,通过实现UIPageViewController的数据源和代理协议也可以达到这种效果。但是UIPageViewController嵌套在主控制器中,耦合度比较高,代码量也比较大,若是多处需要使用这种效果,每次都写一遍UIPageViewController,效率和可移植性不高。QiPageMenuView和QiPageContentView之间是解耦合的,彼此都可以作为单独的控件去使用。在设计构思时,菜单视图的样式有可能是QiPageMenuView样式之外的视图,若是两者耦合度太高,就变成了QiPageContentView + QiPageMenuView组合,能展现的效果就被限制了。

QiPageMenuView实现与使用

1.QiPageMenuView.h中展现了QiPageMenuView可实现定制的相关属性以及初始化方法介绍。

2.QiPageMenuView滑动显示的核心代码

  1. QiPageMenuView使用的两种方式:

    方式一:

方式二:

QiPageContentView实现与使用

  1. QiPageContentView.h

2 . QiPageContentView使用

QiPageContentView与QiPageMenuView解耦

QiPageContentView与QiPageMenuView使用各自头文件中定义的协议或者block属性实现两者之间事件交互,从而达到分页联动效果;两者的解耦,使得它们的使用更加灵活。

  1. QiPageMenuView交互事件的传递

2.QiPageContentView交互事件的传递

3.QiPageContentView和QiPageMenuView组合实现分页界面

360云计算

由360云平台团队打造的技术分享公众号,内容涉及 数据库、大数据、微服务、容器、AIOps、IoT 等众多技术领域,通过夯实的技术积累和丰富的一线实战经验,为你带来最有料的技术分享

iOS 快速实现分页界面的搭建


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Rework

Rework

Jason Fried、David Heinemeier Hansson / Crown Business / 2010-3-9 / USD 22.00

"Jason Fried and David Hansson follow their own advice in REWORK, laying bare the surprising philosophies at the core of 37signals' success and inspiring us to put them into practice. There's no jarg......一起来看看 《Rework》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具