小编mg_*_*erk的帖子

我有一个带有发送按钮的textfield，它是一个systemImage箭头。我希望图像的前景色根据textField是否为空而改变。（即按钮为灰色，如果文本字段为空，则禁用该按钮。如果文本字段文本的计数> 1，则为蓝色）。

我有一个不完善的解决方法：

if chatMessageIsValid {
                Spacer()
                HStack {
                    TextField($chatMessage, placeholder: Text("Reply"))
                        .padding(.leading, 10)
                        .textFieldStyle(.roundedBorder)
                    Button(action: sendMessage) {
                        Image(systemName: "arrow.up.circle")
                            .foregroundColor(Color.blue)
                            .padding(.trailing, 10)
                        }.disabled(!chatMessageIsValid)
                }
            } else {
                Spacer()
                HStack {
                    TextField($chatMessage, placeholder: Text("Reply"))
                        .padding(.leading, 10)
                        .textFieldStyle(.roundedBorder)
                    Button(action: sendMessage) {
                        Image(systemName: "arrow.up.circle")
                            .foregroundColor(Color.gray)
                            .padding(.trailing, 10)
                        }.disabled(!chatMessageIsValid)
                }
            }

这几乎可以工作，并且如果文本的长度> 1，它的确会更改图像的颜色。但是，由于状态的变化，您在键入一个字符后将无法再编辑文本字段，因此您需要再次选择文本字段才能继续输入。是否有更好的方法使用.disabled修饰符来做到这一点？

我有两个文本字段，用于更改两个 @State 变量（即startingMileage 和endingMileage）的值，以及一个步进器，用于更改名为fuelAdded 的第三个@State 变量的值。我正在尝试使用用户的输入并进行计算来计算每加仑的英里数。在操场上，我的代码按预期工作。但是，它在 SwiftUI 项目中不起作用。

尝试在操场上运行代码如下：

func CalcMPG(start: String, end: String, fuel: Double) -> Int {
    let start = Int(start) ?? 1
    let end = Int(end) ?? 1
    let fuel = Int(fuel)
    let mpg = (end-start) / fuel
    return mpg
}


var endingMileage:String = "9250"
var startingMileage:String = "9000"
var fuelAdded:Double = 20

let milesPerGallon = CalcMPG(start: startingMileage, end: endingMileage, fuel: fuelAdded)
print("Fuel Efficiency: \(milesPerGallon) mpg")

这按预期工作。

struct ContentView : View {

    @State var startingMileage: String = …

尝试使用视图作为列表行样式来创建自定义列表（默认情况下，要摆脱列表中的丑陋行）。

但是，一旦我将ZStack行放入滚动视图中，滚动视图就会在两个方向上滚动，而不仅仅是垂直滚动。

这是contentView：

NavigationView {
            ScrollView{
                VStack(alignment: .leading){
                    ForEach(friends) { friends in
                        NavigationButton(destination: MessageDetailView(friend: friends)) {
                            CustomListItem(friend: friends)
                        }
                    }
                    Spacer()
                }
            }
                .foregroundColor(.black)
                .navigationBarTitle(Text("Messages"))
        }

这是customListItem：

Group{
            ZStack {
                RoundedRectangle(cornerRadius: 10)
                    .shadow(radius: 1, y:1)
                    .frame(width: UIScreen.main.bounds.width - 32, height: 75)
                    .foregroundColor(.gray)

                HStack {
                    Image(systemName: "person.crop.circle")
                        .resizable()
                        .frame(width: 50, height: 50)
                    VStack(alignment: .leading) {
                        HStack {
                            Text(friend.name)
                                .font(.headline)
                            Text("\(friend.date, formatter: dateFormatter)")
                        }
                        Text(friend.messagesReceived[0])
                            .font(.subheadline)
                        }       .lineLimit(nil)
                    Spacer()
                    Image(systemName: "chevron.right.circle")
                        .foregroundColor(.black)
                    }.padding(10)
                }.padding([.leading, .trailing])
        }

有什么方法可以限制滚动到垂直方向或在此方向上强制画格吗？

尝试使用.frame（...）修饰符不起作用，因为我尝试过。这导致视图根本无法加载。

图片示例：

我想获取一个可变长度的数组并返回一个具有 3 列和可变行长度的视图网格。视图应该根据数组值更新它的内容。

以下代码将为每张卡片显示一个 CardPicView，滚动视图中的标题为“A”...“I”。

struct ContentView : View {
    let cards = ["A", "B", "C", "D", "E", "F", "G", "H", "I"]
    var body: some View {
        ScrollView {
            ForEach(cards.identified(by: \.self)) { card in
                    CardPicView(cardTitle: card)
            }
        }
    }
}

我想把这个滚动视图分成 3 列，本质上。

我发现下面的代码可以使用以下代码创建一个合适大小的网格：

struct ContentView : View {
    let cards = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L"]
    var body: some View {
        ScrollView{
            ForEach(0..<cards.count/3) { row in // create number of rows
                HStack …