How to alternate centerX auto layout constraint in SwiftUI

Question

I want to adjust my view like this to make an element align horizontally center of its parent and lead another view to that.

I implement this view with auto layout simply like this.

consumeLabel.centerXAnchor.constraint(equalTo: parentView.centerXAnchor).isActive = true
unitLabel.leadingAnchor.constraint(equalTo: consumeLabel.trailingAnchor, constant: 5).isActive = true

But I couldn't find out how can I implement this by SwiftUI.

This is what I'm trying:

ZStack {
        Image("waterHomeHeader")
            .resizable()
            .scaledToFill()
            .edgesIgnoringSafeArea(.all)
        HStack {
            Text("1350 / 2917")
                .frame(alignment: .center)
                .foregroundColor(.white)
                .font(.title2)
            Text("ml")
                .foregroundColor(.white)
                .font(.footnote)
                .padding(.leading, 2)
        }
    }

SwiftUI centres everything by default... would you show your code of what are you trying to do? — Asperi, Nov 14 '20 at 15:34

score 1 · Accepted Answer · answered Nov 14 '20 at 15:58

1

Here is possible solution (tested with Xcode 12.1 / iOS 14.1)

    HStack {
        Spacer()
        Text("1350 / 2917")
            .frame(alignment: .center)
            .foregroundColor(.white)
            .font(.title2)
        Spacer().overlay(
            Text("ml")
                .foregroundColor(.white)
                .font(.footnote)
                .padding(.leading, 2), alignment: .leading)
    }

answered Nov 14 '20 at 15:58

Asperi

228,894
20
464
690

nice hack for using overlay! But I think the right and original Answer would be using alignmentGuide! – ios coder Nov 14 '20 at 16:40
Please share your answer that using alignmentGuide. – Mahdiyar Oraei Nov 14 '20 at 16:51
1

Check this https://stackoverflow.com/a/60711100/12299030 – Asperi Nov 14 '20 at 17:17
@Omid Cause I learning SwiftUI and it's good to see another showcase. – Mahdiyar Oraei Nov 14 '20 at 18:23

How to alternate centerX auto layout constraint in SwiftUI

1 Answers1