Я хочу достичь конкретного дизайна с 7 картинками. 7 изображений состоят из 5 квадратов (оригинал 800x800px) и 2 прямоугольника (оригинал 400x200px). Конечная цель должна выглядеть как этот пример:
Это должно быть 3 ряда изображений, строка 1 состоит из 3 квадратов, где на трети ряда, в ряду 2 есть прямоугольник и квадрат, а последняя строка просто имеет один прямоугольник Полем Проблема, с которой я сталкиваюсь, заключается в том, что когда я добавляю представление к родителям, я получаю этот результат:
Чтобы достичь этого макета, я попытался использовать комбинацию Vstacks и Hstack и попытался вычислять ширину изображений, используя около 1/3 Просмотр с помощью GeometryReader. < /p>
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)
}
}
}
< /code>
Сам представление создается в Scrollview. Я относительно новичок в Swiftui, и я хотел бы знать, является ли это даже правильным подходом. В конечном счете, мне нравится, когда этот элемент отреагирует правильно на изменения ориентации, хотя, возможно, порядок изображений должен быть изменен тогда. Итак, использует ли GeometryReader правильным способом или есть лучшие способы достичь этого?
Большое спасибо, за помощь.
Подробнее здесь: https://stackoverflow.com/questions/793 ... ew-size-in
