Создать две линии кнопок

Question

Всем привет. Начинаю делать первые шаги в Swift (SwiftUI) и вот первый проект. Хочу создать таблицу умножения и пытаюсь создать снизу кнопки от 1 до 12, а вверху будет отображаться сама таблица по нажатой кнопке. Не могу добиться правильного вывода кнопок, что бы они нумеровались по порядку и при нажатии выводилась соответствующая таблица. Вот как я пытался вывести:

ForEach (0 ..< numberOfRows) { row in
    HStack(spacing: 2) {
        ForEach (0 ..< numberOfColumns) { column in
            Button(action: {
                numberOfTable = row + column
                creatMultiplicationTable()
            }) {
                Text("\(row + column + 1)")
            }
            .buttonStyle(BorderlessButtonStyle())
            .frame(width: 50, height: 50)
            .background((row + column) == numberOfTable ? Color.red : Color.blue)
            .foregroundColor(.white)
            .cornerRadius(10.0)
        }
    }
}

Получается следующее:

Answer 1

Лучше переосмыслить подход с 2 линий кнопок на:

Есть максимальное число для таблицы умножения, сейчас это 12. И расположить их нужно в 2 ряда, значит, по 6 элементов в ряду:

@State var maxNumber = 12
@State var elementsPerRow = 6

func getButtons() -> some View {
    // Формируем Range на количество рядов:
    ForEach(0..<((maxNumber - 1) / elementsPerRow + 1), id: \.self) { row in
        HStack {
            // Формируем Range на количество столбцов 
            // для первого рядка c 6 * 0 до 6 * 1 не включая, т.е [0,6)
            // для второго [6,12):
            ForEach(elementsPerRow * row..<min(maxNumber, elementsPerRow * (row + 1)), id: \.self) { column in
                getButton(column: column) // Это Ваша кнопка отделённая.
            }
        }
    }
}

И тогда Вам будет все-равно, это 2 ряда по 6 кнопок:

Или 3 по 7, или что захочется:

БЛОГ НА HUSL

Создать две линии кнопок

Ответы (1 шт):