SwiftUI - 封装打开书本效果的书本视图?目标
外部可传递一个配置信息（例如： 书本宽高, 书本圆角, 书本阴影, 书本打开进度, 书本翻页分割线颜色 ）
外部自定义封面、打开内部（左侧、右侧）
打开效果（动画 平滑）
实现预期效果
主逻辑代码
外部如何使用的？
其他信息封装提供给外部的接口
配置信息如下
有哪些新东西？
Animatable协议在SwiftUI中，Animatable是一个协议，用于表示可以通过动画进行过渡的值类型。通过采用Animatable协议，您可以定义自定义视图属性，这些属性可以通过动画进行平滑过渡，以实现更具吸引力和生动的用户界面。
当您...
SwiftUI-TagsView布局Layout
Layout在SwiftUI中，Layout协议不是公共API的一部分，而是用于内部实现的。它用于定义如何布局视图的实际算法。开发者通常不会直接与Layout协议进行交互，而是通过使用SwiftUI提供的布局系统来实现自定义布局。
SwiftUI的布局系统是基于声明式的，它使用View协议来定义视图的外观和行为，而不是直接控制布局算法。在开发者创建自定义布局时，他们通常会通过实现View协议中的body属性来创建自己的视图，并使用SwiftUI提供的布局容器（例如VStack、HStack、ZStack等）来组织和排列子视图。
虽然La...
SwiftUI - 封装一个字数限制 TextField 控件?效果展示
代码外部使用
封装控件代码
UI 相关是否自动撑开?
这里使用 autoResize = false ， 就是给定一个最大高度， 内部点击任何区域都弹出键盘。
autoResize = true， 意味着根据输入的内容自动撑开。 frame 的 height 设置为 0。
进度显示
非 UI封装相关配置信息
键盘聚焦
要达到效果： 点击Textfield外围空白部分也能聚焦弹出键盘。
超出字符, 截断
当超过给定的限制字数, 输入直接截断
用到的修饰符.onChange(of: value, ...
SwiftUI -交互式侧边栏Interactive Side Menu
效果
UI 设计
SideMenu 部分
Tab 枚举配置
1234567891011121314151617enum Tab: String, CaseIterable { case home = "house.fill" case bookmark = "book.fill" case favourites = "heart.fill" case profile = "person.crop.circle&q...
SwiftUI之网络获取json并分页展示效果
第三方库SDWebImage 地址: https://github.com/SDWebImage/SDWebImageSwiftUI?tab=readme-ov-file
Xcode 通过 package集成 使用方式可查看 GitHub 文档。
(分页)获取图片列表 json data
加载首页
加载更多
加载指示器
图片加载
所需参数声明
SwiftUI- 模仿 YouTube 之 miniPlayer+手势YouTube Mini Player
Kavsoft 视频地址: https://www.youtube.com/watch?v=DtYDH4woWiY&t=56s 比较复杂的 SwiftUI 动画
搭建Home页面框架
ZStack
TabView
TabItem 1
修饰符 扩展 View , setupTab(xx)
TabItem 2
TabItem 3
之前没意识到系统自带的和自定义的区别和做法
下面看一下对比
这是系统自带的
我们采用自定义的
所以会隐藏系统自带...
SwiftUI - HoldDownButton 制作YouTube 地址
样张如下
搭建 UI
封装所需属性
定时器
定时器的作用: 就是用来动画的形式制作进度条
定时器使用
拿到 timerCounter 就能在 UI 部分设置width , 运行即可看到效果
这里用到.onReceive 修饰符, 内部通过订阅timer消息,就可以间隔 0.01 拿到一次更新 , 就可以计算 progress 逻辑了.
==引出一个问题? 什么时候触发机制?==
HoldDownButton顾名思义就是在长按的时候触发效果
手势 Gesture
view 具备多种手势功能
修饰符 ....
Mac如何制作Gif图？ （免费🆓）前言参考博文
所需一台Mac 自带 QuickTime Player 来录制
Gifify 工具实现自己录制制作 gif 动态图
具体实现QUickTime Player 录制视频 ⏺️
依次点击， 文件 - 新建录制屏幕
点击录制所选部分， 框选所需要录制的区域
依次点击选项 – 桌面 – 录制（即可）。
Gifify 工具mov 转换 gif1234567891011121314# 安装工具 （我本地使用的梯子🪜，速度比较慢， 好歹也安装完了。 ）# gifify 开源项目地址： https://github.com/jcle...
SwiftUI -ReelsLayout AppYouTube Link address:
效果图类似于tiktok 播放页面, 滑动切换
AVKit UIViewControllerRepresentable
makeUIViewController updateUIViewController
OffsetKey: PreferenceKey
.preference .onPreferenceChange
playPause(:)
页面结构
HomeView
Scrollview
Overlay ( 其他控件 不跟着 scrollView...
Wheel PickerYouTube Tutorial Link:
UI 架构
Divider() 就是每个竖杆
当刻度达到每个 steps 间隔 使用 overlay 显示刻度信息 并调整 divider 高度
overlay 一个中间竖杆
修饰符.safeAreaPadding 从中间开始移动 size.width / 2
搭建刻度视图
配置刻度相关信息
显示刻度值
滚动到指定位置或者边缘不然拿不到读数
官方文档解释
.scrollTargetLayout
这个修饰符在需要更精确地控制滚动视图中内容的布局时非常有用, 特别当你需要确保内容在滚动时以某种特定的...
