36
Как создавать анимации для Android ...и делать это просто Данил Перевалов Android разработчик в компании LiveTyping

2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

  • Upload
    -

  • View
    123

  • Download
    2

Embed Size (px)

Citation preview

Page 1: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Как создавать анимациидля Android...и делать это просто

Данил ПереваловAndroid разработчик

в компании LiveTyping

Page 2: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

LayoutTransition Honeycomb

android:animateLayoutChanges="true"

Page 3: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид
Page 4: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Хочу свою анимацию… Можно!

Page 5: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Флаги

● APPEARING — указывает анимацию для тех объектов, которые появляются.● DISAPPEARING — указывает анимацию для тех объектов, которые удаляются.● CHANGE_APPEARING — указывает анимацию для тех элементов, которые

меняются из-за нового элемента.● CHANGE_DISAPPEARING — указывает анимацию для тех элементов, которые

меняются из-за удаленного элемента.● CHANGING - чуть попозже расскажу...

Page 6: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Свой аниматор

LayoutTransition layoutTransition = new LayoutTransition();linearLayout.setLayoutTransition(layoutTransition);layoutTransition.setAnimator(LayoutTransition.DISAPPEARING, ObjectAnimator.ofFloat(view, View.TRANSLATION_X, 0f, width));layoutTransition.setAnimator(LayoutTransition.APPEARING, ObjectAnimator.ofFloat(view, View.TRANSLATION_X, width,0f));

Page 7: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид
Page 8: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

LayoutTransition JB (API 16)появилась возможность анимировать изменения

Page 9: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Как же именно?LayoutTransition layoutTransition = new LayoutTransition();linearLayout.setLayoutTransition (layoutTransition);if (Build.VERSION.SDK_INT >= Build.VERSION_CODES. JELLY_BEAN) { layoutTransition.enableTransitionType(LayoutTransition. CHANGING);}//на кликLinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) view.getLayoutParams();layoutParams.height = isBig ? normSize : bigSize;view.setLayoutParams(layoutParams);isBig = !isBig;

Page 10: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид
Page 11: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Минусы:● не очень гибок;● нет полного контроля;● нельзя прервать;● для AnimatorSet нужно

выставить точное времяИ как следствие...

Page 12: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

TransitionFrameworkПоявился в Kitkat (4.4)

Page 13: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Изменение объектаTransitionManager. beginDelayedTransition(root, transition);

FrameLayout.LayoutParams layoutParams = (FrameLayout.LayoutParams) view.getLayoutParams();

layoutParams.height = isBig ? normSize : bigSize;

layoutParams.width = isBig ? normSize : bigSize;

view.setLayoutParams(layoutParams);

Page 14: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид
Page 15: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Основные Transition

● СhangeBounds. Это Transition, который отвечает за изменение координат View внутри layout и его размеров;

● Fade. Известные анимации fade in и fade out;

● AutoTransition. Является свзякой FadeIn,ChangeBound, FadeOut

Page 16: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

А можно всех посмотреть?

Page 17: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

SlideНовый Transition, который является наследником Visibility, как и Fade. C помощью него появляющаяся в сцене View может «прибегать» из выбранного края. Пример с new Slide(Gravity.LEFT)):

Page 18: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

TransitionParagonОписывает задержку начала анимации. Например, при установке CircularPropagation чем View ближе к установленному эпицентру, тем раньше она начинает анимироваться. Задается для Transition через параметр setPropagation.

Пример удаления всех View из FrameLayout с Explode Transition и установленным CircularPropagation (эпицентром ставится точка тапа на экран):

Page 19: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

ExplodeВо многом похож на Slide, но View будет выбегать или из некоторого направления, который задается с помощью так называемого эпицентра Transition/

Page 20: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

ChangeImageTransform

Transition, который анимирует матричный переход изображения внутри ImageView. С помощью него можно плавно изменять размеры и scaleType изображений. Разберем на примере. Барышню слева мы подвергли операциям ChangeBounds и ChangeImageTransform, тогда как девушке справа достался только ChangeBounds. Невооруженным взглядом заметно, как правая «дергается» в начале анимации.

Page 21: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

ChangeClipBounds

Transition, который как бы расширяет границы изображения

Page 22: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Интерполяторы

Page 23: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид
Page 24: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

С интерполяторомTransition transition = new ChangeBounds();

transition.setInterpolator( new BounceInterpolator());

TransitionManager. beginDelayedTransition(root, transition);

FrameLayout.LayoutParams layoutParams = (FrameLayout.LayoutParams) view.getLayoutParams();

layoutParams.height = isBig ? normSize : bigSize;

layoutParams.width = isBig ? normSize : bigSize;

view.setLayoutParams(layoutParams);

Page 25: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Bounce

Page 26: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Overshoot

Page 27: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Cycle

Page 28: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Еще какой-то

Page 29: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Что я считаю крутым!

Page 36: 2016 06-11 Данил Перевалов. Создание простых анимаций на андроид

Все!!!!!!!!!