SwiftUI Buton点击区域问题

最新推荐文章于 2023-11-16 13:34:31 发布

小熊空间

最新推荐文章于 2023-11-16 13:34:31 发布

阅读量1.6k

点赞数

本文链接：https://blog.youkuaiyun.com/wjnhub/article/details/107316550

版权

iOS 同时被 3 个专栏收录

17 篇文章

订阅专栏

Swift

15 篇文章

订阅专栏

SwiftUI

7 篇文章

订阅专栏

本文探讨了在SwiftUI中创建按钮时遇到的问题：当按钮背景色设置在Button上时，仅点击文字区域能触发事件。文章分析了原因并提供了解决方案，即将修饰符应用于内部的Text视图。

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

问题

我们在创建一个Button的时候，通常会给它一个背景色，这样的按钮看起来更醒目
于是我们实现该按钮如下

Button(action: {
    self.alertTitle = "兑换"
    self.showAlert = true
}) {
    Text("兑换")
}
.foregroundColor(.blue)
.frame(width: UIScreen.main.bounds.width - 40, height: 45, alignment: .center)
.background(Color("ButtonBackColor"))
.cornerRadius(10.0)

效果图在这里插入图片描述

一切看上去很美好，可是。。。
问题出现了，当我们点击“兑换”两个字的位置时，可以正常触发点击事件，但是点击按钮其他区域的时候，没有任何反应。

解决

该问题是因为，我们将按钮的背景色设置在Button上，但是Button实际上是由其内部的Text视图触发的，所以，我们将修饰符用在内部的Text上即可
如下代码正常点击

Button(action: {
    self.alertTitle = "兑换"
    self.showAlert = true
}) {
    Text("兑换")
    .foregroundColor(.blue)
    .frame(width: UIScreen.main.bounds.width - 40, height: 45, alignment: .center)
    .background(Color("ButtonBackColor"))
    .cornerRadius(10.0)
}