SwiftUI-调整视图窗口尺寸

发表于 分类于 本文字数： 871 阅读时长 ≈ 3 分钟
制定合适的视图窗口尺寸来呈现内容

固定尺寸

使用.frame设定宽高值

在声明文件里已定义的视图下方书写

1
2
3
4
5
代码示例
WindowGroup {
            ContentView()
                .frame(width: 300, height: 300)
        }

固定尺寸示例

这样书写后窗口依旧是可缩放的，还需要使用.windowResizability设定缩放规则

在WindowGroup下方书写.windowResizability

1
2
3
4
5
6
7
代码示例
WindowGroup {
            ContentView()
                .frame(width: 300, height: 300)
        }
        .windowResizability(.contentSize)
    }

无限制尺寸示例

写完以上，窗口最大化图标变灰且实现屏蔽缩放

Note

.windowResizability的三种规则

.contentSize
内容大小。以定义的视图尺寸设定窗口可调节大小。若组件尺寸大于视图，则会按照组件尺寸固定，但通常组件小于视图。通常用于不可调窗口或范围可调窗口（一般仅限制最小尺寸而不限制最大尺寸，这是特例）

.contentMinSize
最小内容尺寸。以定义的视图最小尺寸设定窗口可调节最小尺寸。需要提前定义视图的最小尺寸。通常仅用于限制最小尺寸窗口

.automatic
自动。相当于自动实现.contentSize和.contentMinSize的功能。建议写具体规则，避免混乱

无限制

使用.frame设定最大宽高值

需求是无限制，那么把宽高值设为.infinity无限大即可

在视图声明文件里已定义的视图下方书写

1
2
3
4
5
代码示例
WindowGroup {
            ContentView()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }

系统默认以窗口内最大组件尺寸为窗口最小缩放尺寸，下面的步骤可省略，但为了规范可以添上

在WindowGroup下方书写.windowResizability

1
2
3
4
5
6
代码示例
WindowGroup {
            ContentView()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .windowResizability(.automatic)//可用.contentSize替换.automatic

无限制尺寸示例

写完以上，窗口可以实现全屏最大化、最大程度缩小（非最小化至Dock栏）

范围限制

限制最大尺寸

使用.frame设定宽高值

在视图声明文件里已定义的视图下方书写

1
2
3
4
5
代码示例
WindowGroup {
            ContentView()
                .frame(maxWidth: 400, maxHeight: 400)
        }

在WindowGroup下方书写.windowResizability

1
2
3
4
5
6
7
代码示例
WindowGroup {
            ContentView()
                .frame(maxWidth: 400, maxHeight: 400)
        }
        .windowResizability(.contentSize)
    }

限制最大尺寸示例

写完以上，可以屏蔽窗口全屏最大化，实现最大程度缩小（非最小化至Dock栏）

限制最小尺寸

使用.frame设定宽高值

在视图声明文件里已定义的视图下方书写

1
2
3
4
5
代码示例
WindowGroup {
            ContentView()
                .frame(minWidth: 400, minHeight: 400)
        }

在WindowGroup下方书写.windowResizability

1
2
3
4
5
6
7
代码示例
WindowGroup {
            ContentView()
                .frame(minWidth: 400, minHeight: 400)
        }
        .windowResizability(.contentMinSize)//可用.automatic替代.contentMinSize
    }

限制最大尺寸示例

写完以上，可以实现窗口全屏最大化，屏蔽最大程度缩小（非最小化至Dock栏）