Instruções Gerais:

  • Resolva as atividades em ordem progressiva de maturidade.
  • Cada nível adiciona requisitos técnicos, tratamento de erros e casos de borda reais.
  • Consulte o gabarito comentado ao final de cada questão para autoavaliação.

🎯 Nível 1: Fundamentos

Problema 19.1 — Visibilidade Animada com AnimatedVisibility (fadeIn / fadeOut)

Contexto: Visibilidade Animada com AnimatedVisibility (fadeIn / fadeOut) no contexto de Animações Fluidas no Compose (animateAsState, AnimatedVisibility).

Requisitos de Execução:

  1. Exibir e ocultar elemento visual com animação suave de transição.

Resultado Esperado

Transição suave de entrada e saída com AnimatedVisibility.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_19_1_SeuNome
  2. Envie na tarefa: Atividade Cap 19 - Animações Fluidas no Compose (animateAsState, AnimatedVisibility)
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.animations

import androidx.compose.animation.*
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable

@Composable
fun PainelAnimado(visivel: Boolean) {
    AnimatedVisibility(
        visible = visivel,
        enter = fadeIn() + expandVertically(),
        exit = fadeOut() + shrinkVertically()
    ) {
        Text("Painel Corporativo com Transicao Fluida")
    }
}

🔍 Nível 2: Prática

Problema 19.2 — Animação de Valores Contínuos com animateFloatAsState

Contexto: Animação de Valores Contínuos com animateFloatAsState no contexto de Animações Fluidas no Compose (animateAsState, AnimatedVisibility).

Requisitos de Execução:

  1. Animar rotação de ícone ou escala de tamanho em resposta a interações de toque.

Resultado Esperado

Valor contínuo interpolado suavemente pela engine Compose.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_19_2_SeuNome
  2. Envie na tarefa: Atividade Cap 19 - Animações Fluidas no Compose (animateAsState, AnimatedVisibility)
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.animations

import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.animation.core.tween
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.material3.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.rotate

@Composable
fun IconeRotativo() {
    var expandido by remember { mutableStateOf(false) }
    val angulo by animateFloatAsState(
        targetValue = if (expandido) 180f else 0f,
        animationSpec = tween(durationMillis = 300),
        label = "rotacao"
    )

    Box(modifier = Modifier.rotate(angulo).clickable { expandido = !expandido }) {
        Text("🔽")
    }
}

⚡ Nível 3: Integração

Problema 19.3 — Transições Complexas com updateTransition e Crossfade

Contexto: Transições Complexas com updateTransition e Crossfade no contexto de Animações Fluidas no Compose (animateAsState, AnimatedVisibility).

Requisitos de Execução:

  1. Alternar entre telas ou estados de loading, sucesso e erro com efeito de crossfade.

Resultado Esperado

Alternância suave entre múltiplos estados visuais.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_19_3_SeuNome
  2. Envie na tarefa: Atividade Cap 19 - Animações Fluidas no Compose (animateAsState, AnimatedVisibility)
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.animations

import androidx.compose.animation.Crossfade
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable

enum class EstadoTela { CARREGANDO, SUCESSO, ERRO }

@Composable
fun TransicaoEstadoTela(estado: EstadoTela) {
    Crossfade(targetState = estado, label = "crossfade_tela") { target ->
        when (target) {
            EstadoTela.CARREGANDO -> CircularProgressIndicator()
            EstadoTela.SUCESSO -> Text("Dados carregados com sucesso!")
            EstadoTela.ERRO -> Text("Falha ao comunicar com o servidor.")
        }
    }
}

🏆 Nível 4: Desafio Corporativo

Problema 19.4 — Animações com Física de Mola (Spring Animations) e Gestos de Swipe

Contexto: Animações com Física de Mola (Spring Animations) e Gestos de Swipe no contexto de Animações Fluidas no Compose (animateAsState, AnimatedVisibility).

Requisitos de Execução:

  1. Configurar animação de arrastar com efeito de retorno elástico utilizando spring(dampingRatio = DampingRatioMediumBouncy).

Resultado Esperado

Física elástica de mola proporcionando alta fluidez tátil à UI.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_19_4_SeuNome
  2. Envie na tarefa: Atividade Cap 19 - Animações Fluidas no Compose (animateAsState, AnimatedVisibility)
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.animations

import androidx.compose.animation.core.Spring
import androidx.compose.animation.core.spring
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp

fun <T> especificacaoMola() = spring<T>(
    dampingRatio = Spring.DampingRatioMediumBouncy,
    stiffness = Spring.StiffnessLow
)

fun main() {
    println("Especificacao fisica de animacao configurada.")
}
⬅️ Voltar ao Índice de Exercícios 📚 Sumário de Tópicos