首页
学习
活动
专区
圈层
工具
发布

解析SwiftUI布局细节(二)循环轮播+复杂布局

前言 ---- 上一篇我们总结的主要是VStack里面的东西,由他延伸到 @ViewBuilder, 接着我们上一篇总结的我们这篇内容主要说的是下面的几点,在这些东西说完后我准备解析一下苹果在...这篇我们还是说我们关于SwiftUI的东西,再提一下Demo代码我已经提交上Git了,目前Demo进度为一级页面基本上结束,地图点击大头针的添加也刚处理完,代码有需要的小伙伴可以去Git看看,项目地址...2、稍微复杂点View的布局思路和一些细节知识 3、SwiftUI循环轮播图 这次总结的首页的UI布局如下,我们下面一点点的解析: ?...如果你看了我们 Demo中的代码,你就知道我们是采用 TabView 嵌套 NavigationView 的形式,在这样的模式下似乎是存在问题的, 在 TabView+NavigationView 中你利用...传送门在这 下面是我们值得细说的一些点: 1、值得注意的 TabView + PageTabViewStyle 这是在iOS14中新出的一个值得我们注意的点,PageTabViewStyle

13.9K20

掌握 SwiftUI 的 Safe Area

除非开发者明确要求视图突破安全区域的限制,否则 SwfitUI 将尽力确保开发者创建的视图都被布局到安全区域当中。SwiftUI 同时提供了一些方法和工具让开发者对安全区域有所控制。...SafeAreaRegions 定义了三种安全区域划分: •container由设备和用户界面内的容器所定义的安全区域,包括诸如顶部和底部栏等元素。...从 iOS 14 开始,SwiftUI 计算视图的安全区域时,将软键盘在屏幕上的覆盖区域(iPadOS 下,将软键盘缩小后键盘的覆盖区域将被忽略)也一并进行考虑。...List(0..<100){ id in Text("id\(id)")} safeAreInsetList1 当被嵌入到 TabView 时,TabView 会调整其内部的安全区域。...safeAreaTabbarDemo1 我们只调整了安全区域, SwiftUI 会自动在不同的设备上进行适配(在 iPhone 13 上,状态条的高度为 40 + HomeIndeicator区域高度

9.7K31
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    老人新兵 —— 一款 iOS APP 的开发手记

    习惯性地对信息行业的前沿动态以及一些新的技术方向保持着关注,但由于生意及其它方面的原因,从 10 几年前便完全没有再接触过编程了。最近 6 — 7 年,由于疾病的原因,我的精力基本都集中在治疗上。...前年通过手术,疾病获得了很大的改善,本以为所需记录的数据能少一点,但事与愿违,数据量减少了,数据种类却大大地增加了,而且可以明确的是,这些数据将要在我有生之年一直记录下去。...总之在逐渐摸清了这两个老爷的脾气后,已经基本上能够和这些 bug 和睦相处了。...环境值和环境对象必须显式注入,否则会运行错误。从这一点来看 Sheet 应该和其他的 view 在数据环境上是隔绝的。...感觉 SwiftUI 在销毁 view 上的代码有比较严重的效率 bug( 参见上面的 TabView )。

    3.3K40

    Uno Platform 6.3 发布:支持 .NET 10 预览版并兼容 VS 2026

    本次更新包括对 .NET 10(RC1)的早期支持、与 Visual Studio 2026 新 .slnx 格式的兼容性、增强的 WebAssembly 图像解码性能,以及对 TabView 控件和...Uno Platform 是一个用于使用 C# 和 XAML 构建多设备应用程序的替代 UI 平台。它于 2018 年推出,此前已被一家加拿大公司 nventive 内部使用多年。...它允许开发者为 Windows、iOS、Android、WebAssembly、macOS 和 Linux 编写应用程序。它在 GitHub 上以 Apache 2.0 开源许可证发布。...该版本还增加了对 Visual Studio 2026 新解决方案格式 .slnx 的支持。开发人员可以在 VS 2026 中打开现有的 Uno 项目,同时保持与 VS 2022 的兼容性。...两者都还没有真正从 SwiftUI、Flutter 或 Jetpack Compose 中学到东西。完整的发布说明、迁移指南和更新的文档可在 Uno Platform 博客上找到。

    31210

    打造可适配多平台的 SwiftUI 应用

    100% 基于 SwiftUI 开发,目前支持三个平台: iPhone、iPad 和 macOS。使用者可以通过它来浏览电影信息,包括正在上映以及即将上映的影片。...但是,如果开发者不能理解 SwiftUI 的这个“限制”,并提前做一些准备工作,可能会为之后的多平台开发工作带来一些隐患和增加不必要的工作量。以“电影猎手”的 iPad 版本为例。...这是因为 horizontalSizeClass 只表示当前视图的横向尺寸类别,也就是说,如果在一个横向尺寸被限定的视图中( 例如 NavigationSplitView 的 Sidebar 视图 )获取...它只有一个 Store 实例并支持多窗口,使用者在每个窗口中都可以独立地切换 TabView,并且 TabView 的状态由唯一的 Store 实例持有。...在 SwiftUI 中,只要理解了状态、声明和响应之间的关系,开发者就可以用任何想用的形式来组织数据。无论是将状态进行统一管理,还是分散在不同的视图中,都有各自的优势和意义。

    4.6K80

    WWDC 2025 初印象:意料之中,预想之外

    TabView:在去年大幅改进了 iPadOS 上的 TabView 后,今年 iPhone 上的 TabView 也做了巨大的 UI 和交互调整。...macOS:今年除了提升 macOS 下列表和滚动容器的性能外,还进一步增强了 SwiftUI 和 AppKit 之间的协作。...有些遗憾的是,我测试了从去年到今年遇到的一些必现 SwiftUI Bug,在 beta1 版本中并没有得到解决。我认为解决稳定性、提升性能仍是未来相当长一段时间里 SwiftUI 的首要目标。...SwiftData SwiftData 今年只增加了一个在开发者中使用并不频繁的功能:模型继承[4]。...已经可以预见,Foundation Models 会在苹果生态中催生大量利用端侧大模型的应用。尽管苹果没有在大模型训练上抢得先机,但凭借其生态优势,在应用与 AI 融合方面有望重新取得领先地位。

    32500

    肘子的 Swift 周报 #036 | WWDC 2024 观后感

    AI 尽管因为信息提前泄漏和长时间的预渲染,许多人在 WWDC 之前已对苹果即将带来的 AI 领域变革有所预知,但在亲眼见到 Keynotes 上的演示后,依然令人振奋和鼓舞。...苹果在演示中展现了其对 AI 的理解:避免华而不实的技术炫耀,重视隐私保护,让 AI 技术自然融入日常操作中,并利用设备与用户之间的紧密联系,借助更丰富的上下文信息,提供更为个性化的 AI 体验。...新版本的 SwiftData 几乎实现了与苹果生态系统的解耦,并且一旦其增加了一个独立于苹果生态的默认存储实现,它将具备成为一个跨平台开源框架的所有条件。...随着 SwiftUI 与 UIKit 框架之间动画、转场和手势等机制的共享,SwiftUI 正逐渐从仅基于 UIKit/AppKit 的框架,转变为与苹果生态中其他 UI 框架更平等的合作伙伴。...a stretchy header view with SwiftUI on iOS 18[13] by Donny Wals[14] Using iOS 18’s new TabView with

    49610

    打造可适配多平台的 SwiftUI 应用

    100% 基于 SwiftUI 开发,目前支持三个平台: iPhone、iPad 和 macOS。 使用者可以通过它来浏览电影信息,包括正在上映以及即将上映的影片。...但是,如果开发者不能理解 SwiftUI 的这个“限制”,并提前做一些准备工作,可能会为之后的多平台开发工作带来一些隐患和增加不必要的工作量。 以“电影猎手”的 iPad 版本为例。...这是因为 horizontalSizeClass 只表示当前视图的横向尺寸类别,也就是说,如果在一个横向尺寸被限定的视图中( 例如 NavigationSplitView 的 Sidebar 视图 )获取...它只有一个 Store 实例并支持多窗口,使用者在每个窗口中都可以独立地切换 TabView,并且 TabView 的状态由唯一的 Store 实例持有。...在 SwiftUI 中,只要理解了状态、声明和响应之间的关系,开发者就可以用任何想用的形式来组织数据。无论是将状态进行统一管理,还是分散在不同的视图中,都有各自的优势和意义。

    3.5K10

    在 Text 中实现基于关键字的搜索和定位

    在去年增加了 AttributedString 和 FormatStyle 后,今年又增加了 Swift 版本的正则表达式实现 —— Regex。...阅读 掌握 SwiftUI 的 Safe Area[11] 一文,了解更多有关 safeAreaInset 修饰器的内容safeArea_2022-08-22_18.24.59.2022-08-22 18...从本周开始我将以聊天室、Twitter、博客留言等讨论为灵感,从中选取有代表性的问题和技巧制作成 Tips ,发布在 Twitter 上。...每周也会对当周博客上的新文章以及在 Twitter 上发布的 Tips 进行汇总,并通过邮件列表的形式发送给订阅者。订阅 邮件列表[14],可以及时获得每周的 Tips 汇总。.../[11] 掌握 SwiftUI 的 Safe Area: https://www.fatbobman.com/posts/safeArea/[12] SwiftUI TextField 进阶 —— 事件

    5.7K30

    《手管iPhoneX的适配总结》

    iPhoneX中也有了相对的调整,对于开发和布局设计(UI标注)也需要去注意这个问题。...其中一个可能会有坑的点,iPhoneX的宽度与6s是一样的,但使用的是@3x图。所以在处理比例和插图时,需要注意。这就意味着,我们用的一些通过比例对其切图和布局的方法将会出现问题。...在TableView上的修改姿势 四、提一下关于测试的事 由于目前还没有iPhoneX的设备,只能通过模拟器去测试,就涉及到模拟器安装ipa包的问题了。...(其实这里打不打都可以,基于程序员的仪式感我才打的包) 第4步,测试同学手上有这个.app文件,输入命令安装到模拟器上 请开着iPhoneX再去跑这命令 xcrun simctl install booted...) ---- 如果您觉得我们的内容还不错,就请转发到朋友圈,和小伙伴一起分享吧~

    72720

    手机管家iPhoneX的适配总结

    其中一个可能会有坑的点,iPhoneX的宽度与6s是一样的,但使用的是@3x图。所以在处理比例和插图时,需要注意。这就意味着,我们用的一些通过比例对其切图和布局的方法将会出现问题。 ?...SafeArea帮助我们将View设置在整个屏幕的可视化部分,即使把NavigationBar设置为透明的,系统也认为SafeArea是从NavigationBar的bottom开始的。...) 提一下关于测试的事 由于目前还没有iPhoneX的设备,只能通过模拟器去测试,就涉及到模拟器安装ipa包的问题了。...(其实这里打不打都可以,基于程序员的仪式感我才打的包) 第4步,测试同学手上有这个.app文件,输入命令安装到模拟器上 请开着iPhoneX再去跑这命令 ?...目前该团队已经支持所有腾讯在研和运营的手游项目。

    1K10

    手机管家 iPhoneX 的适配总结

    其中一个可能会有坑的点,iPhoneX的宽度与6s是一样的,但使用的是@3x图。所以在处理比例和插图时,需要注意。这就意味着,我们用的一些通过比例对其切图和布局的方法将会出现问题。...,这里引入了SafeArea的概念以更好地补充完善此类适配问题。...: 关于SafeArea的原文 四、提一下关于测试的事 由于目前还没有iPhoneX的设备,只能通过模拟器去测试,就涉及到模拟器安装ipa包的问题了。...(其实这里打不打都可以,基于程序员的仪式感我才打的包) 第4步,测试同学手上有这个.app文件,输入命令安装到模拟器上 请开着iPhoneX再去跑这命令 由于手机管家的适应力有点强,没有横屏和一些布局的情况...目前该团队已经支持所有腾讯在研和运营的手游项目。

    1.9K00

    Xcode 26 beta 4,要崩我们一起崩 | 肘子的 Swift 周报 #096

    ,却明显增加了开发者的负担。...SwiftUI for Mac 2025[9] 作为 macOS by Tutorials[10]一书的作者,troz[11]一直密切关注 SwiftUI 在 macOS 上的演进。...在这篇文章中,troz 分享了 2025 年 SwiftUI 在 macOS 26 上的一些新特性与实用技巧,并通过配套的示例 App[12]展示了如新图标格式、WebView 原生支持、富文本编辑、Liquid...,不仅体现在位置变化上,还引入了全新的交互逻辑(如 TabView 中的搜索标签)和 Liquid Glass 设计风格。...文章通过工具栏搜索和标签栏搜索两种主要模式,提供了完整的代码示例,并详细说明了在 iPhone 和 iPad 上的不同表现形式,以及如何妥善处理版本兼容性问题。

    48500

    如何在flutter中构建响应式布局(第五节)

    Flutter 是一个跨平台的应用程序开发框架,支持屏幕尺寸变化很大的设备:它可以在小到智能手表的设备上运行,也可以运行在大电视等设备上。...但这并不能解决大型设备的问题,在这种情况下,仅仅拉伸或调整 UI 组件的大小并不是利用屏幕空间的最优雅方式。...这也适用于像智能手表这样的设备,它们的屏幕空间很小,调整组件大小以适应屏幕大小可能会导致奇怪的 UI。 2. 替代布局 为了解决上述问题,您可以为不同尺寸的设备使用替代布局。...VectorDrawable用于任何类型的插图,例如图标。 iOS方法 iOS 用于定义响应式布局的概念如下: 1. 自动布局 ?...屏幕的大小(宽度/高度)和方向(纵向/横向)。

    4.1K10

    Xcode 11 初体验

    SwiftUI、storyboad其中我有两篇博客也介绍到了SwiftUI:SwiftUI - 百行代码变十行,Swift再创辉煌 和 WWDC - SwiftUI - 初恋般的感觉 代码块 代码块也做了调整...综合这个功能还是不错的,我经常也会打开多个页面!来回进去出来麻烦! 直接点击这个按钮,会横向进行分割。...Resolving 三方框架 设计工具(Design Tools) 可以随时查看各设备上的效果以及作出更改。 在开发和调试时,随时在暗黑和明亮模式之间进行切换。...对网络和温度的模拟 Xcode 11 还加入了对网络环境和设备温度的模拟。这两个条件对开发者来说应该不陌生,它们也是最难通过常规手段复现的场景。...在设备管理窗口中,现在增加了这几个选项 根据 Network Link 可以选择你需要的状态,当然 Thermal status 可以选择!都可以让你的 APP 在更有预期的状况下运行。

    4.2K10

    SwiftUI 之 HStack 和 VStack 的切换

    想了解更多信息,可以查看我的文章 - SwiftUI 布局系统第三章 目前,我们的按钮是垂直排列的,并且填满了水平线上的可用空间(你可以用以上示例代码预览按钮的样子),虽然这在竖向的 iPhone 上看起来很好...,但假设我们现在想要在横向模式下让 UI 横向排列。...这样做的好处不仅仅是在引入 GeometeryReader 之前保留同样紧凑的布局,并且会使 DynamicStack 在开始的时候以一种和系统组件类似的方式在所有设备和方向上构建。...SwiftUI 团队的 Matt Ricketson 的说法,可以直接使用底层的 _HStackLayout 和 _VStackLayout 类型作为临时的解决方法。...这样做会令动画更流畅,例如在切换设备方向时,我们也有可能在执行此类更改时获得小幅的性能提升(因为 SwiftUI 总是在其视图层次结构为静态时尽可能表现最佳) 选择合适的视图 但我们还没有结束,因为

    3.9K10

    苹果全新UI框架来了!可视化编程,自动化减少20%代码量

    SwiftUI是一个非常方便快速的构建UI的框架,与最新Xcode设计工具无缝协作,可为所有苹果设备构建UI。开发者通过SwiftUI,利用Swift语法就能够完成代码和设计的同步。...SwiftUI还提供对动态类型、暗黑模式、本地化和可访问性的自动支持。 SwiftUI都更新了什么? 此次更新主要有5点: 声明式:更加易读的代码。...outlets和操作,都会在编译时进行检查,因此在运行时不会出现UI失败的风险 虽然背后使用来自UIKit和AppKit的控件,但SwiftUI凌驾于二者之上,能够有效地使底层UI框架成为一个实现细节,...让Xcode for iPad更上一层楼 开发者对Interface Builder的抱怨不是一天两天了,它大大增加了分解视图块以及从视图控制器(view controller)使用视图的工作量,导致出现体积臃肿的视图控制器...此前,无论什么尺寸屏幕的iPad,总是很难将Interface Builder的大小放到iOS上。而拥有更简单,更快速,更安全的SwiftUI为开发人员实现真正的平台独立性迈出了一大步。

    6.3K20
    领券