首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

深入了解 SwiftUI 5 ScrollView 新功能

SwiftUI 5.0 ,苹果大幅强化了 ScrollView 功能。新增了大量新颖、完善 API。本文将对这些新功能进行介绍,希望能够让它们更多、更早帮助到有需要开发者。...应将此修饰符应用于 ScrollView 包含主要重复内容布局容器,如 LazyHStack 或 VStack。...NamedCoordinateSpace.scrollViewSwiftUI 5 ,苹果新增了 NamedCoordinateSpace 类型,方便用户命名坐标系,并提供了预置 .scrollView...总结 我完全没有想到,在 SwiftUI 5 ,苹果对 ScrollView 进行了全面增强。值得赞赏是,他们不仅提供了一些一直期待功能,而且在 API 设计和实现完成度上都非常出色。...就我个人而言,在 SwiftUI 5 ScrollView 原生方案已经能够满足大多数需求,因此我们将看到更多人采用 ScrollView + LazyStack 组合方式。

66920

WWDC 23 之后 SwiftUI 有哪些新功能

前言 WWDC 23 已经到来,SwiftUI 框架中有很多改变和新增功能。在本文中将主要介绍 SwiftUI 数据流、动画、ScrollView、搜索、新手势等功能新变化。...在之前 SwiftUI 框架版本,应该使用 @ObservedObject 属性包装器来订阅更改。现在不需要了,因为 SwiftUI 视图会自动跟踪符合 Observable 协议类型更改。...动画 动画始终是 SwiftUI 框架中最重要部分。在 SwiftUI 轻松实现任何动画,但之前框架版本缺少一些现在具有的功能。...ScrollView 今年 ScrollView 有了很多优秀新增功能。首先,可以使用 scrollPosition 视图修饰符来观察内容偏移量。...,允许调整列表间距。

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

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

NavigationView + NavigationLink 界面跳转,在苹果给 SwiftUI 使用例子中就是这样写,当然我们在正常使用这样写也没啥问题,那我们界面跳转问题是什么呢?...有一个还得说明一下,GeometryReader 改变了它显示内容方式。在 iOS 13.5 内容放置方式为 .center。在 iOS 14.0 则为:.topLeading。...3、再提一点关于上面说滚动视图,在UIKit我们可以用UICollectionView搞定一切,但是在SwiftUI没有这个控件,我建议采用方式是 ScrollView + HStack + VStack...方式去实现,很多同行有说目前来看SwiftUIList在数据量大情况下性能不是特别好,采用ScrollView是个不错方式,而且也很容易构建出来,并不是说每一个Item位置都需要你去计算,...在 iOS 13.5 内容放置方式为 .center。

11.8K20

SwiftUI Stack

