Блог

В следующем фрагменте кода красные круги, очевидно, не помещаются на экране, и поэтому отображается только конечная часть HStack. Вместо такого поведения я хочу, чтобы начальный текст HStack всегда был виден и обрезал завершающие красные круги, которые не вписываются в доступное пространство (заменено на …). Как я могу это сделать?

 struct ContentView: View {

    var body: some View {
        HStack {
            Text("This text should always be visible")
                .layoutPriority(1)
            Spacer()
            ForEach(0..<20) { index in
                Image(systemName: "circle.fill")
                    .font(.body)
                    .foregroundColor(.red)
            }
        }
    }
}
 

Поэтому я хочу этого:

вместо этого:

Может получить все, кроме эллипсов с:

 struct ContentView: View {
  var body: some View {
    HStack {
      Text("This text should always be visible")
        .fixedSize()
      ForEach(0..<20) { index in
        Image(systemName: "circle.fill")
          .font(.body)
          .foregroundColor(.red)
      }
    }
    .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
  }
}
 

Чтобы получить эллипсы, вам, вероятно, придется рассчитать размеры кадров или попытаться поместить ваши изображения в строку атрибутов, что может оказаться довольно сложным. Вы также можете рассмотреть вид прокрутки или сетку.