How to remove space occupied by text's on swiftui

Question

NyakasBakas OP

Created Mar ’23

Replies 3

Boosts 0

Participants 2

How to remove space occupied by text's if the isEditMode bool false? Could u help me how to do this?

struct HomeView : View {
        @Binding var isDarkMode: Bool
        @State var isEditMode = false
        
        var body: some View {
            GeometryReader { proxy in
                &#x2F;&#x2F;ZStack() {
                    VStack(&#x2F;*spacing: 15*&#x2F;) {
                        TopBarView(isDarkMode: self.$isDarkMode, isEditMode: self.$isEditMode)&#x2F;&#x2F;.opacity(self.viewAppared ? 1 : 0)
                        
                        ScrollView(.vertical, showsIndicators: true)
                        {
                            VStack {
                                ClockView(isEditMode: self.$isEditMode)
                                Text("apple").opacity(self.isEditMode ? 0 : 1)
                                Text("apple").opacity(self.isEditMode ? 0 : 1)
                                Text("apple").opacity(self.isEditMode ? 0 : 1)
                            }
                        }
                        
                    }
                &#x2F;&#x2F;}
                &#x2F;&#x2F;Spacer()
            }
        }
    }

The texts are looks like this, in the bottom of the ClockView:

           Text("The alarm will ring at").opacity(isEditMode ? 1 : 0).padding(.bottom, 10)
            
            Text(TimeMH().ToString(minuteAngle, hourAngle))
                .opacity(isEditMode ? 1 : 0)
                .font(.system(size: 25))
                .background(Rectangle()
                    .fill(Color(UIColor.lightGray))
                    .frame(width: 90, height: 40)
                    .cornerRadius(10)
                    .shadow(radius: 5))
                    .opacity(isEditMode ? 1 : 0)

isEditMode: True

kép.PNG

isEditMode: False

kép2.PNG

Answered by NyakasBakas in 748779022

Is there a better solution? This is how I managed to solve the problem:

          Group {
                if isEditMode {
                    Text("The alarm will ring at")
                        .padding(.bottom, 10)
                    
                    Text(TimeMH().ToString(minuteAngle, hourAngle))
                        .font(.system(size: 25))
                        .background(Rectangle()
                            .fill(Color(UIColor.lightGray))
                            .frame(width: 90, height: 40)
                            .cornerRadius(10)
                            .shadow(radius: 5))
                } else {
                    EmptyView()
                }
            }

Boost

Answer 1

Claude31 OP

Mar ’23

We miss elements, especially ClockView, to test.

But you should try

VStack(spacing: 0) {  &#x2F;&#x2F; &lt;&lt;-- ADD spacing
     ClockView(isEditMode: self.$isEditMode)

In fact, space seems to correspond to Text where you show alarm value.

Please show more code.

0

Answer 2

NyakasBakas OP

Mar ’23

Accepted Answer

Is there a better solution? This is how I managed to solve the problem:

          Group {
                if isEditMode {
                    Text("The alarm will ring at")
                        .padding(.bottom, 10)
                    
                    Text(TimeMH().ToString(minuteAngle, hourAngle))
                        .font(.system(size: 25))
                        .background(Rectangle()
                            .fill(Color(UIColor.lightGray))
                            .frame(width: 90, height: 40)
                            .cornerRadius(10)
                            .shadow(radius: 5))
                } else {
                    EmptyView()
                }
            }

0

Answer 3

Claude31 OP

Mar ’23

You just set opacity: Text is there, but not visible !

           Text("The alarm will ring at").opacity(isEditMode ? 1 : 0).padding(.bottom, 10)

Effectively the new code should work.

You should not need EmptyView (remove else part).

0