SwiftUI:如果满足条件,如何为文本添加边框?
Posted
技术标签:
【中文标题】SwiftUI:如果满足条件,如何为文本添加边框?【英文标题】:SwiftUI: How to add a border to text in if conditions are met? 【发布时间】:2021-03-27 23:14:07 【问题描述】:我知道我可以使用类似的东西:
Text("Hello World")
.overlay(
RoundedRectangle(cornerRadius: 10)
.stroke(Color.black, lineWidth:1)
)
在文本视图周围添加边框,但是如何根据真/假值添加它?假设我想要一个按钮,当按下时会在文本周围添加边框,我怎样才能实现覆盖仅在 var 为真时才出现?
【问题讨论】:
【参考方案1】:这项工作最更容易和正确的方法在这里:
如果用于显示 Border 的变量为 true,它将起作用,否则它将应用 nothing!
import SwiftUI
struct ContentView: View
@State private var addBorder: Bool = false
var body: some View
Text("Hello, world!")
.padding()
.overlay(addBorder ? RoundedRectangle(cornerRadius: 10).stroke(Color.black, lineWidth:1) : nil)
Button("add Border") addBorder.toggle()
.padding()
【讨论】:
非常感谢您的帮助!做到了,这正是我想要的!【参考方案2】:一个简单的方法是这样的:
@State var wantBorder = false
...
Text("Hello World")
.overlay(
RoundedRectangle(cornerRadius: 10)
.stroke(wantBorder ? Color.black : Color.clear, lineWidth:1)
)
【讨论】:
【参考方案3】:如果您谈论的是按钮事件,您可能希望使用自定义 ButtonStyle
以便您可以对新闻状态做出反应:
struct ContentView: View
var body: some View
Button(action: )
Text("Hello World")
.buttonStyle(CustomButtonStyle())
struct CustomButtonStyle : ButtonStyle
@ViewBuilder func makeBody(configuration: Configuration) -> some View
if configuration.isPressed
configuration.label
.overlay(
RoundedRectangle(cornerRadius: 10)
.stroke(Color.black, lineWidth:1)
)
else
configuration.label
在非按钮情况下,您可以使用三元表达式并在条件不成立时提供 nil:
struct ContentView: View
@State var showOverlay = false
var body: some View
Button(action: showOverlay.toggle() )
Text("Hello World")
.overlay(
showOverlay ?
RoundedRectangle(cornerRadius: 10)
.stroke(Color.black, lineWidth:1)
: nil)
最后,一种相对简洁的方法是使用视图修饰符:
struct ContentView: View
@State var showOverlay = false
var body: some View
VStack(spacing: 10)
Button("Toogle")
showOverlay.toggle()
Text("Hello World").modifier(OverlayModifier(showOverlay: showOverlay))
struct OverlayModifier : ViewModifier
var showOverlay : Bool
@ViewBuilder func body(content: Content) -> some View
if showOverlay
content
.overlay(
RoundedRectangle(cornerRadius: 10)
.stroke(Color.black, lineWidth:1)
)
else
content
【讨论】:
以上是关于SwiftUI:如果满足条件,如何为文本添加边框?的主要内容,如果未能解决你的问题,请参考以下文章