Делаем элементы в HStack видимыми / невидимыми позже

Question

У меня есть игровое представление, в котором есть доска, и у меня есть несколько частей в VStack, а последние 2 HStack - это несколько "кнопок", а затем ряд плиток для игры.

        VStack(spacing: 5) {  
        HStack {}
        HStack {}
        ......
        ......
        HStack {

                ResetButton {
                    self.returnLetters()
                }
                NewLine {
                    self.newLine()
                }
                CalcButton {
                    self.calcButton()
                }
                StartButton {
                                   self.startButton()
                               }
                }

        HStack {
            ForEach(0..<7) { number in
                Letter(text: self.tray[number], index: number, onChanged: self.letterMoved, onEnded: self.letterDropped)
                            }
                }

Это очень хорошо настраивает экран. Однако в идеале я бы не хотел показывать кнопки "Пуск" и "Вычислить" до конца игры или действительно заменить кнопки "Сброс" и "Новая строка" на "Пуск" и "Вычислить".

Как это выглядит

В идеале то, что у меня было бы на потом в игре

Переход на это в последнюю очередь

Есть ли способ не показывать элементы в стопке или не добавлять элементы в стопку позже, пожалуйста?

Спасибо

Answer 1

Используйте логическую переменную @State, которая определяет, должны ли отображаться кнопки или нет, при изменении их значения вид будет обновлен.

@State var isResetVisible = true
...
if isResetVisible {
    ResetButton {
        self.returnLetters()
    }
}

тогда вы установите его в false где-нибудь, и он скроет

Answer 2

Вот шаблон, введите соответствующую переменную @State с желаемым значением начального состояния. Состояние можно изменить позже в любое время где-нибудь в поле зрения, и представление будет обновлено автоматически, показывая условно зависимую кнопку:

  @State private var newLineVisible = false // initially invisible
  ...
  var body: some View {
        ...
        HStack {

                ResetButton {
                    self.returnLetters()
                }
                if self.newLineVisible { // << include conditionally
                   NewLine {
                       self.newLine()
                   }
                }
                CalcButton {
                    self.calcButton()
                }