开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

SwiftUI ScrollView奇怪的垂直拉伸

SwiftUI ScrollView是一个用于在iOS和macOS应用程序中创建可滚动视图的组件。它允许用户在屏幕上滚动并查看超出屏幕尺寸的内容。ScrollView可以在垂直和水平方向上滚动，并且可以包含任意数量的子视图。

奇怪的垂直拉伸可能是由于以下原因之一：

内容大小不正确：ScrollView的内容大小可能超出了所需的范围，导致垂直拉伸。确保ScrollView的子视图的大小适合所需的内容，并且没有任何不必要的额外空间。
布局错误：ScrollView的子视图可能没有正确的布局约束，导致垂直拉伸。确保子视图具有正确的约束，以便它们在ScrollView中正确地定位和调整大小。
内容模式设置错误：ScrollView具有一个属性叫做contentMode，它决定了子视图在ScrollView中的布局方式。如果contentMode设置不正确，可能会导致垂直拉伸。尝试调整contentMode属性的值，以找到适合你的需求的布局方式。

推荐的腾讯云相关产品和产品介绍链接地址：

腾讯云提供了一系列云计算产品，包括云服务器、云数据库、云存储等。你可以通过以下链接了解更多相关信息：

腾讯云服务器（CVM）：提供高性能、可扩展的云服务器实例，适用于各种应用场景。了解更多：https://cloud.tencent.com/product/cvm
腾讯云数据库（TencentDB）：提供关系型数据库、NoSQL数据库和数据仓库等多种数据库产品，满足不同的数据存储需求。了解更多：https://cloud.tencent.com/product/cdb
腾讯云对象存储（COS）：提供安全、稳定、高扩展性的对象存储服务，适用于存储和管理各种类型的数据。了解更多：https://cloud.tencent.com/product/cos

请注意，以上链接仅供参考，具体产品选择应根据实际需求和情况进行评估和决策。

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

深入了解 SwiftUI 5 中 ScrollView 的新功能

在 SwiftUI 5.0 中，苹果大幅强化了 ScrollView 功能。新增了大量新颖、完善的 API。本文将对这些新功能进行介绍，希望能够让它们更多、更早的帮助到有需要的开发者。...滚动停止时，容器顶端将与子视图的顶部对齐（在垂直模式下）。开发者可以通过控制 scrollTargetLayout 的启用与否来开关 viewAligned 的行为。...NamedCoordinateSpace.scrollView 在 SwiftUI 5 中，苹果新增了 NamedCoordinateSpace 类型，方便用户命名坐标系，并提供了预置的 .scrollView...总结我完全没有想到，在 SwiftUI 5 中，苹果对 ScrollView 进行了全面增强。值得赞赏的是，他们不仅提供了一些一直期待的功能，而且在 API 的设计和实现完成度上都非常出色。...就我个人而言，在 SwiftUI 5 中，ScrollView 的原生方案已经能够满足大多数需求，因此我们将看到更多人采用 ScrollView + LazyStack 的组合方式。

6692 0

掌握 ViewThatFits

