SwiftUI Picker - # Stars based on ForEach iteration - swiftui

Question

I'm trying to implement a picker which represents a star rating however I'm struggling to implement this in that each row id displaying only 1 star. Here's the code I have so far...
Picker("Rating", selection: $rating) {
ForEach(1..<6, id: \.self) { rating in
HStack {
ForEach(1..<rating, id: \.self) { star in
Image(systemName: "star")
}
}
}
}
What I'm trying to achieve is a picker in which the first row will show 1 star, next row 2 stars, 3, 4 etc.
I'm convinced I'm butchering this code and there is most likely an easy solution but I have googled far and wide and yet I haven't stumbled across a solution. Any help would be greatly appreciated.

Answer 1

I have tried all things related to images but multiple images are not work in a single row so I have added star emoji as a string.
var body: some View {
Picker("Rating", selection: $ratingg) {
ForEach(1..<6, id: \.self) { rating in
Text(String(repeating: "✩", count: rating))
}
}
}

Answer 2

struct Picker: View {
#Binding var selection: Int
var body: some View {
VStack(alignment: .leading) {
ForEach(1..<6, id: \.self) { rating in
HStack {
ForEach(1..<(rating + 1), id: \.self) { star in
Image(systemName: "star")
}
}
.padding(.vertical, 4)
.onTapGesture {
selection = rating
print("rating now is", selection)
}
}
}
}
}