CODEWITHSUNDEEP
swiftui
user18365424
user18365424

Reputation:

How to control height and padding of GeometryReader

I have two Text Fields side-by-side. The first field should take up 25% of the width and the second field 75%. I also have a view modifier that adds 24px of horizontal padding.

Two issues

  1. The second Text Filed does not respect the Horizontal padding on the right side. How do I get it to respect the padding?

  2. The whole Geometry Reader is a square, its vertical size seams to match the horizontal. How do I get it to just conform to the height of the TextFields.

       GeometryReader { geometry in HStack(spacing: 20) {
   TextField("Country...", text: $country)
     .textFieldStyle(TextFieldDarkFull())
     .frame(
       width: geometry.size.width * 0.25
      )
   TextField("Phone...", text: $phone)
     .textFieldStyle(TextFieldDarkFull())
     .frame(
       width: geometry.size.width * 0.75
      )
 }
 }
 .modifier(HorizontalPadding24())

Upvotes: 0

Views: 2994

Answers (1)

Asperi
Asperi

Reputation: 257711

  1. remove second TextField frame limitation (ie. modifier width: geometry.size.width * 0.75). So you fix first text field and let second one consume all remaining space dynamically.

  2. it depends of your entire layout but you can try to fix vertical size of block, like

     GeometryReader { geometry in HStack(spacing: 20) {
        // content here
     }
     .fixedSize(horizontal: false, vertical: true)     // << here !!

Upvotes: 2

Related Questions