Како створити Боунце Аниматион за Андроид

Овде у ХАСХТАГС , наши купци зависе од нас да бисмо им помогли да поуздано управљају својим садржајем на друштвеним мрежама. Купци компаније Спроут користе наше мобилне иОС и Андроид апликације како би могли да управљају својим друштвени медији у покрету . Када смо одлучили да ажурирамо нашу Андроид поруку Напиши искуство за подршку издаваштво више слика у прилогу Твеет-а, желели смо да учинимо корисницима јасним када је приложено више слика, чак и када нису видљиве на екрану Нова порука.

Решење за дизајн: Користите анимацију за означавање слика изван екрана

С обзиром на наш дизајн и ограничења мобилног екрана, било је могуће да приложене слике остану ван екрана. Иако ово није идеално, то је био неопходан уступак с обзиром на густину подржане функционалности на екрану Цомпосе. За случајеве када су слике заправо ван екрана, одлучили смо да применимо хоризонталну „одскочну“ анимацију која би указивала на то да је листа слика померљива.

Избор имплементације: ОбјецтАниматор + ЕасингИнтерполатор

Постоји много механизама за подршку основним анимацијама у Андроиду. Неки захтевају конфигурацију у коду, други у кмл. У одабиру алтернатива, одлучили смо да дамо приоритет повратној компатибилности (подржавамо сдк верзију 15+), једноставности примене и конфигурабилности. На крају смо одлучили да користимо комбинацију ОбјецтАниматор и ЕасингИнтерполатор . Обоје се могу конфигурисати у Јава коду, који је на крају погоднији за програмере: Синтакса је позната, а логика анимације може бити у потпуности дефинисана на једном месту у бази кода.

ОбјецтАниматор је класа коју пружа Андроид оквир која омогућава модификовање својства приказа. Будући да се кретање подразумеваног интерполатора за ОбјецтАниматор није осећало природно за наш случај употребе, одлучили смо да користимо ЕасингИнтерполатор, практичну библиотеку која пружа много различитих модела интерполације.

Боунце Аниматион Цоде

private void doBounceAnimation(View targetView) { ObjectAnimator animator = ObjectAnimator.ofFloat(targetView, 'translationX', 0, 25, 0); animator.setInterpolator(new EasingInterpolator(Ease.ELASTIC_IN_OUT)); animator.setStartDelay(500); animator.setDuration(1500); animator.start(); }

Срећом, код за поступање са овим понашањем је врло сажет. У 1. реду наводимо како желимо да анимирамо таргетВиев. У овом случају желимо да модификујемо својство „транслатионКс“ циљаВиев, а то је к-позиција приказа након изгледа. Желимо да анимирамо од помака од 0дп од почетне позиције до помака од 25дп удесно и на крају се вратимо на првобитни помак од 0дп.

У 2. реду наводимо врсту интерполације коју бисмо желели. Поиграли смо се са различитим моделима интерполације, али на крају смо одлучили да Еасе.ЕЛАСТИЦ_ИН_ОУТ изгледа најбоље за наш случај употребе.

За више информација о подршци анимације својства у Андроиду погледајте Проперти Аниматион програмер док .

Анимација у акцији

Заиста смо срећни због наших ажурирања мобилног искуства писања нових порука. Крећући се напред, планирамо да и даље обогаћујемо своје мобилно искуство помоћу одзивних визуелних интерфејса. Заинтересовани сте за рад на оваквим стварима са нама? доћи раде са нама на нашем Андроид мобилном тиму!

Подели Са Пријатељима: