如何在 swift ui 中调整形状以适应文本视图的长度和宽度

Posted 2023-02-24

【中文标题】如何在 swift ui 中调整形状以适应文本视图的长度和宽度

【英文标题】：How can I fit a shape in swift ui to accommodate the length and width of a text view

【发布时间】：2020-04-19 23:51:14

【问题描述】：

ZStack
                        RoundedRectangle(cornerRadius: 8).foregroundColor(.red).scaledToFit()//.frame(width: 200, height: 25)
                        HStack
                            Image(systemName: "tag.fill").foregroundColor(.white)
                            Text("Tickets Not Available").font(.headline).foregroundColor(.white).fixedSize(horizontal: true, vertical: false)
                        
                    .scaledToFit()

如您所见，我的视图放置在 zstack 中，因此圆角矩形可以作为文本视图的背景。我已经尝试了很多不同的事情，比如将 .scaledtofit 放在哪里，它每次都会给我带来奇怪的结果。

【参考方案1】：

这是你所追求的（注意 Image.resizable）：

import SwiftUI

struct ContentView: View 

var body: some View 
    ZStack
        RoundedRectangle(cornerRadius: 8).foregroundColor(.blue)
        HStack
            Image(systemName: "tag.fill").resizable().padding(4).foregroundColor(.white).scaledToFit()
            Text("Get Tickets").font(.headline).foregroundColor(.white)
        
    .fixedSize()

【参考方案2】：

这个问题有点不清楚，但是如果你想在文本视图中调整一个形状，并且你可以摆脱 scaledToFit，那么代码应该是：

RoundedRectangle(cornerRadius: 8).foregroundColor(.red).frame(width: textView.width, height: textView.height)

希望这会有所帮助，并希望您不需要使用 scaledToFit。 如果你确实在 cmets 中告诉我。

【讨论】：

我没有使用 swift ui，这不是我想要的，我希望矩形缩放到我所附图片中的文本大小。

【参考方案3】：

可重用的 ButtonStyle 在这里可能会有所帮助。而不是ZStack，使用.background 修饰符有助于保持按钮内容的大小：

struct RoundedButtonStyle: ButtonStyle 
    func makeBody(configuration: Self.Configuration) -> some View 
        ZStack 
            configuration.label
                .font(.headline)
                .padding()
                .background(RoundedRectangle(cornerRadius: 8).foregroundColor(Color.blue))
        
    

使用示例：

Button(
    action: 
        print("Button Tapped")
    ,
    label: 
        HStack 
            Image(systemName: "tag.fill")
            Text("Tickets")
        
    
)
.buttonStyle(RoundedButtonStyle())