ios – SwiftUI Menu change items text size


The “Menu” component and its subcomponents are rendered using the default style provided by the system, which may not be overridden. I suggest you create a custom MenuView, for example:

struct CustomMenu: View {
    let items: [String]
    let onSelect: (String) -> Void
    @Binding var isExpanded: Bool

    var body: some View {
        VStack(alignment: .leading, spacing: 10) {
            ForEach(items, id: \.self) { item in
                Button(action: {
                    self.onSelect(item)
                    self.isExpanded.toggle()
                }) {
                    Text(item)
                        .font(.system(size: 60)) // Set your custom font size here
                        .foregroundColor(.black)
                }
            }
        }
        .padding()
        .background(Color.white)
        .cornerRadius(5)
        .shadow(radius: 5)
        .frame(maxWidth: .infinity, alignment: .leading)
    }
}

And you can use it like this:

struct Sample: View {
    @State private var selectedIndex: Int = 0
    @State private var isMenuExpanded: Bool = false
    private var inputs = ["1", "2", "3", "4", "5"]

    var body: some View {
        VStack {
            Button(action: {
                self.isMenuExpanded.toggle()
            }) {
                HStack {
                    Text("Select Option")
                        .font(.system(size: 20))
                    Image(systemName: "arrow.down")
                        .rotationEffect(.degrees(isMenuExpanded ? 180 : 0))
                }
            }

            if isMenuExpanded {
                CustomMenu(items: inputs, onSelect: { selectedItem in
                    if let index = inputs.firstIndex(of: selectedItem) {
                        selectedIndex = index
                    }
                }, isExpanded: $isMenuExpanded)
            }

            Spacer()
            Text("Selected: \(inputs[selectedIndex])")
                .font(.system(size: 30))
        }
        .padding().frame(width: 500, height: 500)
    }
}

Latest articles

spot_imgspot_img

Related articles

Leave a reply

Please enter your comment!
Please enter your name here

spot_imgspot_img