Как мы можем иметь высоту разделителя, равную другому дочернему элементу горизонтального стека в виджетах SWIFT UI

#ios #swiftui #ios14

#iOS #swiftui #ios14

Вопрос:

Как и на прикрепленном экране, разделитель должен иметь одинаковую высоту Labe; «Одно касание и цена». Здесь одно касание и ценник — это один вертикальный стек, а это горизонтальный стек для разделителя.

введите описание изображения здесь

Комментарии:

1. Какой код вы пробовали до сих пор?

2. Разделитель() .background(Color(#colorLiteral(красный: 1, зеленый: 0,4352941176, синий: 0,3803921569, альфа: 1))) .padding(.leading, 16.0) .frame(минимальная ширина: 4, Идеальная ширина: 4, Максимальная ширина: 4, минимальная высота: 40, Идеальная высота: 40,maxHeight: .infinity, выравнивание: .center)

Ответ №1:

Вот возможный подход — использовать наложение, которое дает ту же высоту, что и родительский вид.

Протестировано с Xcode 12 / iOS 14

ДЕМОНСТРАЦИЯ

 var body: some View {
    HStack {
        VStack(alignment: .leading) {
            Text("Some long label text having word wrapping").font(.headline)
            Text("Some short")
        }.padding(.leading)
    }
    .overlay(
        Rectangle().fill(Color.red).frame(width: 4), // << your divider here !!
        alignment: .leading
    )
    .frame(width: 300) // just for wrap demo
}