swiftui开发之padding默认值设置详解
更新时间：2022年09月23日 14:05:05 作者：new_cheng
这篇文章主要为大家介绍了swiftui开发之padding默认值设置详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
正文
swiftui 中的 padding 用于设置视图的填充。
使用 padding() 可以指定 Text、Button 等视图填充的数值，或者是对一个或多个边设置填充。
下面让我们来看看 padding 有哪些使用方式。
padding 的默认值
使用 padding() 设置填充时，没有设置具体数值将会使用特定平台给定的默认值。而这个默认值并没有标准值，对于不同的设备，用户的设置等情况，padding 的默认值都会有所不同：
如果值为 nil，则将应用特定平台指定的或者由系统计算的值用于填充。
来看看具体示例：
import SwiftUI
struct Test: View {
var body: some View {
VStack{
Text("没有默认值的padding")
.padding()
.background(Color.red)
Text("填充值为16的padding")
.padding(16)
.background(Color.blue)
}
}
}
struct Test_Previews: PreviewProvider {
static var previews: some View {
Test()
}
}
iphone14 pro 显示效果(下面示例默认使用 iphone14 pro 显示）：
上图的显示效果中，默认值和 16 的效果近似，但不代表默认值就是 16。
对某个方向设置 padding
padding 可以对上下左右 4 个方向单独设置填充。
- top：上
- bottom：下
- leading：左
- trailing：右
import SwiftUI
struct Test: View {
var body: some View {
VStack{
Text("上padding")
.padding(.top, 20) // 文字顶部设置 20 像素的填充
.border(Color.gray)
Text("下padding")
.padding(.bottom, 20)
.border(Color.gray)
Text("左padding")
.padding(.leading, 20)
.border(Color.gray)
Text("右padding")
.padding(.trailing, 20)
.border(Color.gray)
// 统一设置 16 像素的填充
Text("填充值为16的padding")
.padding(16)
.border(Color.gray)
}
}
}
struct Test_Previews: PreviewProvider {
static var previews: some View {
Test()
}
}
注意：如果在设置某个方向的 padding 时没有给定具体数值，将会使用系统默认值：padding(.top)。
同时对多个方向设置 padding
我们还可以同时对多个方向设置 pdding。
import SwiftUI
struct Test: View {
var body: some View {
VStack{
Text("上下padding")
.padding([.top, .bottom], 20)
.border(Color.gray)
Text("上下左padding")
.padding([.top, .bottom, .leading], 20)
.border(Color.gray)
Text("左右padding")
.padding([.leading, .trailing], 20)
.border(Color.gray)
Text("左右下padding")
.padding([.bottom, .leading, .trailing], 20)
.border(Color.gray)
Text("水平padding")
.padding(.horizontal, 20)
.border(Color.gray)
Text("垂直padding")
.padding(.vertical, 20)
.border(Color.gray)
Text("填充值为16的padding")
.padding(16)
.border(Color.gray)
}
}
}
struct Test_Previews: PreviewProvider {
static var previews: some View {
Test()
}
}
对上下左右4个方向的 padding 进行精确设置
import SwiftUI
struct Test: View {
var body: some View {
VStack{
Text("精确控制4个方向的padding")
.padding(EdgeInsets(top: 10, leading: 20, bottom: 30, trailing: 40))
.border(Color.gray)
Text("填充值为16的padding")
.padding(16)
.border(Color.gray)
}
}
}
struct Test_Previews: PreviewProvider {
static var previews: some View {
Test()
}
}
总结
我们学会了 padding 的各个方向的设置，给你的布局加点 padding，对用户体验会更加友好哦。
以上就是swiftui开发之padding默认值设置详解的详细内容，更多关于swiftui padding默认值设置的资料请关注脚本之家其它相关文章！
相关文章
这篇文章主要为大家分享了10个惊艳的Swift单行代码,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
这篇文章主要为大家介绍了Swift之运算符重载示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-07-07
很多人想学习iOS开发，但是不知道如何从Objective-C和Swift之间选择。而网上的一些答案，大抵说的是，以后Swift终将取代Objective-C，但是目前来讲还是Objective-C比较重要。那么究竟怎样呢，今天我们就来探讨下2016-12-12
这篇文章主要为大家介绍了特定用例下的Combine全面使用详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-12-12
有时候,我们需要一个显示文字,又想这些文字与边界之间有自定义的边距,所以下面这篇文章主要给大家介绍了关于Swift设置UILabel内边距的相关资料,需要的朋友可以参考下2021-10-10
Swift有着超级严格的初始化方法，不仅强化了designated初始化方法的地位，所有不加修饰的init方法都需要在方法中确保非Optional的实例变量被赋值初始化，下面这篇文章主要给大家介绍了关于Swift中初始化init的相关资料，需要的朋友可以参考下。2022-08-08
这篇文章主要为大家详细介绍了swift实现颜色渐变以及转换动画，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-01-01
这篇文章主要介绍了Swift教程之函数详解,本文讲解了函数的声明与调用、函数的参数和返回值、函数参数名、函数类型等内容,需要的朋友可以参考下2015-01-01
你也许曾听过类型擦除,甚至也使用过标准库提供的类型擦除类型如 AnySequence,下面这篇文章主要给大家介绍了关于Swift中风味各异的类型擦除的相关资料,需要的朋友可以参考下2022-04-04
Swift中的条件切换语句switch...case学习教程
这篇文章主要介绍了Swift中的条件切换语句switch...case学习教程,Swift中的switch...case支持的数据类型很多,非常之强大,需要的朋友可以参考下2016-04-04
最新评论