Как видно на скриншоте, высота кнопки не адаптируется к размеру текста, что делает ее некрасивой. Как можно увеличить высоту кнопок, чтобы не выглядело глупо. У меня вопрос, как увеличить высоту кнопок в swiftui. Я пытаюсь сделать так, чтобы экран названия моей игры был похож на майнкрафт.

    struct ContentView: View {
    var body: some View {
        GeometryReader { geometry in
            VStack (spacing: 8) {
                Text("[Name not disclosed]Craft").font(.system(size: geometry.size.width/8))
                Button(action: {

                }) {
                    Text("Singleplayer").font(.system(size: geometry.size.width/20))
                        .frame(minWidth: geometry.size.width/2)
                }
                Button(action: {

                }) {
                    Text("Multiplayer").font(.system(size: geometry.size.width/20))
                        .frame(minWidth: geometry.size.width/2)
                }
                HStack (spacing: 8) {
                    Button(action: {

                    }) {
                        Text("Options").font(.system(size: geometry.size.width/20))
                            .frame(minWidth: (geometry.size.width/4)-16)
                    }
                    Button(action: {
                        exit(EXIT_SUCCESS);
                    }) {
                        Text("Quit Game").font(.system(size: geometry.size.width/20))
                            .frame(minWidth: (geometry.size.width/4)-16)
                    }
                }
            }
        }
    }
}

Not nicely looking window

18
user12353468 11 Дек 2019 в 19:24
 – 
Dalija Prasnikar
11 Дек 2019 в 19:27
См. Ответ здесь о том, как создать собственный стиль кнопки: stackoverflow.com/questions/58419161/…
 – 
Victor Sanchez
11 Дек 2019 в 19:55

4 ответа

Вам просто нужно установить PlainButtonStyle и нарисовать его как хотите ...

Вот, например, одна из ваших кнопок:

Button(action: {

}) {
    Text("Singleplayer").font(.system(size: geometry.size.width/20))
        .padding()
        .background(RoundedRectangle(cornerRadius: 8).fill(Color.blue))
        .frame(minWidth: geometry.size.width/2)
}
.buttonStyle(PlainButtonStyle())

custom button

5
Asperi 11 Дек 2019 в 19:52

Вам нужно изменить высоту стопки

struct ContentView: View {

   @State private var arr = ["String"]

    var body: some View {

         GeometryReader { geometry in
                VStack (spacing: 8) {
                    Text("[Name not disclosed]Craft").font(.system(size: geometry.size.width/8))
                    Button(action: {

                    }) {
                        Text("Singleplayer").font(.system(size: geometry.size.width/20))
                            .frame(minWidth: geometry.size.width/2)
                    }
                    Button(action: {

                    }) {
                        Text("Multiplayer").font(.system(size: geometry.size.width/20))
                            .frame(minWidth: geometry.size.width/2)
                    }
                    HStack (spacing: 8) {
                        Button(action: {

                        }) {
                            Text("Options").font(.system(size: geometry.size.width/20))
                                .frame(minWidth: (geometry.size.width/4)-16)
                        }
                        Button(action: {
                            exit(EXIT_SUCCESS);
                        }) {
                            Text("Quit Game").font(.system(size: geometry.size.width/20))
                                .frame(minWidth: (geometry.size.width/4)-16)
                            }
                    } .frame(width: 100, height: 100, alignment: .leading) .background(Color.red)
                }
            }
    }
}
0
Sh_Khan 11 Дек 2019 в 19:32

Используйте более простой инициализатор, если вам нужен только заголовок для вашего Button:

Button("Click me") {
    // Perform action here
}
.frame(width: 100, height: 100)
.background(Color.yellow)

Preview

Обратите внимание, что модификатор frame должен стоять перед background, чтобы он выглядел больше. В противном случае вы не увидите разницы.

0
Mojtaba Hosseini 26 Янв 2020 в 23:05

Пожалуйста, попробуйте ниже Код:

Button(action: {
       //do action       
}) {
    Text("SIGN IN")
        .frame(width: 200 , height: 50, alignment: .center)
        //You need to change height & width as per your requirement
}
 .background(Color.blue)
 .foregroundColor(Color.white)
 .cornerRadius(5)

Выход введите описание изображения здесь

0
Rohit Makwana 17 Фев 2020 в 09:42