昨天我们简单浏览了一下SwfitUI,今天看看里面的组件吧 就从Stack说起,stack查看文档我们看到HVZ三种stack,那么分别是怎么用呢?...ZStack import SwiftUI struct SKZStack :View { var body: some View{ ZStack { Text(...从图观察我们知道,ZStack是大家在水平规则上一样,然后进行z方向叠加,理解起来就是我们是个显示屏是平面,在这个基础上来个垂直于屏幕方向上设置个轴线按次序把UI叠放在上面 VStack import...SwiftUI struct SKVStack: View { var body: some View { VStack(alignment: HorizontalAlignment.leading...这个很明显啦,就是大家按次序从上往下按照先后顺写在一个平面排列起来,有点类似排队感觉 HStack import SwiftUI struct SKHStack:View { var body

2.2K10

Android解决ScrollView下嵌套ListView和GridView内容显示不全问题

最近为公司做一个Demo里面用到了ScrollView嵌套了GridView和ListView,然而在嵌套时候我发现GridView和ListView都是不能完全显示,显示基本上都是单行数据,最后查找资料和翻阅文档看到原因是...ListView和GridView绘制过程ScrollView无法准确测量自身高度,而且listVIew和GridView抢占了焦点,使得ListView和GrideView具有自身显示效果...我XMl部分代码如下: <ScrollView android:layout_height="match_parent" android:layout_width="fill_parent...,希望本文内容对大家学习或者工作具有一定参考学习价值,谢谢大家对ZaLou.Cn支持。...如果你想了解更多相关内容请查看下面相关链接

2.3K20

SwiftUI 布局工作原理

SwiftUI 布局工作原理 ---- 所有的 SwiftUI 布局都有三个简单步骤,理解这些步骤是每次获得优秀布局关键。步骤如下: 父视图提供一个大小并询问其子视图大小。....background(Color.red) } } 你会看到背景色紧紧围绕着文本本身——它只占用足够空间来适应我们提供内容。 现在,想想这个问题:ContentView有多大?...如您所见,ContentView主体(它呈现内容)是一些带有背景色文本。所以ContentView大小总是和它主体大小一样,不多不少。...这意味着当我们应用修饰符时,进入层次结构实际视图是修改后视图,而不是原始视图。 在我们简单background()示例,这意味着ContentView顶层视图是背景,而内部是文本。...如果我们把这个放到三步布局系统,我们最终会有一个类似这样对话: SwiftUI:“嘿,ContentView,你自己拥有整个屏幕——你需要多少?

3.7K20

如何判断 ScrollView、List 是否正在滚动

访问我博客 www.fatbobman.com[1] 可以获得更好阅读体验以及最新更新内容。...比如在 SwipeCell[3] ,需要在可滚动组件开始滚动时,自动关闭已经打开侧滑菜单。遗憾是,SwiftUI 并没有提供这方面的 API 。...本文将介绍几种在 SwiftUI 获取当前滚动状态方法,每种方法都有各自优势和局限性。...目前 SwiftUI 在内部实现上去 UIKit( AppKit )化很明显,比如,本节介绍方法在 SwiftUI 4.0 已经失效方法二:Runloop我第一次接触 Runloop 是在学习 Combine...判断准确度没有前两种方式高当可滚动组件内容出现了非滚动引起尺寸或位置变化( 例如 List 某个视图尺寸发生了动态变化 ),本方式会误判断为发生了滚动,但在视图变化结束后,状态会马上恢复到滚动结束滚动开始后

3.7K40

SwiftUI水平条形图

SwiftUI水平条形图 水平条形图以矩形条形式呈现数据类别,其宽度与它们所代表数值成正比。本文展示了如何在垂直条形图基础上创建一个水平柱状图。 水平条形图不是简单垂直条形图旋转。...在Numbers 等应用程序,水平条形图被定义为独立图表类型,而不是垂直条形图。除了条形差异外,x轴和y轴格式也需要不同。...Bar Chart with multiple data sets in SwiftUI SwiftUI 水平条形图 将条形图转换为水平 水平条形图不仅仅是在垂直条形图上配置,有一些元素是可以重复使用...在创建垂直条形图时学到技术可以重复使用,但最好将水平条形图视为与垂直条形图不同图表。当我们深入到轴等组件时,可以看到两个图表轴线都是一样,但是它们标签和定位在x和y之间是换位。...这可能是将这些组件分解成更小SwiftUI视图并通过组合来重用原因。

4.7K20

GeometryReader :好东西还是坏东西?

官方文档“定义其内容( defines its content )”这一表述容易让人误以为 GeometryReader 主要功能是主动影响子视图,或者说其获取几何信息主要用于子视图,但实际上,...例如,如果我们想在 ScrollView 以 16:9 比例显示图片(即使图片自身比例与此不符): struct GeometryReaderInScrollView: View { var...请阅读 用 SwiftUI 方式进行布局[9] 和 在 SwiftUI 实现视图居中若干种方法[10] 两篇文章,以了解面对同一个需求,SwiftUI 有多种布局手段。...里子和面子:不同尺寸数据 在 SwiftUI ,有一些 modifier 是在布局之后,在渲染层面对视图进行调整。...在 SwiftUI 布局 —— 尺寸( 下 )[11] 一文,我们探讨过有关尺寸“里子和面子”问题。

44670

SwiftUI 实现 3D Scroll 效果

我们预览下今天要实现 3D scroll 效果。学完本教程后,你就可以在你 App 把这种 3D 效果加入任何自定义 SwiftUI 视图。下面我们来开始本教程学习。...入门 首先,创建一个新 SwiftUI 视图。为了举例说明,在这个新视图中,我会展示一个有各种颜色矩形列表,并把新视图命名为 ColorList。...在 ScrollView 嵌套添加一个 HStack,如下: var body: some View { ScrollView(.horizontal, showsIndicators: false...HStack(alignment: .center, spacing: 50) { } } } 展示矩形 我们使用 ForEach 在 HStack 内部根据 colors 数据分别创建不同颜色矩形...axis 参数是一个元组类型,它定义了在使用你传入角度参数时,哪一个坐标轴要发生改变。在本例,是 Y 轴。 rotation3DEffect() 方法文档可以在苹果官方网站 这里 找到。

1.5K20

SwiftUI 方式进行布局

有关这方面的内容,请参阅 SwiftUI 布局 —— 尺寸( 下 )[4] 一文“面子和里子”章节。...有关建议尺寸、需求尺寸等内容,请参阅 SwiftUI 布局 —— 尺寸( 上 )[5] 一文 三、NameSpace 从 3.0 版本( iOS 15 )开始,SwiftUI 提供了新 NameSpace...这意味着,在 ScrollView ,子视图最好明确设定尺寸( 提出明确地需求尺寸 )。因此,在上面的代码,需要通过屏幕高度和视图一高度差来计算上方空白站位视图高度。...scrollDisabled( 则让我们可以在 iOS 16+ 屏蔽 ScrollView 滚动手势 )。...有关转场动画更多内容,请参阅 SwiftUI 动画机制[8] 一文 八、Layout 协议 在 4.0 版本SwiftUI 增加了 Layout 协议,通过该协议,开发者可以针对特定场景,创建自定义布局容器

3.2K00

Kafka - 分区各种偏移说明

在分区,有一些重要偏移量指标,包括AR、ISR、OSR、HW和LEO。下面我们来详细解释一下这些指标的含义和作用。...HW(High Watermark):高水位 HW是指已经被所有副本复制最高偏移量。当消费者从分区读取消息时,它会记录当前已经读取到偏移量,并将该偏移量作为下一次读取起始位置。...LEO(Log End Offset):日志末尾偏移量 LEO是指分区中最后一条消息偏移量。当生产者向分区写入消息时,它会将该消息偏移量记录在LEO。...综上所述,AR、ISR、OSR、HW和LEO是Kafka重要分区偏移量指标,它们对于保证消息可靠性、持久性、可用性和性能至关重要。...---- 分区各种偏移说明 分区所有副本统称为AR(Assigned Replicas)。

83810

如何在 SwiftUI 创建条形图

系列文章 如何在 SwiftUI 创建条形图 SwiftUI 水平条形图 在 iOS 16 中用 SwiftUI Charts 创建一个折线图 在 iOS16 中用 SwiftUI 图表定制一个线图...在 Swift 图表中使用 Foudation 库测量类型 开始图表布局 SwiftUI 对探索不同布局和预览实时视图结果是很友好。...条形图上值使用叠加视图修改移到了条形图顶部。这个值是偏移,所以文本不会离条形图顶部太近。数据名称字体大小和字重也可以被设置。...图标被设置为固定大小,视图被嵌入到 ScrollView ,以便在设备旋转时滚动。...SwiftUI 是一个很好平台,用于创建视图和快速重构独立子视图。在 SwiftUI 构建条形图需要做一些工作,随着使用数据来试用条形图,可以确定更多定制化。

5.1K10

SwiftUI 方式进行布局

有关这方面的内容,请参阅 SwiftUI 布局 —— 尺寸( 下 ) 一文“面子和里子”章节。...有关建议尺寸、需求尺寸等内容,请参阅 SwiftUI 布局 —— 尺寸( 上 ) 一文 三、NameSpace 从 3.0 版本( iOS 15 )开始,SwiftUI 提供了新 NameSpace...这意味着,在 ScrollView ,子视图最好明确设定尺寸( 提出明确地需求尺寸 )。因此,在上面的代码,需要通过屏幕高度和视图一高度差来计算上方空白站位视图高度。...scrollDisabled( 则让我们可以在 iOS 16+ 屏蔽 ScrollView 滚动手势 )。...有关转场动画更多内容,请参阅 SwiftUI 动画机制 一文 八、Layout 协议 在 4.0 版本SwiftUI 增加了 Layout 协议,通过该协议,开发者可以针对特定场景,创建自定义布局容器

4.7K80

掌握 SwiftUI Safe Area

掌握 SwiftUI Safe Area 访问我博客 www.fatbobman.com[1] 可以获得更好阅读体验 Safe Area(安全区域)是指不与导航栏、标签栏、工具栏或其他视图控制器提供视图重叠内容空间...在 UIKit ,开发者需要利用 safeAreaInsets 或 safeAreaLayoutGuide ,才能确保将视图放置在界面可见部分。 SwiftUI 对上述过程进行了彻底简化。...本文将探讨如何在 SwiftUI 获取 SafeAreaInsets、将视图绘制到安全区域之外、修改视图安全区域等内容。...使用 safeAreaInset 扩展安全区域 在 SwiftUI ,所有基于 UIScrollView 组件(ScrollView、List、Form),在默认情况下都会充满整个屏幕,但仍可确保我们可以在安全区域内看到所有的内容...safeAreaInsetList2 遗憾是,在 iOS 15 之前,SwiftUI 并没有提供调整视图安全区手段,如果我们想通过 SwiftUI 手段创建一个自定义 Tabbar 时,列表中最后内容将被

7.5K31

掌握 ViewThatFits

在 iOS 16 SwiftUI 增加了一个新自适应布局容器 ViewThatFits。正如其名称所示,它作用是在给定多个视图中找出最合适视图并使用。...理想尺寸( Ideal Size ) 在 SwiftUI ,相较于建议尺寸,很多开发者对理想尺寸接触较少,理解也不太深入。...在 SwiftUI ,我们可以通过 frame 来修改视图在理想状态下呈现。...在这个示例,尽管 ScrollView 在理想状态下,呈现宽度也超过了 ViewThatFits 允许宽度,但由于它是最后一个子视图,因此最终选择了它。这也是一个典型判断和呈现不一致情况。...但是,与任何强大工具一样,能否发挥期作用来自于深入理解其使用方式和限制。 在本文中,我们对 SwiftUI ViewThatFits 容器进行了深入探索。

15710

Ask Apple 2022 与 SwiftUI 有关问答(下)

A:你最好选择是使用 ScrollView 和 ScrollViewReader,并在 onAppear 或新内容进来时滚动到最底部视图。我不建议尝试旋转滚动视图。...目前 SwiftUI 没有 API 可以限制用户在字段输入字符。很希望苹果能够继续扩展基于 FormatStyle 解决方案,让其可以实时对输入内容进行校验。...阅读 SwiftUI 动画机制[16] 一文,了解更多有关动画内容。...另外,sheet 和 alert 内容都采用了 ViewBuilders,所以你可以以类似于处理 toolbar 内容方式将其提取到函数或计算属性。...在 SwiftUI ,有一个从第一版开始就存在但尚未公开SwiftUI 实现滚动容器 —— _ScrollView

14.7K30
领券