IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> 知乎日报仿写小记 -> 正文阅读

[移动开发]知乎日报仿写小记

前言

学习iOS已经半年有余,之前的学习中也陆陆续续写过一些小demo,这是第一次正式记录一下自己仿写项目的过程。

运行环境与整体框架

  • Xcode版本:Version 12.5
  • 模拟机系统版本:iOS 14.5
  • 整体设计模式:MVC模式
  • 用到的第三方库:JSONModel、FMDB、SDWebImage、SDWebImage

请添加图片描述

主页部分

主页

主页效果

  • 主页顶部的 NavigationBar 中,leftBar 为今天日期和提示语 ,rightBar 为用户头像,点击进入设置界面。
  • 主页的 tableview 由顶部的轮播图 cell 和下面的文章 cell 构成。顶部轮播图可无限轮播,文章列表可下滑无限刷新,每次刷新三日的文章,下滑还未加载完成时有“小菊花”加载效果。
  • 点击轮播图 cell 或文章 cell 会进入相应的文章界面。
    请添加图片描述

请添加图片描述
请添加图片描述

主页的NavigationBar

开始时观察实际app效果,发现顶部的 NavigationBar 有多个控件,便开始思考如何实现。
查找资料后了解到,可以向 leftBarButtonItems(或rightBarButtonItems)数组内添加 UIBarButtonItem 元素。经过测试,总结出来:item 在加入时是从两边向中间加入的,即leftBarButtonItems 中的 item 在加入时从左向右加入,rightBarButtonItems 中的 item 在加入时从右向左加入。

学习时,我还有一个疑惑:leftBarButtonItem 和 leftBarButtonItems 有什么区别?然后在官方文档 UINavigationItem.h 中看到了这样的描述:
请添加图片描述
关键信息:

  1. 之前的单数属性 ( leftBarButtonItem 和 rightBarButtonItem ),现在指各自的 items 数组中的首个元素。
  2. 如果您使用单个属性或复数属性,请保持一致,不要试图混合它们。
  3. leftBarButtonItems 第一个 item 在最左边且左对齐,rightBarButtonItems 第一个 item 在最右边且右对齐。

总结:

  1. 之前的单数属性 ( leftBarButtonItem 和 rightBarButtonItem ),现在指各自的 items 数组中的首个元素。
  2. 只有一个属性就用单个属性,有多个属性就用复数属性,单复数不能搞混。
  3. leftBarButtonItems(rightBarButtonItems)靠边对齐,这与之前测试的总结是相符的。

主页的轮播图

之前的小 demo 中仿写过轮播图,其大致原理就是在一个 scrollView 里加入多页图片,作为轮播图的主界面。然后设置定时器 NSTimer,每隔固定时间改变当前 scrollView 的 page,从而达到轮播的效果。

要注意的是:

  1. 在 scrollView 最前面添加最后一张要显示的图片,在最后面添加第一张要显示的图片。当 scrollView 向后滑到最后一张图片时,让 scrollView 跳转到第二张图片;当 scrollView 向前滑到第一张图片时,让 scrollView 跳转到倒数第二张图片,最终达到循环轮播效果。
  2. 在滑动轮播图或主页面的时候,要将定时器 NSTimer 销毁,停止拖动时再启动。

另外,在知乎日报app的轮播图中,发现图片有渐变效果,这样不仅可以增加视觉效果,下方图片的文字注释也更加清晰,仿写过程见博客:iOS——简单实现图片渐变

ps:近期轮播图的渐变效果感觉比博客中更 好看 明显
请添加图片描述

请添加图片描述

请添加图片描述

请添加图片描述

请添加图片描述

主页 tableview 无限下滑刷新

  • 实现方法:在 - (void)scrollViewDidScroll: 里监测当前视图位置,若滑到底部时,便利用 manager 进行一次网络请求,向 tableview 里添加请求到的三日数据,再将tableview整体 reloadData。
  • 小菊花:在进行网络请求时启动小菊花,当网络请求完成时暂停小菊花。
    参考文章:iOS系统自带的UIActivityIndicatorView小菊花

未完待续。。。

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2021-12-06 15:23:13  更:2021-12-06 15:24:13 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 7:52:33-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码