Lição: 83: Gestos no SwiftUI
Nesta aula, vamos explorar como trabalhar com gestos no SwiftUI. Gestos permitem que os usuários interajam com seu aplicativo de uma maneira mais natural e intuitiva. Com o SwiftUI, lidar com gestos é simples, e abordaremos alguns gestos comuns, como toque, pressão longa e arrasto.
Manipulação Básica de Gestos
No SwiftUI, gestos são tratados usando o modificador gesture
. Você pode anexar esse modificador a qualquer visual (view) para detectar diversos tipos de gestos. Vamos começar com um exemplo simples de gesto de toque.
Gesto de Toque
O TapGesture
é usado para detectar ações de toque em uma visualização. Aqui está um exemplo simples de um botão que muda de cor quando tocado:
import SwiftUI
struct ExemploGestoDeToque: View {
@State private var corDeFundo: Color = .blue
var body: some View {
Rectangle()
.fill(corDeFundo)
.frame(width: 200, height: 200)
.onTapGesture {
corDeFundo = corDeFundo == .blue ? .green : .blue
}
.animation(.easeInOut)
}
}
struct ExemploGestoDeToque_Previews: PreviewProvider {
static var previews: some View {
ExemploGestoDeToque()
}
}
Neste código, definimos uma visualização Rectangle
que muda sua cor de fundo quando tocada. O modificador onTapGesture
permite especificar a ação que deve ocorrer quando o retângulo é tocado.
Gesto de Pressão Longa
Em seguida, vamos olhar para um LongPressGesture
. Esse gesto é acionado quando o usuário pressiona e segura em uma visualização. Aqui está um exemplo:
import SwiftUI
struct ExemploGestoDePressaoLonga: View {
@State private var estaPressionado: Bool = false
var body: some View {
Circle()
.fill(estaPressionado ? Color.red : Color.gray)
.frame(width: 100, height: 100)
.onLongPressGesture {
estaPressionado.toggle()
}
.animation(.easeInOut)
}
}
struct ExemploGestoDePressaoLonga_Previews: PreviewProvider {
static var previews: some View {
ExemploGestoDePressaoLonga()
}
}
No ExemploGestoDePressaoLonga
, um Circle
muda sua cor quando uma pressão longa é detectada. A variável de estado estaPressionado
rastreia se o círculo deve ser vermelho ou cinza.
Gesto de Arrasto
Agora, vamos explorar um DragGesture
, que permite que os usuários arrastem uma visualização pela tela. Aqui está como fazer isso:
import SwiftUI
struct ExemploGestoDeArrasto: View {
@State private var deslocamento: CGSize = .zero
var body: some View {
Rectangle()
.fill(Color.blue)
.frame(width: 100, height: 100)
.offset(deslocamento)
.gesture(
DragGesture()
.onChanged { gesto in
deslocamento = gesto.translation
}
.onEnded { _ in
deslocamento = .zero // Redefine a posição quando o arrasto termina
}
)
}
}
struct ExemploGestoDeArrasto_Previews: PreviewProvider {
static var previews: some View {
ExemploGestoDeArrasto()
}
}
Neste exemplo, um Rectangle
pode ser arrastado pela tela. O fechamento onChanged
atualiza a propriedade deslocamento
com base no arrasto do usuário, enquanto onEnded
redefine a posição quando o arrasto termina.
Combinando Gestos
Você também pode combinar múltiplos gestos em uma única visualização usando o método simultaneamente(com:)
. Aqui está um exemplo que utiliza tanto os gestos de toque quanto de pressão longa:
import SwiftUI
struct ExemploGestosCombinados: View {
@State private var cor: Color = .blue
@State private var estaLongamentePressed: Bool = false
var body: some View {
Circle()
.fill(estaLongamentePressed ? Color.red : cor)
.frame(width: 100, height: 100)
.onTapGesture {
cor = cor == .blue ? .green : .blue
}
.onLongPressGesture {
estaLongamentePressed.toggle()
}
}
}
struct ExemploGestosCombinados_Previews: PreviewProvider {
static var previews: some View {
ExemploGestosCombinados()
}
}
Neste exemplo, temos um Circle
que muda de cor quando tocado e também muda para vermelho durante uma pressão longa. Ambos os gestos funcionam simultaneamente na mesma visualização.
Conclusão
Gestos no SwiftUI oferecem uma maneira interativa para os usuários se envolverem com seu aplicativo. Seja através de toques, pressões longas ou ações de arrasto, o sistema de gestos do SwiftUI torna simples implementar essas funcionalidades. Experimente diversos gestos para aprimorar a experiência do usuário em seu aplicativo!