Как сгруппировать набор изображений определенным образом, используя текущий размер представления в SwiftUI ⇐ IOS

[Anonymous]

Я хочу добиться определенного дизайна с помощью 7 изображений. 7 изображений состоят из 5 квадратов (оригинал 800x800 пикселей) и 2 прямоугольников (оригинал 400x200 пикселей). Конечная цель должна выглядеть следующим образом:


Это должно быть 3 ряда картинок, 1-й ряд состоит из 3-х квадратов, где on занимает примерно треть ряда, 2-й ряд содержит прямоугольник и квадрат, а последний ряд состоит только из одного прямоугольника. . Проблема, с которой я столкнулся, заключается в том, что когда я добавляю представление к родительскому элементу, я получаю такой результат:
[img]https://i.sstatic .net/V0AY3ait.png[/img]

Чтобы добиться такого макета, я попытался использовать комбинацию VStacks и HStack и попытался рассчитать ширину изображений, используя примерно 1/3 ширины изображений. просмотр с GeometryReader.

Код: Выделить всё

import SwiftUI

struct OverviewTiles: View {
var body: some View {
// TODO: There will be different designs so be sure to look out for that
GeometryReader { geo in
let size = geo.size.width * 0.66
VStack(spacing: 16) {
HStack(spacing: 16) {
Image("tiles_square")
.resizable()
.scaledToFit()
.frame(width: size)
VStack(spacing: 16) {
Image("tiles_square")
.resizable()
.scaledToFit()
Image("tiles_square")
.resizable()
.scaledToFit()
}
}
HStack(spacing: 16) {
Image("tiles_landscape")
.resizable()
.scaledToFit()
.frame(width: size)
Image("tiles_square")
.resizable()
.scaledToFit()
}
Image("tiles_landscape")
.resizable()
.scaledToFit()
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
}

}
}

Экземпляр представления создается внутри ScrollView. Я относительно новичок в SwiftUI, и мне хотелось бы знать, правильный ли это подход. В конечном итоге мне нравится, чтобы этот элемент правильно реагировал на изменения ориентации, хотя, возможно, тогда следует изменить порядок изображений. Итак, правильно ли использовать GeometryReader или есть более эффективные способы добиться этого?
Большое спасибо за помощь.

Подробнее здесь: https://stackoverflow.com/questions/793 ... ew-size-in