The Chromium Chronicle رقم 33: طرق عرض AnimationBuilder

يمكن أن يؤدي استخدام الرسوم المتحركة المستندة إلى الطبقات في طرق العرض إلى تحسين الأداء وتقليل رديئة، غير أنها صعبة الإعداد إلى حد ما. تشير رسالة الأشكال البيانية AnimationBuilder يمكن أن تقلل الفئات بشكل كبير من التعقيد وتحسين إمكانية قراءة الطبقة والرسوم المتحركة.

لنفترض أنك احتجت إلى تحريك تلاشٍ متقاطع متواصل بين الاثنين التاليين كطرق العرض، مثل الصورة التالية.

إليك مثال على كيفية تنفيذ ذلك باستخدام واجهات برمجة تطبيقات الرسوم المتحركة للطبقات مباشرةً.

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());

يوضح ما يلي كيفية إنشاء التأثير نفسه باستخدام AnimationBuilder. تبدأ الرسوم المتحركة عند الخروج من النطاق.

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);

ما الرمز الذي تفضل كتابته أو قراءته؟ والأهم من ذلك، AnimationBuilder لا تضيف أي أعباء إضافية إلى الرسوم المتحركة لأنها تهدف إلى تبسيط إنشاء الرسوم المتحركة القائمة على الطبقات. جربها في المرة القادمة التي تحتاج فيها وتحريك شيء ما.

للحصول على مزيد من المساعدة، يمكنك إرسال رسالة إلكترونية [e-mail].

• مستندات AnimationBuilder
• التعرّف على واجهة مستخدم Chromium