#swift #swiftui #view #zstack #swiftui-view
#быстрый #свифтуи #Вид #zstack #swiftui-просмотр
Вопрос:
struct CircleTestView: View { let diameter: CGFloat = 433 var body: some View { ZStack { Color(.yellow) .ignoresSafeArea() VStack { Circle() .fill(Color(.green)) .frame(width: diameter, height: diameter) .padding(.top, -(diameter / 2)) Spacer() } VStack { Spacer() Button {} label: { Color(.red) .frame(height: 55) .padding([.leading, .trailing], 16) } } } } } Приведенный выше код создает первое изображение, но по какой-то причине, если я удалю строку, устанавливается рамка для Circle (т. Е. .frame(width: diameter, height: diameter) ) Я получаю второе изображение.
2. 
Мне нужен круг, как он есть на первом экране, и кнопка, как она есть на втором экране, но, похоже, этого не удается достичь. Каким-то образом установка рамки Circle влияет на другие представления, даже если они находятся в a ZStack . Это ошибка ZStacks или я неправильно понимаю , как они работают?
Комментарии:
1. Используйте считыватель геометрии, чтобы сделать ширину кнопки в процентах от вида
2. ZStack подходит для самого большого подвида. Сам круг не имеет размера, поэтому, когда вы удаляете явную рамку, он просто подходит к экрану. Ваша кнопка также не имеет ширины, потому что у нее нет цвета (аналогично кругу), поэтому она просто подстраивается под доступное пространство. Теперь вы должны увидеть, как это происходит, так что попробуйте еще раз.
Ответ №1:
Давайте назовем этот подход а:
struct CircleTestView: View { let diameter: CGFloat = 433 var body: some View { ZStack { Color(.yellow) .ignoresSafeArea() VStack { Circle() .fill(Color(.green)) .frame(width: diameter, height: diameter) .padding(.top, -(diameter / 2)) Spacer() } VStack { Spacer() Button {} label: { Color(.red) .frame(height: 55) } } .padding(.horizontal, 16) } } } Давайте назовем этот подход b:
struct CircleTestView: View { let diameter: CGFloat = 433 var body: some View { ZStack { Color(.yellow) .ignoresSafeArea() VStack { Circle() .fill(Color(.green)) .offset(x: 0, y: -(diameter / 1.00)) // increment/decrement the offset by .01 example: // .offset(x: 0, y: -(diameter / 1.06)) Spacer() } VStack { Spacer() Button {} label: { Color(.red) .frame(height: 55) .padding([.leading, .trailing], 16) } } } } } Комбинация этих двух подходов приведет вас к подходу c. Достигают ли какие-либо из них того, что вы ищете?