SwiftUI 调整视图内容周围间隙（Content Margins）的“时髦”方法

大熊猫侯佩

已于 2025-06-16 09:56:55 修改

阅读量1.3k

点赞数 42

CC 4.0 BY-SA版权

分类专栏： Apple开发入门文章标签： swiftui iOS iPadOS Margins 空白间隙 safeAreaPadding SizeClass

于 2024-05-11 09:59:41 首次发布

本文链接：https://blog.csdn.net/mydo/article/details/138176089

本文介绍了如何在SwiftUI中针对不同屏幕尺寸，特别是iPad，优雅地调整视图内容的空白间隙。从iOS 17开始，Apple提供了contentMargins修改器方法，使得开发者能够更精确地控制内容边际，同时保持滚动条位置不变，确保在大屏设备上的应用布局既美观又适应空间。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述

概述

在 SwiftUI 开发的应用中，往往在小屏设备（比如 iPhone）上布局良好的 App 放到大屏（iPad）上后就会“一塌糊涂”。因为它们一味的只想着“占据”却不知道“舍弃”。

在这里插入图片描述

从 iOS 17.0（iPad 17.0）开始苹果提供了原生的视图修改器方法专注于处理此事。

相信学完本课后，小伙伴们无论在何种尺寸屏幕上的 App 都会运行的恰如其分、悠然自得。

那还等什么呢？Let‘s fix it！！！😉

本文对应的视频课在此，欢迎恣意观赏！

SwiftUI 增加视图内容间隙（Margins）的时髦方法

1. “不和谐”的 iPad 内容空白

下面是一段非常简单的 SwiftUI 代码，我们在视图中显示了一个包含 100 行内容的列表：

struct ContentView: View {
   
   
    var body: some View {
   
   
        NavigationStack {
   
   
            List {
   
   
                ForEach(1..<100) {
   
    index in
                    Text("Item \(index

最低0.47元/天解锁文章

200万优质内容无限畅学