• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

iOS开发之常用资讯类App的分类展示与编辑的完整案例实现(Swift版) ...

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

上篇博客我们聊了《github上源代码的分享链接。

 

一、运行效果展示

下方的GIF动图就是本篇博客所涉及Demo的运行效果了。首先我们点击第一个页面的“Show Menu Scroll”按钮Push到我们的主菜单页面。主菜单页面上方就是我们的菜单选项了,点击相应的菜单项,会显示相应的内容。当然你对下方内容进行滑动,菜单项也会随之改变。

点击菜单右边的加号,Present出菜单的编辑页面,该页面也就是我们上篇博客所介绍的页面。在该页面我们可以添加新的菜单项,并对已经添加的菜单项进行拖动排序。具体效果如下所示。

  

 

 

二、工程目录介绍

下方截图中是本篇博客所涉及到 工程目录。本部分将会对下方的目录进行介绍,从而对整个工程进行了解。

  • 1、CEMenuScrollController:CEMenuScrollController控制类就是上面有菜单下方是内容的类,该类是整个实例的主控制器,起到整体的调度作用,负责将各个组件拼接到一块。
  • 2、CEContentConllectionView: 该视图就是下方内容展示的视图,主要是随着菜单的改变而显示不同的内容。
  • 3、CEScrollMenu: 该组件就是上面那个可以横向滚动的菜单了。
  • 4、CESelectTheme: 该组件就是上篇博客所介绍的,负责编辑菜单的组件。

本部分先整体上看一下,下方将会逐步的对每个组件的具体实现进行介绍。

  

 

 

 

三、CEScrollMenu组件的介绍

该组件就是本示例上面横向滚动的菜单项,该组件的右边有一个“+”号按钮,点击该按钮将会通过闭包的形式将按钮的点击事件回调给CEMenuScrollController控制器,由该控制器Present出CESelectTheme组件进行数据源的操作。接下来我们将聊一下CEScrollMenu组件的核心代码。

 

1、点击Cell的操作

下方是位于CEMenuCollectionView中的代码段,也就是点击菜单对应的Cell时所执行的方法。在该方法中主要做了两件事情,第一件事情是点击的Cell如果可以移动到屏幕的中点。然后将Cell的点击事件回调给CEMenuCollectionView的使用者,在回调时,要传入当前点击Cell的indexPath。

  

 

2、计算菜单Cell的宽度

下方代码段是CEMenuCollectionView中设置Cell尺寸的布局回调。Cell的宽度是从我们的数据源中获取的,我们的Model中有一个itemWidth()方法用来提供显示该item的Cell的宽度。当然该宽度是根据我们菜单名字的个数来获取的。

  

 

3、点击菜单项将其置为选择状态

下方代码是CEMenuCollectionViewCell中负责根据Cell的Select状态来修改Cell的显示方案的,具体代码如下所示。当然,Cell是否处于Select状态,我们将此状态是记录在我们的Model中的,这就避免了因为Cell的重用机制而出现的状态不一致的问题。

  

 

下方代码就是CEMenuCollectionViewCell初始化时所进行的处理。从下方我们可以看出Cell的isSelected状态是从item中加载的,加载后,调用上述updateStelectState()方法。具体做法如下所示:

  

 

关于CEScrollMenu组件的介绍,本篇博客就先介绍这么多,更详细的代码请移步于文章后方的github地址。

 

 

四、CEContentCollectionView的介绍

CEContentCollectionView的主要功能是根据Menu的切换来显示相应的内容的,该视图中的内容比较简单。下方是对其核心技术点的介绍。

1、确定用户左右滑动后当前显示的页面

下方三个代理方法是用来确定用户左右滑动内容页后,所显示的Cell。当用户拖动后切换了相应的Cell时,会执行下方的的currentShowCellClosure()闭包,然后将当前显示Cell的indexPath回调给使用者。然后我们可以根据该IndexPath改变Menu当前显示的菜单项。

  

 

关于本篇博客所涉及Demo的源代码介绍,就先介绍这么多。在工程中添加了不少代码注释,如果你对真个工程的设计以及实现感兴趣话,请移步下方github源代码分享链接进行查看。作为一名程序员,其实好奇心还是蛮重要的。本篇博客的内容就先到这儿吧。

github分享链接:https://github.com/lizelu/CEScrollMenue

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
为何 iOS 越来越偏爱 Swift?发布时间:2022-07-13
下一篇:
[Swift]LeetCode583.两个字符串的删除操作|DeleteOperationforTwoStrings发布时间:2022-07-13
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap