I try to create a menu with buttons containing primary and secondary labels like the photo bellow using SwiftUI, so I embed the button and the text (as secondary label) in the VStack, but it's doesn't work. How I can create this view in swiftUI?
The Code
Menu {
Section {
search
}
Section {
// The sort button
Menu {
Picker("Sorting options", selection: $sort) {
ForEach(SortType.allCases, id: \.self) { type in
Label("title", systemImage: "chevron.up")
.tag(type)
}
}
} label: {
// Here I should embed title and subtitle like the photo but I don't know how.
Label("Sort By", systemImage: "arrow.up.arrow.down")
}
}
} label: {
menuLabel
}
You can achieve this in SwiftUI by adding and extra Text
component next to your menu label. For example:
Menu("Sort") {
Menu {
Picker("Sort By", selection: $sortBy) {
ForEach(SortBy.allCases) { sortOption in
Text(sortOption.rawValue)
.tag(sortOption)
}
}
} label: {
Label("Sort By", systemImage: "arrow.up.arrow.down")
Text(sortBy.rawValue)
}
}