Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Android Vector drawable

729 visualizaciones

Publicado el

Android Vector Drawable API presentation. Spoken during Rambler-Android meetup on 10th of September 2015.
Language - Russian

Publicado en: Software
  • Sé el primero en comentar

Android Vector drawable

  1. 1. Vector Drawable API возможности применения Олег Осипенко oleg.s.osipenko@gmail.com o.osipenko@rambler-co.ru
  2. 2. Vector Drawable API
 возможности применения Компьютерная графика • Bitmap • Векторные изображения
  3. 3. Vector Drawable API
 возможности применения Компьютерная графика • Bitmap • Векторные изображения Масштабирование 16х 16х
  4. 4. Vector Drawable API
 возможности применения Компьютерная графика • Bitmap • Векторные изображения • прямая зависимость размера файла от размера изображения
  5. 5. Vector Drawable API
 возможности применения Flat & Material Design • Windows Metro interface • iOS 7 • Material Design в Lollipop
  6. 6. Vector Drawable API
 возможности применения Flat & Material Design • отказ от скевоморфизма • четкие контуры,
 плоские заливки • упор на типографику
  7. 7. Vector Drawable API
 возможности применения Flat & Material Design • Bauhaus, швейцарская школа типографики
  8. 8. Vector Drawable API
 возможности применения Иконография Material Design
  9. 9. Vector Drawable API
 возможности применения Класс VectorDrawable структура <vector android:width="290dp" android:height="48dp" android:viewportWidth="290" android:viewportHeight="48" > </vector>
  10. 10. Vector Drawable API
 возможности применения Класс VectorDrawable структура <vector android:width="290dp" android:height="48dp" android:viewportWidth="290" android:viewportHeight="48" > </vector>
  11. 11. Vector Drawable API
 возможности применения Класс VectorDrawable viewport android:width="272dp" android:height="290dp" android:viewportWidth="272" android:viewportHeight="290"
  12. 12. Vector Drawable API
 возможности применения Класс VectorDrawable viewport android:width="272dp" android:height="290dp" android:viewportWidth="600" android:viewportHeight="600"
  13. 13. Vector Drawable API
 возможности применения Класс VectorDrawable viewport android:width="272dp" android:height="290dp" android:viewportWidth="100" android:viewportHeight="100"
  14. 14. Vector Drawable API
 возможности применения Класс VectorDrawable viewport • отсутствует возможность 
 указать PivotPoint • TopLeft by default
  15. 15. Vector Drawable API
 возможности применения Класс VectorDrawable структура <vector android:name android:tint android:tintMode android:autoMirrored android:alpha> <vector/>
  16. 16. Vector Drawable API
 возможности применения Элемент Path <path android:pathData="M141.4,188.2H51V329c0,15.4,16.4,15.5,16.4, 15.5l20.8,0v19.7h0c0,0.3,0,0.5,0,0.8c0,11,8.9,19.9,19.9,19.9c11, 0,19.9-8.9,19.9-19.9c0-0.3,0-0.5,0-0.8h0v-19.7l13.4,0l13.4,0v19.7h0c0, 0.3,0,0.5,0,0.8c0,11,8.9,19.9,19.9,19.9c11,0,19.9-8.9,19.9-19.9c0-0.3, 0-0.5,0-0.8h0v-19.7l20.8,0c0,0,16.4,0,16.4-15.5V188.2H141.4z"
  17. 17. Vector Drawable API
 возможности применения Элемент Path Path в Android и Path в SVG
  18. 18. Vector Drawable API
 возможности применения Элемент Path <path android:pathData android:fillColor, android:fillAlpha android:strokeColor, android:strokeWidth, android:strokeAlpha android:trimPathStart, android:trimPathEnd, android:trimPathOffset android:strokeLineCap, android:strokeLineJoin, android:strokeMiterLimit />
  19. 19. Vector Drawable API
 возможности применения Класс VectorDrawable Несколько объектов Path можно объединить в группу <group android:name android:rotation android:pivotX, pivotY android:scaleX, scaleY android:translateX, translateY> <group/>
  20. 20. Vector Drawable API
 возможности применения Класс AnimatedVectorDrawable <animated-vector android:drawable="@drawable/vector_drawable"> </animated-vector>
  21. 21. Vector Drawable API
 возможности применения Класс AnimatedVectorDrawable <animated-vector android:drawable="@drawable/vector_drawable"> <target android:name="head" android:animation="@anim/headAnimation" /> </animated-vector>
  22. 22. Vector Drawable API
 возможности применения Класс AnimatedVectorDrawable <animated-vector android:drawable="@drawable/vector_drawable"> <target android:name="head" android:animation="@anim/headAnimation" /> </animated-vector>
  23. 23. Vector Drawable API
 возможности применения Класс AnimatedVectorDrawable Target - любой атрибут Path или Group Поддерживается несколько target в одном AnimatedVectorDrawable <animated-vector android:drawable="@drawable/vector_drawable"> <target /> <target /> <target /> </animated-vector>
  24. 24. Vector Drawable API
 возможности применения Класс AnimatedVectorDrawable несколько target - 
 несколько анимаций
  25. 25. Vector Drawable API
 возможности применения Animation новый valueType <set> <objectAnimator android:duration="400" android:propertyName="pathData" android:valueType="pathType" /> </set>
  26. 26. Vector Drawable API
 возможности применения Animation атрибут PathData <set> <objectAnimator android:duration="400" android:propertyName="pathData" android:valueType="pathType" android:valueFrom="@string/pathFrom" android:valueTo="@string/pathTo" /> </set>
  27. 27. Vector Drawable API
 возможности применения Animation pathFrom и pathTo должны иметь одинаковое количество 
 и тип команд <set> <objectAnimator android:duration="400" android:propertyName="pathData" android:valueType="pathType" android:valueFrom="@string/pathFrom" android:valueTo="@string/pathTo" /> </set>
  28. 28. Vector Drawable API
 возможности применения Запуск анимации ((Animatable) imageView.getBackground()).start(); • отсутствует возможность настройки хореографии • отсутствует AnimationListener • возможный вариант Handler.postDelayed(Runnable r)
  29. 29. Vector Drawable API
 возможности применения Запуск анимации interface Animatable2 void registerAnimationCallback(AnimationCallback cb) class AnimationCallback void onAnimationStart() void onAnimationEnd()
  30. 30. Vector Drawable API
 возможности применения Обратная поддержка библиотека VectorCompat https://github.com/wnafee/vector-compat min SDK 14 • загрузка VectorDrawable либо AnimatedVectorDrawable ResourcesCompat.getDrawable(context, R.drawable.any_drawable); на устройствах с Lollipop - через native API build.tools >= 22.0.1
  31. 31. Vector Drawable API
 возможности применения Обратная поддержка дублирование атрибутов <vector android:width="290dp" android:height="48dp" android:viewportHeight="48" app:vc_viewportHeight="48" app:vc_viewportWidth="290" android:viewportWidth="290"> </vector>
  32. 32. Vector Drawable API
 возможности применения Обратная поддержка дублирование атрибутов <path android:name="btn_signin" android:fillColor="@color/btn_signin" app:vc_fillColor="@color/btn_signin" android:pathData="@string/btn_signin_from" app:vc_pathData="@string/btn_signin_from" />
  33. 33. Vector Drawable API
 возможности применения Обратная поддержка дублирование атрибутов <objectAnimator android:valueType="pathType" app:vc_valueType="pathType" />
  34. 34. Vector Drawable API
 возможности применения Обратная поддержка особенности запуска только в runtime AnimatedVectorDrawable avd = ResourcesCompat
 .getDrawable(context, R.drawable.any_drawable); imageView.setBackground(avd); ((Animatable) avd).start();
  35. 35. Vector Drawable API
 возможности применения
  36. 36. Vector Drawable API
 возможности применения VectAlign инструмент для выравнивания двух путей для создания pathAnimation https://github.com/bonnyfone/vectalign BetterVectorDrawable библиотека поддержки, API >= 14 https://github.com/a-student/BetterVectorDrawable
  37. 37. Vector Drawable API
 возможности применения Vector Asset Studio • создание XML файлов 
 Vector Drawable из SVG • Android Studio >= 1.4 • File > New > Vector Asset
  38. 38. Vector Drawable API
 возможности применения Вопросы?
  39. 39. Vector Drawable API
 возможности применения Спасибо за внимание!

×