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

SwiftUI:如何根据给定的宽度获取HostingController视图/内容maxHeight?

SwiftUI 是苹果公司于2019年推出的一种声明式的用户界面框架,用于创建跨平台的应用程序。它采用了现代化的编程范式,使开发人员能够使用简单且直观的代码来构建用户界面。

在 SwiftUI 中,我们可以使用 GeometryReader 来获取视图的几何信息,包括宽度和高度。根据给定的宽度获取 HostingController 视图/内容的最大高度的步骤如下:

  1. 首先,我们需要创建一个 HostingController,并将其作为根视图添加到 SwiftUI 的视图层次结构中。
代码语言:txt
复制
import SwiftUI
import UIKit

struct ContentView: View {
    var body: some View {
        UIViewControllerWrapper()
            .frame(maxWidth: .infinity, maxHeight: .infinity)
    }
}

struct UIViewControllerWrapper: UIViewControllerRepresentable {
    func makeUIViewController(context: Context) -> UIViewController {
        HostingController(rootView: MyView())
    }

    func updateUIViewController(_ uiViewController: UIViewController, context: Context) {
        // 更新视图控制器
    }
}

struct MyView: View {
    var body: some View {
        GeometryReader { geometry in
            Text("Max Height: \(geometry.size.height)")
                .frame(width: geometry.size.width, height: geometry.size.height)
                .background(Color.gray)
        }
    }
}
  1. 在上述代码中,我们创建了一个 ContentView 作为 SwiftUI 的根视图,并在其中使用 UIViewControllerWrapper 将 HostingController 添加到视图层次结构中。
  2. HostingController 是一个遵循 UIViewControllerRepresentable 协议的自定义类型,用于将 SwiftUI 的视图包装成 UIKit 的视图控制器。在 makeUIViewController 方法中,我们创建并返回一个 HostingController,并将 MyView 作为其根视图。
  3. MyView 是我们的自定义视图,其中使用 GeometryReader 来获取视图的几何信息。我们可以通过 geometry.size.height 来获取视图的最大高度,并在 Text 中显示出来。

通过上述步骤,我们可以根据给定的宽度获取 HostingController 视图/内容的最大高度。这样我们就可以根据需要调整视图的布局和尺寸。

腾讯云的相关产品和产品介绍链接地址,可以通过腾讯云官方文档进行查阅。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

SwiftUI 布局协议 - Part 1

早在2019年,我写了一篇文章SwiftUI 中 frame 表现[1],其中,我阐述了父视图和子视图如何协调形成最终视图效果。那里描述许多情况需要通过观察不同测试结果去猜测。...例如,我们看见文本获取需求空间后如何处置多余不需要空间,然而,如果需求空间大于提供,就可能会发生一些事情,具体取决于你如何配置你视图。...例如,可能会根据提供尺寸截取文本,或者在提供宽度内垂直展示文本,如果你使用 fixedSize 修改甚至可能超出屏幕就像例子中图片一样。...当 sizeThatFits 方法在给定维度中(即宽度或高度)收到建议尺寸为 nil 时,我们应该返回容器理想尺寸。当收到建议尺寸为0.0时,我们应该返回容器最小尺寸。...SimpleHStack 使用都是我们提供间距值,然而,在你使用了 HStack 一阵子,你就会知道如果没有指明间距,视图将会根据不同平台和内容提供默认间距。

