20.11.2024

Aula 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!

Video

Navigation