UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

line up numbers

Forums > SwiftUI

I am displaying a list of string with an associated number in a column. Depending on the length of the string, the position of the number changes. I would like the numbers to all line up (right aligned), with the strings left aligned. The numbers are all integers, so no need to worry about the decimal point. Not sure how to do this, anyone help please?

1      

There are many ways to do this, primarily depending on how you are creating and managing your lists of names and numbers.

Here is an example if you are using dictionaries.

struct ContentView: View {

    let myListInts = ["Gary": 10, "James": 25, "Alexander": 17]
    let myListNames = ["Gary", "Mary", "James", "Alexander", "Jane", "Bill"]

    var body: some View {

        List {
            ForEach (myListNames, id: \.self) { thisName in
                HStack {
                    Text("\(thisName.self)")
                    Spacer()
                    Text("\(myListInts[thisName] ?? 0)")
                }
            }
        }
    }
}

Could not see any difference in the example you gave above, other than Alexander. became Alexander

Do you have a clearer example of what you are after?

1      

when I typed in the example, the names were all on seperate lines with the bottom set showing the numbers all lining up, so I am unable to show exactly what I mean.

1      

is there a way of inserting a screenshot on here?

1      

You have to upload / host the screen shot elsewhere, then link to it from here.

Unfortunately you cannot just upload a screenshot on HWS.

1      

The code is something like this

struct ScoreColumn: View {
    @Binding var item: Score

    var body: some View {
        VStack(alignment: .trailing , spacing: 5) {
            HStack {
                Text("Birds")
                Spacer()
                TextField("Birds", value: $item.birds, format: .number)
            }

            HStack {
                Text("Bonus Cards")
                Spacer()
                TextField("Bonus Cards", value: $item.bonusCards, format: .number)
            }

            HStack {
                Text("End of Round")
                TextField("End of Round", value: $item.endOfRoundGoals, format: .number)
           }

        }
        .padding(5)
         .animation(nil, value: item)
        .background(Color(item.color.rawValue))
        .listRowInsets(EdgeInsets(top:5, leading: 10, bottom: 5, trailing: 10))
    }

}

1      

Hacking with Swift is sponsored by RevenueCat

SPONSORED Take the pain out of configuring and testing your paywalls. RevenueCat's Paywalls allow you to remotely configure your entire paywall view without any code changes or app updates.

Learn more here

Sponsor Hacking with Swift and reach the world's largest Swift community!

Archived topic

This topic has been closed due to inactivity, so you can't reply. Please create a new topic if you need to.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.