SwiftUI：按钮和图片---韦弦zhy

SwiftUI中的按钮有两种显示方式，具体取决于外观。

制作按钮的最简单方法是当它仅包含一些文本时：传递按钮的标题，以及点击按钮时应运行的闭包：

Button("Tap me!") { print("Button was tapped") }

如果您还需要其他东西，例如图片或视图组合，则可以使用此替代形式：

Button(action: { print("Button was tapped") }) { Text("Tap me!") }

当您要将图片显示到按钮中时，这尤其常见。

SwiftUI具有用于处理应用程序中图片的专用Image类型，您可以通过三种主要方式创建它们：

Image("pencil")将加载您已添加到项目中的名为“ Pencil”的图片。 Image(decorative: "pencil")将加载相同的图像，但不会为启用了屏幕阅读器（苹果辅助功能）的用户加载。这对于不传递其他重要信息的图片很有用。 Image(systemName: "pencil")将加载iOS内置的"Pencil(铅笔)"图标,它使用Apple的SF Symbols图标集，从网络上下载Apple的免费SF Symbols应用程序以查看完整的图标集，您可以搜索您所需的图标。

默认情况下，如果启用了屏幕阅读器，它将读取您的图像名称，因此，如果要避免混淆用户，请确保为图像提供清晰的名称。或者，如果他们实际上并未添加屏幕上其他地方尚未存在的信息，请使用Image(decorative: "pencil")初始化程序。

由于较长形式的按钮内部可以具有任何视图，因此可以这样使用图片：

Button(action: { print("Edit button was tapped") }) { Image(systemName: "pencil") }

当然，您可以将它们与堆栈结合使用以制作更高级的按钮布局：

Button(action: { print("Edit button was tapped") }) { HStack(spacing: 10) { Image(systemName: "pencil") Text("Edit") } }

提示：如果您发现图像已被某种颜色填充，例如显示为纯蓝色而不是实际图片，则可能是SwiftUI为它们着色以显示它们是可点击的。要解决此问题，请使用renderingMode(.original)修饰符强制SwiftUI显示原始图像，而不是重新着色的版本。

Buttons and images >

Previous: 渐变色

Next: Alert弹窗

---来自腾讯云社区的---韦弦zhy