Compose withAnimation

В SwiftUI есть очень классная фича withAnimation, позволяющая сделать анимацию вьюшки просто путем изменения состояния, а сама анимация произойдет как по волшебству.

@State private var showDetail = false

var body: some View {
    VStack {
        Button("Show details") {
            withAnimation {
                showDetail.toggle()
            }
        }

        if showDetail {
            Text("Details")
        }
    }
}

Не справедливо, что такого механизма нет из коробки в Compose, и инженер из Google решил исправить это недоразумение. Он сделал свой аналог withAnimation и реализовал это с помощью Snapshot API, про который мы говорили ранее.

Как это работает?

1. Создается пустой словарь состояний для анимации
2. Выполняется лямбда блок внутри Snapshot, в этой лямбде могут происходить изменения стейта
3. У Snapshot вызывается writeObserver при каждой записи в State и заполняется информация для анимации
4. Данные мапятся в другой тип, откуда достаются измененные значения
5. Уничтожается Snapshot, чтобы не допустить утечек памяти, при этом изменения не применяются глобально! «Все что произошло в снапшоте, остается в снапшоте»©
6. Анимируются значения

internal suspend fun withAnimation(
    adapterRegistry: StateObjectAdapterRegistry,
    animationSpec: AnimationSpec<Any?>,
    block: () -> Unit
) {
    val statesToAnimate = mutableMapOf<Any, StateObjectAdapter>() // 1
    val snapshot = Snapshot.takeMutableSnapshot(
        writeObserver = { changedState ->
            statesToAnimate[changedState] = checkNotNull(adapterRegistry.getAdapterFor(changedState)) // 3
        }
    )
    val targetValues = snapshot.enter {
        block() // 2
        buildTargetValues(statesToAnimate) // 4
    }
    snapshot.dispose() // 5

    animateValues(targetValues, animationSpec) // 6
}

Если у вас есть еще идеи как можно применить снапшоты, делитесь своими мыслями в комментариях👇

#Compose #Snapshots #Animations