默认情况下，ViewThatFits 在水平和垂直轴上都进行约束。...唯一有些奇怪的是 VStack： VStack { Text("GeometryReader has been present since the birth of SwiftUI, playing...SwiftUI 提供了两个版本的 fixedSize ，我们当前使用的版本要求视图在水平和垂直两个轴向上都使用理想尺寸，而另一个版本允许我们对单个轴向进行限定。...100 的建议尺寸高度，充分利用了垂直方向上的空间，将完整的文本内容呈现出来。...会选择最后一个使用 ScrollView 的子视图。

1571 0

用 SwiftUI 的方式进行布局

本文将通过用多种手段完成同一需求的方式，展示 SwiftUI 布局系统的强大与灵活，并通过这些示例让开发者对 SwiftUI 的布局逻辑有更多的认识和理解。...（ axis 为 vertical ），但 ScrollView 与 VStack 在处理各种尺寸的逻辑上还是有非常大的差别。...ScrollView 会使用父视图给定的全部建议尺寸创建滚动区域，但在询问其子视图的需求尺寸时只会提供理想尺寸。...scrollDisabled（则让我们可以在 iOS 16+ 中屏蔽 ScrollView 的滚动手势）。...尽管当前的需求仅有两个视图，但我们仍然可以从中提炼出场景特性：在垂直排列的前提下，在特定状态时，指定视图的底部与容器视图的底部对齐。

3.2K0 0

用 SwiftUI 的方式进行布局

最近时常有朋友反映，尽管 SwiftUI 的布局系统学习门槛很低，但当真正面对要求较高的设计需求时，好像又无从下手。SwiftUI 真的具备创建复杂用户界面的能力吗？...本文将通过用多种手段完成同一需求的方式，展示 SwiftUI 布局系统的强大与灵活，并通过这些示例让开发者对 SwiftUI 的布局逻辑有更多的认识和理解。可在此处获取本文代码。...（ axis 为 vertical ），但 ScrollView 与 VStack 在处理各种尺寸的逻辑上还是有非常大的差别。...ScrollView 会使用父视图给定的全部建议尺寸创建滚动区域，但在询问其子视图的需求尺寸时只会提供理想尺寸。...尽管当前的需求仅有两个视图，但我们仍然可以从中提炼出场景特性：在垂直排列的前提下，在特定状态时，指定视图的底部与容器视图的底部对齐。

4.7K8 0

GeometryReader ：好东西还是坏东西？

在非滚动方向上，ScrollView 会向子视图提供该维度上的全部可用尺寸。而在滚动方向上，它向子视图提供的建议尺寸为 nil。...由于 GeometryReader 的 ideal size 为 (10,10)，因此，在滚动方向上，其返回给 ScrollView 的需求尺寸即为 10。...然后，通过 frame 调整 GeometryReader 向 ScrollView 提交的需求尺寸高度。这样，我们就能得到期望的显示结果。...比如，对于 VStack ，它会在垂直维度上，分别向子视图发送具有明确值的建议尺寸、未指定的建议尺寸、最大建议尺寸以及最小建议尺寸的信息，并获得子视图在不同建议尺寸下的需求尺寸。...请阅读用 SwiftUI 的方式进行布局[9] 和在 SwiftUI 中实现视图居中的若干种方法[10] 两篇文章，以了解面对同一个需求，SwiftUI 有多种布局手段。

4467 0

Ask Apple 2022 与 SwiftUI 有关的问答（下）

然后，您可以使用垂直或水平堆栈布局来组合它，这样您就不需要自己完成所有的实现工作。Jane 的自动根据宽度排版[10] 视频与该问题十分契合。...A：你最好的选择是使用 ScrollView 和 ScrollViewReader，并在 onAppear 或新内容进来时滚动到最底部的视图。我不建议尝试旋转滚动视图。...这是一个在多个版本中都出现过的奇怪问题。在 SwiftUI 早期版本中，当在 iOS 中使用系统中文输入法时，很容易触发这种情况。但后期逐步得到了修复。...在 SwiftUI 中，有一个从第一版开始就存在但尚未公开的纯 SwiftUI 实现的滚动容器 —— _ScrollView 。...该滚动容器提供了不少标准 ScrollView 无法提供的 API 接口，例如对手势的加强控制、容器内视图的位移、反弹控制等。

14.7K3 0

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

比如在 SwipeCell[3] 中，需要在可滚动组件开始滚动时，自动关闭已经打开的侧滑菜单。遗憾的是，SwiftUI 并没有提供这方面的 API 。...本文将介绍几种在 SwiftUI 中获取当前滚动状态的方法，每种方法都有各自的优势和局限性。...目前 SwiftUI 在内部的实现上去 UIKit（ AppKit ）化很明显，比如，本节介绍的方法在 SwiftUI 4.0 中已经失效方法二：Runloop我第一次接触 Runloop 是在学习 Combine...preference 与 onChange 的调用时机非常类似，只有在值发生改变后才会传递数据。在 ScrollView、List 发生滚动时，它们内部的子视图的位置也将发生改变。...待 SwiftUI 更多的底层实现不再依赖 UIKit（ AppKit ）之时，才会是它 API 的爆发期。希望本文能够对你有所帮助。

3.7K4 0

用 SwiftUI 实现 3D Scroll 效果

我们预览下今天要实现的 3D scroll 效果。学完本教程后，你就可以在你的 App 中把这种 3D 效果加入任何自定义的 SwiftUI 视图。下面我们来开始本教程的学习。...入门首先，创建一个新的 SwiftUI 视图。为了举例说明，在这个新视图中，我会展示一个有各种颜色的矩形列表，并把新视图命名为 ColorList。...在 ScrollView 嵌套中添加一个 HStack，如下： var body: some View { ScrollView(.horizontal, showsIndicators: false...var body: some View { ScrollView(.horizontal, showsIndicators: false) { HStack(alignment:...Effect: https://levelup.gitconnected.com/swiftui-3d-scroll-effect-fa5310665738

1.5K2 0

WWDC 23 之后的 SwiftUI 有哪些新功能

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

3202 0

SwiftUI 如何管理一组TextField(零基础教程)

欢迎订阅专栏《SwiftUI 2020教程》我们有一组TextField，如果简单高效的管理他们呢。...本文价值与收获看完本文后，您将能够作出下面的界面 [image.png] [联动效果] 看完本文您将掌握的技能管理一组TextField 使用ScrollView 设置圆形TextField 代码...3365059189",":3365059189","法国"] // @State var nation = ["美国",] var body: some View { ScrollView...Text(item) } } } } } 技术交流 QQ:3365059189 SwiftUI...技术交流QQ群:518696470 请关注我的专栏icloudend, SwiftUI教程与源码 https://www.jianshu.com/c/7b3e3b671970

1K0 0

SwiftUI 布局协议 - Part2

在下一个例子中我们将会把前三个视图水平的放置在视图顶部，后三个水平的放置在底部。剩下的视图将会在中间，垂直排列。...我们不需要编写垂直或者水平的间距逻辑代码，因为 SwiftUI 已经有这样的布局了：HStackLayout 和 VStackLayout。只是有点小问题，很轻易就可以修复。...这里应该只有一个父节点是 nil 的节点（根结点），你应该小心的避免循环引用（例如：两个节点互为父节点）。同时也要注意，这里有一个好的选择，即放置到具有垂直和水平的滚动 ScrollView 中。...： ScrollView { Text("Hello world!")...例如：检查一下使用和不使用 resizable()的图像尺寸。终于能看到数字是不是有一种奇怪的满足感？

2.7K3 0

Android中文API——ScrollView

通常用的子元素是垂直方向的LinearLayout，显示在最上层的垂直方向可以让用户滚动的箭头。...ScrollView只支持垂直方向的滚动。　　三、构造函数 public ScrollView (Context context) 创建一个默认属性的ScrollView实例。...public boolean isFillViewport () 指示当前ScrollView的内容是否被拉伸以填充视图可视范围（译者注：viewport可视范围，参见决定Scrollviewer里面...参数 fillViewport 设置为true表示拉伸内容高度来适应视口边界；其他设为false。...缺省的偏移是在当前视图滚动的偏移。返回值滚动条的滑块垂直方向的偏移。

4.5K3 0

如何在 SwiftUI 中创建条形图

前言条形图以矩形条的形式呈现数据的类别，其宽度和高度与它们表示的值成比例。本文将展示如何创建一个垂直条形图，其中矩形的高度将代表每个类别的值。...系列文章如何在 SwiftUI 中创建条形图 SwiftUI 中的水平条形图在 iOS 16 中用 SwiftUI Charts 创建一个折线图在 iOS16 中用 SwiftUI 图表定制一个线图...在 Swift 图表中使用 Foudation 库中的测量类型开始图表布局 SwiftUI 对探索不同布局和预览实时视图结果是很友好的。...图标被设置为固定大小，视图被嵌入到 ScrollView 中，以便在设备旋转时滚动。...SwiftUI 是一个很好的平台，用于创建视图和快速重构独立的子视图。在 SwiftUI 中构建条形图需要做一些工作，随着使用数据来试用条形图，可以确定更多的定制化。

5.1K1 0

SwiftUI案例：3D旋转图片播放器

SwiftUI案例：3D旋转图片播放器效果目标实现多张图片的3D切换查看功能外观配置任选 7 张任意尺寸的图片按 p1 至 p7 进行命名并拖拽进 Assets.xcassets 文件中（如图所示...import SwiftUI struct Home: View { //定义当前的图片 @State var currentTab = "p1" var body: some View...，实现 Home.swift 中组件的文本与图片的具体内容。...size.height / 1.2, alignment: .center) .cornerRadius(12) //圆角 //嵌套VStack（垂直排列子元素的视图...} } return Color.clear } ) } } //为ScrollView

2.3K3 0

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

开发环境多年不接触编程，在相当长的一段时间里仍无法完全适应当今如此复杂的 IDE 工具。另外 Xcode 的某些错误提醒也很神奇，一部分很准确、一部分很无语，把本来简单的错误指引到了奇怪的地方。...，不过就不优美了；切换页面 view 会重置状态，比如说 view1 里有个 ScrollView, 你已经进行了滚动，当你通过 TabView 切换到其他视图后切换回来，ScrollView 不会保留在原来的地方...ScrollViewSwiftUI 中的 ScrollView 沿袭了其他 SwiftUI 控件的特点，使用起来非常轻巧，但几乎不提供额外的控制选项。...但由于这个多层返回是显式的，也就是都有完整的动画，超过一层时，使用者的感觉会更怪。最后仅是在当 view 在 ZStack 的后面时使用了这个手段。Sheet问题很奇怪。...如果 TextField 在 ScrollView 中，当在不同的 Segment Picker 中切换时，使用系统自带中文输入会闪退。英文和第三方中文输入没有问题。

2.5K4 0

NSScrollView官方文档

设置vertical inset值限制了垂直滚动条，避免了越区域显示滚动条的问题。...scrollRectToVisible:animated:方法滚动到特殊的矩形区域，以确保区域在可视范围之内。如何在scrollView内容不够的时候也可以进行拉伸：通过设置弹跳属性。...如果bounces为YES，即便contentSize比scrollView bounds小也可以弹跳。...为了支持zooming，你必须设置scrollView的delegate，且要实现UIScrollViewDelegate协议。...大多数情况，这个delegate是scrollView的controller的class。

2.7K2 0

让你的布局滚动起来—ScrollView

简介 ScrollView称为滚动视图，当在一个屏幕的像素显示不下绘制的UI控件时，可以采用滑动的方式，使控件显示。...↳android.widget.ScrollView 可以看出， ScrollView原来是一个 FrameLayout的容器，不过在他的基础上添加了滚动，允许显示的比实际多的内容。...none（边框颜色不变），horizontal（水平方向颜色变淡），vertical（垂直方向颜色变淡）。...3. android:scrollbars="none" 设置滚动条显示，none（隐藏），horizontal（水平），vertical（垂直）。...ScrollView 对象是否需要拉伸自身内容来填充 viewport。

3.4K3 0

【Android从零单排系列二十七】《Android视图控件——HorizontalScrollView》

前言小伙伴们，在上文中我们介绍了Android视图组件ScrollView，本文我们继续盘点，介绍一下视图控件的HorizontalScrollView。...嵌套滚动：HorizontalScrollView可以与其他滚动容器（如ScrollView）嵌套使用，同时支持水平和垂直滚动。...二 HorizontalScrollView使用方法 HorizontalScrollView与ScrollView类似，但是支持水平方向上的滚动。...默认值为true，在子视图不足以填充水平空间时，会拉伸子视图使得水平空间被填满。 android:overScrollMode：设置滚动边界效果模式。...常见方法： scrollTo(int x, int y)：滚动到指定的坐标位置。其中x表示水平方向上的滚动位置，y表示垂直方向上的滚动位置。

2451 0

Unity基础（24）-UGUI

模式后，根据图片边框拉伸，图片的四个角会保持原状，而1和4部分会随着图片的横向拉伸而拉伸，2和3部分会随着图片的纵向拉伸而拉伸，图片的中间部分会拉伸5进行填充。...Tiled（平铺的）：若图片已经过裁切，则使用Tiled模式后，根据图片边框拉伸，图片的四个角会保持原状，而1和4部分会随着图片的横向拉伸而拉伸，2和3部分会随着图片的纵向拉伸而拉伸，图片的中间部分会用...（1）Truncate：文本不显示超出垂直边界的部分（2）Overflow：文本可以超出垂直边界，继续显示 5、Best Fit：勾选之后，编辑器发生变化，显示Min Size和Max Size...ScrollView的Content不能根据实际Content下的游戏物体的多少自动改变Content的宽高问题在实际使用UGUI开发的过程中发现一个UGUI的BUG：当Content下的子物体增加时...(在Hierarchy面板中右键创建UI->ScrollView,在子物体中找到Content，需要按行列布置的游戏物体都作为Content的子物体挂在Content下)（以开发垂直的ScrollView

4.3K2 0

解析SwiftUI布局细节（二）循环轮播+复杂布局

2、稍微复杂点View的布局思路和一些细节知识 3、SwiftUI循环轮播图这次总结的首页的UI布局如下，我们下面一点点的解析： ?...我们看看最底层的代码先： NavigationView{ ScrollView(showsIndicators:false,content: {...3、再提一点关于上面说的滚动视图，在UIKit中我们可以用UICollectionView搞定一切，但是在SwiftUI中没有这个控件，我建议采用的方式是 ScrollView + HStack + VStack...的方式去实现，很多同行有说目前来看SwiftUI的List在数据量大的情况下性能不是特别好，采用ScrollView是个不错的方式，而且也很容易构建出来，并不是说每一个Item的位置都需要你去计算，...区别于我们UIKit的创建方式，SwiftUI对它进行了简化，具体的创建如下： /// SwiftUI对定时器的简化，可以进去看看具体参数的定义 private let timer = Timer.publish

11.8K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