Стандартна крива на облекчаване на материалния дизайн
Проектирайте персонализирана CSS cubic-bezier() функция за синхронизиране чрез плъзгане на две контролни точки, прегледайте я на живо спрямо линейна препратка, след което копирайте готовата стойност.
Резултат
Тази страница отваря генератора с вече заредени x1=0.4, y1=0, x2=0.2, y2=1 — стандартната крива на облекчаване, публикувана в насоките за движение на Google за материален дизайн. Плъзнете или манипулирайте, или редактирайте заедно числата и кривата, визуализацията на живо и копируемата CSS актуализация.
Material Design нарича тази крива „стандартно облекчаване“ и я препоръчва за повечето преходи на екрана – елементи, които вече са видими и просто се движат, преоразмеряват или избледняват в рамките на същия екран. Формата му се ускорява бързо, след което леко се забавя на мястото си, което е причината толкова много приложения за Android и стилизирани за материали уеб интерфейси да споделят същото усещане за преход, без никой да забележи, че използват едни и същи четири числа.
Пуснете го направо във функцията за синхронизиране на прехода или функцията за синхронизиране на анимацията за съгласувано с материала усещане или го използвайте като отправна точка: Указанията на Материал също дефинират отделни криви на „забавяне“ и „ускоряване“ за елементи, влизащи или напускащи екрана, които тази единична стандартна крива не е предназначена да замени.