- Свифт Лаб
- 7 октября, 2019
Как использовать SwiftUI в Swift Playgrounds
С SwiftUI вы можете легко нарисовать границу вокруг кнопки или текста (и это на самом деле работает для всех видов), используя border модификатор. Скажем, например, вы хотите создать такую кнопку:
Мы можем применить border модификатор к объекту кнопки, чтобы создать кнопку с цветной рамкой:
Button(action: {
print("Hello button tapped!")
}) {
Text("Hello World")
.fontWeight(.bold)
.font(.title)
.foregroundColor(.purple)
.padding()
.border(Color.purple, width: 5)
}
Но что, если ваш дизайнер хочет, чтобы вы создали кнопку с закругленными краями? Как ты можешь это сделать?
Вы можете использовать border модификатор и передать его с радиусом угла:
.border(Color.purple, width: 5, cornerRadius: 20)
Чтобы создать рамку с закругленными углами, вы можете нарисовать прямоугольник с закругленными углами и наложение на кнопку следующим образом:
Button(action: {
print("Hello button tapped!")
}) {
Text("Hello World")
.fontWeight(.bold)
.font(.title)
.foregroundColor(.purple)
.padding()
.overlay(
RoundedRectangle(cornerRadius: 20)
.stroke(Color.purple, lineWidth: 5)
)
}
В коде мы используем a RoundedRectangle и его stroke модификатор для создания округленной границы. Вы можете изменить цвет и ширину линии, чтобы настроить ее внешний вид.
Чтобы создать кнопку с разными стилями, вы можете просто использовать другой объект формы, чтобы нарисовать границу. Скажем, вы можете заменить RoundedRectangleс , Capsule чтобы создать границу:
Указав свой собственный StrokeStyle, это позволит вам создать кнопку с рамкой тире:
Button(action: {
print("Hello button tapped!")
}) {
Text("Hello World")
.fontWeight(.bold)
.font(.title)
.foregroundColor(.purple)
.padding()
.overlay(
Capsule(style: .continuous)
.stroke(Color.purple, style: StrokeStyle(lineWidth: 5, dash: [10]))
)
}
Если вы хотите узнать больше о кнопках SwiftUI подписывайтесь на наши курсы по Swift.
👉Хочешь больше новостей из мира Swift и iOS разработки?
❤️ Лайк и подписка на @swiftlab приветствуются.