在视图左侧显示文本

Question

我的应用程序上有一个屏幕，女巫从 firebase 获取数据然后显示它。但我想让 2 Text() 查看另一个下方的文本，但由于某种原因，文本没有显示在视图的左侧

问题：

我的代码：

struct ResourceItem: View {
    
    var title: String
    var url: String
    
    var body: some View {
        VStack {
            
            Link(destination: URL(string: url)!) {
                
                Text(title)
                    .bold()
                    .font(.system(size: 18))
                
                Text(url)
                    .bold()
                    .foregroundColor(.gray)
                    
            }
        }
    }
}

Answer 1

Link 使用默认配置创建它自己的VStack。这就是为什么当您将 Link 放在 VStack 中时 - 外部容器会被忽略。

你需要把VStack(alignment: .leading)放在Link里面：

struct ResourceItem: View {
    
    var title: String
    var url: String
    
    var body: some View {
        Link(destination: URL(string: url)!) {
            VStack(alignment: .leading) {
                Text(title)
                    .bold()
                    .font(.system(size: 18))
                Text(url)
                    .bold()
                    .foregroundColor(.gray)
            }
        }
    }
}

Answer 2

如果您需要将这些文本放在一行 - 只需将它们放在水平堆栈中 -

HStack (alignment: .leading) {
Text(title)
    .bold()
    .font(.system(size: 18))
Text(url)
    .bold()
    .foregroundColor(.gray)

}

Answer 3

试试这个：

VStack (alignment: .leading) {
    Text(title)
        .bold()
        .font(.system(size: 18))
    Text(url)
        .bold()
        .foregroundColor(.gray)
}