Chromium Chronicle #33: Views AnimationBuilder

Menggunakan animasi berbasis lapisan dalam View dapat meningkatkan performa dan mengurangi jankiness, tetapi animasi ini lebih sulit disiapkan. Class AnimationBuilder dapat sangat mengurangi kompleksitas dan meningkatkan keterbacaan untuk animasi lapisan.

Misalkan Anda perlu menganimasikan cross-fade berkelanjutan antara dua tampilan berikut, seperti pada gambar berikut.

Berikut adalah contoh cara melakukannya dengan menggunakan API animasi lapisan secara langsung.

auto primary_title_sequence = std::make_unique<LayerAnimationSequence>();
auto working_sequence = std::make_unique<LayerAnimationSequence>();
primary_title_sequence->set_is_repeating(true);
working_sequence->set_is_repeating(true);

primary_title_sequence->AddElement(CreatePauseElement(OPACITY, base::Seconds(2)));
primary_title_sequence->AddElement(CreateOpacityElement(0.0f, base::Seconds(1)));
primary_title_sequence->AddElement(CreatePauseElement(OPACITY, base::Seconds(2)));
primary_title_sequence->AddElement(CreateOpacityElement(1.0f, base::Seconds(1)));

working_sequence->AddElement(CreatePauseElement(OPACITY, base::Seconds(2)));
working_sequence->AddElement(CreateOpacityElement(1.0f, base::Seconds(1)));
working_sequence->AddElement(CreatePauseElement(OPACITY, base::Seconds(2)));
working_sequence->AddElement(CreateOpacityElement(0.0f, base::Seconds(1)));

primary_title_->layer()->GetAnimator()->StartAnimation(primary_title_sequence.release());
working_->layer()->GetAnimator()->StartAnimation(working_sequence.release());

Berikut ini cara membuat efek yang sama menggunakan AnimationBuilder. Animasi dimulai saat keluar dari cakupan.

AnimationBuilder()
    .Repeatedly()
    .Offset(base::Seconds(2))
    .SetDuration(base::Seconds(1))
    .SetOpacity(primary_title_, 0.0f)
    .SetOpacity(working_, 1.0f)
    .Offset(base::Seconds(2))
    .SetDuration(base::Seconds(1))
    .SetOpacity(primary_title_, 1.0f)
    .SetOpacity(working_, 0.0f);

Kode mana yang lebih Anda sukai? Yang lebih penting, AnimationBuilder tidak menambahkan overhead tambahan ke animasi karena dimaksudkan untuk menyederhanakan pembuatan animasi berbasis lapisan. Cobalah lain kali saat Anda perlu menganimasikan sesuatu.

Untuk mendapatkan bantuan tambahan, kirim email ke chromium-dev@chromium.org.