3.3K10
  • SwiftUI 布局 —— 尺寸( 下 )

    而这种在布局之后、渲染之前对内容进行调整操作,大量存在于 SwiftUI 之中,例如:offset、scaleEffect、rotationEffect、shadow、background、cornerRadius...可在 此处获取[4] 本文仿制代码 frame SwiftUI 中有两个版本 frame,本节我们将仿制 frame(width: CGFloat?...(.init(width: width, height: height)) // 向子视图提交上方确定建议尺寸,并获取视图需求尺寸 return size // 以子视图需求尺寸作为...,获取视图宽度需求尺寸 // idealWidth 有值,且父视图宽度建议尺寸为未指定模式,需求宽度为 idealWidth if let idealWidth, proposal.width...contentWidth) } // 将上面确定需求宽度作为建议宽度获取视图需求高度 let contentHeight = content.sizeThatFits(

    2.7K40

    掌握 ViewThatFits

    在 iOS 16 中,SwiftUI 增加了一个新自适应布局容器 ViewThatFits。正如其名称所示,它作用是在给定多个视图中找出最合适视图并使用。...ViewThatFits 判断和呈现逻辑 既然 ViewThatFits 是从给定视图中挑选出最合适那个,那么它判断依据是什么呢?判断顺序如何?最终又如何呈现呢?...首先,ViewThatFits 需要获取它所能使用空间,也就是其父视图给出建议尺寸。 判断顺序根据 ViewBuilder 闭包中顺序,从上至下逐个对子视图进行。...根据代码中注释标注不同 Text 宽度,最终呈现会是什么样子呢?...自适应滚动 通过下面的代码,我们可以实现在内容宽度超过给定宽度时,自动进入可滚动状态。

    20210

    GeometryReader :好东西还是坏东西?

    一个容器视图根据其自身大小和坐标空间定义其内容。 严格来讲,我并不完全赞同上述描述。这并非因为存在事实上错误,而是这种表述可能会引起用户误解。...官方文档中“定义其内容( defines its content )”这一表述容易让人误以为 GeometryReader 主要功能是主动影响子视图,或者说其获取几何信息主要用于子视图,但实际上,...ScrollView 提供建议宽度,并根据这个宽度计算出所需高度。...父视图是否根据视图需求尺寸来放置子视图,以及子视图是否根据视图给出建议尺寸来返回需求尺寸,完全取决于父视图和子视图预设规则。...GeometryReader 常用于需要限定比例场景,例如让视图占据可用空间 25% 宽度,或者像上文中根据给定高宽比来计算高度。

    62870

    掌握 SwiftUI Safe Area

    掌握 SwiftUI Safe Area 访问我博客 www.fatbobman.com[1] 可以获得更好阅读体验 Safe Area(安全区域)是指不与导航栏、标签栏、工具栏或其他视图控制器提供视图重叠内容空间...本文将探讨如何SwiftUI获取 SafeAreaInsets、将视图绘制到安全区域之外、修改视图安全区域等内容。...如何获取 SafeAreaInsets 什么是 SafeAreaInsets SafeAreaInsets 是用来确定视图安全区域插入值。...如果只需要获取视图 safeAreaInsets ,我们也可以使用更加直接方式。...safeAreaInsetList2 遗憾是,在 iOS 15 之前,SwiftUI 并没有提供调整视图安全区手段,如果我们想通过 SwiftUI 手段创建一个自定义 Tabbar 时,列表中最后内容将被

    7.7K31

    深入了解 SwiftUI 5 中 ScrollView 新功能

    可以在 此处[1] 获取完整演示代码 访问我博客 www.fatbobman.com[2] 可以获得更好阅读体验以及最新更新内容。...(视图标识) 不支持锚点设定,固定锚点为子视图 center 正如 优化在 SwiftUI List 中显示大数据集响应效率[6] 一文所提到,当数据集很大时,也会出现性能问题。...通过这个坐标系,开发者可以非常容易地获取视图与滚动视图之间位置关系。利用这些信息,我们可以轻松地实现很多效果,尤其是配合另一个新 API,visualEffect 修饰符。...是今年新增 API,用于获取指定坐标空间边界矩形。...当子视图滑入和滑出包含它滚动视图可视区域时,scrollTransition 会对该视图应用给定过渡动画,并在不同阶段之间平滑地过渡。

    83220

    使用 SwiftUI 创建一个灵活选择器

    在使用 UIKit 时,我总是将这种类型视图实现为具有特定 UICollectionViewFlowLayout UICollectionView。但在 SwiftUI 中该如何实现呢?...在映射中,我使用 reduce 函数来总结与给定输入值相关联所有宽度(文本宽度、边框宽度、文本填充和间距)。...,我们必须计算 VStack 高度,以使 SwiftUI 更容易解释我们视图组件。...VStack 高度是根据两个值计算: 输入数据中任何项目的高度(类似于宽度计算,通过使用 reduce 函数,总结与项目相关所有高度) 将显示在 VStack 中行数 private func...然后,详细介绍了实现该选择器逻辑,包括如何处理选项布局、宽度和高度,以及如何处理用户与按钮交互。 最后,提供了一个简单视图实现,可以在 SwiftUI 中使用该选择器。

    29620

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

    自定义布局Q:我经常想根据列表中最长或最短文字来布置各种小组件。鉴于动态文本大小在应用程序运行时可能会发生变化,衡量给定字体文本大小最佳方法是什么?A:你好!我们新布局协议支持这个功能。...Jane 自动根据宽度排版[10] 视频与该问题十分契合。阅读 The SwiftUI Layout Protocol [11]了解如何创建自定义布局。...TextField 内容验证Q:如何实现一个只接受数字 SwiftUI TextField,小数是允许。A:向文本字段提供 FormatStyle 以实现自动将文本转换为各种数字。...截止 SwiftUI 目前版本,可以通过以下步骤获取到滑动距离:自定义 struct, 让它实现 PreferenceKey 协议,其自定义结构体,是需要收集 gemmetry data (视图坐标信息...www.fatbobman.com/posts/layout-dimensions-1/[9] 演讲: https://developer.apple.com/videos/play/wwdc2021/10019/[10] 自动根据宽度排版

    14.8K30

    SwiftUI 中用 Text 实现图文混排

    欢迎大家在 Discord 频道[2] 中进行更多地交流SwiftUI 提供了强大布局能力,不过这些布局操作都是在视图之间进行。...如果 Text 视图无法在给定建议宽度内显示全部内容,在建议高度允许情况下( 没有限制高度或显示行数 ),Text 会对内容进行换行处理,通过多行显示方式保证内容完整性。...Text 中添加 Image 进行图文混排,需要考虑如何处理动态类型变化问题( 不可能预生成如此多尺寸图片 )是否可以不通过预制标签图片方式( 用动态视图 )来解决当前问题下文中,我将提供三种解决思路和对应代码...方案一:在 Text 中直接使用图片方案一解决思路既然为不同动态类型提供不同尺寸图片可以满足 Text 图文混排需求,那么方案一就以此为基础,根据动态类型变化自动对给定预制图片进行等比例缩放即可...,需要提供分辨率较高原始图片,这样会造成更多系统负担方案二:在 Text 上使用覆盖视图方案二解决思路不使用预制图片,通过 SwiftUI 视图创建标签根据标签视图尺寸创建空白占位图片在 Text

    4.4K30

    SwiftUI 之 HStack 和 VStack 切换

    前言 SwiftUI 各种堆栈是许多框架中最基本布局工具,能够让我们定义组视图,这些组视图可以按照水平、垂直或覆盖视图对齐。...background(Color.blue) .cornerRadius(10) } } 以上代码中,我们用到了 fixedSize 防止按钮文本被截断,这仅是在我们确信给定内容视图不会比视图本身更大情况...一种方式是用 GeometryReader 测量当前可用空间,并根据宽度是否大于其高度,可以选择使用 HStack 或 VStack 来渲染内容。...虽然我们也有很多方法能解决这些问题(例如使用类似在这篇 Q&A 中用来使多个视图具有相同宽度和高度技术),但真正问题是当我们要动态的确定方向时,测量可用空间是否是一个好方法。...结语 以上就是通过四种不同方式实现 DynamicStack 视图,它可以根据当前内容在 HStack 和 VStack 之间动态切换。 - EOF -

    2.8K10

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

    然后根据焦点状态来定制它显示样式。希望这对你设计有用。自从 SwiftUI 3.0 提供了 safeAreaInset 视图修饰器之后,实现问题中案例将不再是难事。...阅读 SwiftUI 动画机制[8] 一文,了解更多有关动画内容。自适应高度 SheetQ:如何在 iOS16 中呈现与动态内容高度相匹配 Sheet?...场景内容视图定义了场景创建窗口中视图内容,但场景本身定义了应用程序整体结构。SwiftUI 4.0 中,WindowGroup 获得了相当大更新,真正具备了开发 macOS 应用能力。...在常规宽度下,我们在详细视图中有一个带有导航堆栈侧边栏。在紧凑宽度下,我们有一个标签栏,每个标签都有一个导航堆栈。...image-20221022135326560San Francisco 宽度风格Q:如何SwiftUI如何使用 SF 字体家族新增三种宽度风格( Compressed、Condensed、Expanded

    12.3K20

    酷我音乐iOS小组件适配开发实践

    小组件开发遇到问题 iOS17适配容器视图问题 swiftUI中支持Button 在Extensionwidget中无法正常使用 使用AppIntent Button 后 widget和host...开发使用swiftUI框架,没测试过是否兼容Objective-C内容....更新数据以供swiftUI视图展示和交互使用),这种数据驱动视图符合swiftUI声明式编程范式(跟我们用OOP面向对象有较大差距) 这篇文章不能算教程,只能是算开发中遇到过程记录,如果需要查看开发教程的话我建议去...使用时候请注意.systemSmall样式小组件. 6.如何实现歌词动画 先来看下酷我这边实现效果. 双行歌词动效实现非常简单全部基于SwiftUI中系统提供API实现....目前确实没有太好解决方式,如果后续有进展会继续发布相关文章,这里全当记录一下TODO. 8.widgetBundle超出10个数量限制问题 这个主要是SwiftUI不支持超过单层堆叠视图超过10层,

    1.2K30

    酷我音乐iOS小组件适配开发实践

    小组件开发遇到问题 iOS17适配容器视图问题 swiftUI中支持Button 在Extensionwidget中无法正常使用 使用AppIntent Button 后 widget和host...开发使用swiftUI框架,没测试过是否兼容Objective-C内容....更新数据以供swiftUI视图展示和交互使用),这种数据驱动视图符合swiftUI声明式编程范式(跟我们用OOP面向对象有较大差距) 这篇文章不能算教程,只能是算开发中遇到过程记录,如果需要查看开发教程的话我建议去...使用时候请注意.systemSmall样式小组件. 6.如何实现歌词动画 先来看下酷我这边实现效果. 双行歌词动效实现非常简单全部基于SwiftUI中系统提供API实现....目前确实没有太好解决方式,如果后续有进展会继续发布相关文章,这里全当记录一下TODO. 8.widgetBundle超出10个数量限制问题 这个主要是SwiftUI不支持超过单层堆叠视图超过10层,

    88421

    手把手教你读懂源码,View绘制流程详细剖析

    接着再将前面得到宽度maxWidth和高度maxHeight分别加上当前视图所设置Padding值,得到宽度maxWidth和高度maxHeight还不是最终宽度和高度,还需要考虑以下两个因素:...当前视图是否设置有最小宽度和高度。如果设置有的话,并且它们比前面计算得到宽度maxWidth和高度maxHeight还要大,那么就将它们作为当前视图宽度和高度值。 2. 当前视图是否设置有前景图。...如果设置有的话,并且它们比前面计算得到宽度maxWidth和高度maxHeight还要大,那么就将它们作为当前视图宽度和高度值。...经过上述两步检查之后,FrameLayout类成员函数onMeasure就得到了当前视图宽度maxWidth和高度maxHeight。...计算根据是在xml文件或者代码中设置宽度和高度参数,参数指明了要求你是填充父控件(match_parent)还是包裹内容(wrap_content)还是精确一个大小,但最终你大小不应该超过父控件给你提供空间

    1.1K100

    解析 SwiftUI 中两处由状态更新滞后引发严重 Bug

    众所周知,SwiftUI 是一个响应式框架,这意味着,当数据源发生变化时,框架会自动更新视图。同样,当我们想调整视图显示时,应直接对状态进行修改。...原文发表在我博客 肘子Swift记事本视图变化在前、状态变化在后在 SwiftUI 中,某些可编程控件在执行一定操作时,会先更新视图,待视图变化完成后再修改与其对应状态。...而通过调用环境值或直接修改绑定状态,SwiftUI 则遵循了响应式编程原则,进行了先调整状态,后更新视图操作。...,左上角 Back 按钮将消失,但视图并没有返回根视图图片如果我告诉你,上述情况正是由前文提到状态更新滞后所导致,那么你该如何避免这个问题呢?...AttributeGraph 是 SwiftUI 用于维护众多数据源与视图之间依赖关系工具。

    706110
    领券