В этом уроке:

- изучаем drawable теги: <level-list>, <transition>, <inset>, <clip>, <scale>

Продолжаем разбирать типы Drawable, которые можно описывать с помощью XML-разметки. Проектов в этом уроке создавать не будем. Я просто буду в своем проекте создавать XML-файлы в папке drawable и ставить их фоном для View. А в тексте урока приведу код и скрины. Иногда буду вешать дополнительно серый фон, чтобы был виден реальный размер View.

Чтобы программно добраться до Drawable, который вы для View повесили как фон, надо просто вызвать метод getBackground.

 

Level List

Тег <level-list> позволяет отображать Drawable в зависимости от значения level. Рассмотрим пример, где будем отображать три разных Drawable: если level=0, то  зеленый прямогуольник; если 1, то желтый; если 2, то красный. Создадим три Drawable

rect_red.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:shape="rectangle">
	<solid
		android:color="#ff0000">
	</solid>
</shape>

Красный прямоугольник

 

rect_yellow.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:shape="rectangle">
	<solid
		android:color="#ffff00">
	</solid>
</shape>

Желтый прямоугольник

 

rect_green.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:shape="rectangle">
	<solid
		android:color="#00ff00">
	</solid>
</shape>

Зеленый прямоугольник

 

levels.xml:

<?xml version="1.0" encoding="utf-8"?>
<level-list
	xmlns:android="http://schemas.android.com/apk/res/android">
	<item
		android:drawable="@drawable/rect_green"
		android:maxLevel="0">
	</item>
	<item
		android:drawable="@drawable/rect_yellow"
		android:maxLevel="1">
	</item>
	<item
		android:drawable="@drawable/rect_red"
		android:maxLevel="2">
	</item>
</level-list>

Level List, в котором мы указываем какой Drawable при каком максимальном уровне (maxLevel) отображать.

Менять уровень у Drawable мы можем методом setLevelСтавим 0 (по умолчанию)

Результат:

 

Ставим 1

 

Ставим 2

 

В соответствии с заданным уровнем отображается Drawable.

Кроме атрибута maxLevel можно также использовать атрибут minLevel для указания минимального значения.

Java-реализация – класс LevelListDrawable.

 

Transition Drawable

Тег <transition> позволяет указать два Drawable и программно переключаться между ними с fade-эффектом и указанием продолжительности перехода.

XML выглядит так:

<?xml version="1.0" encoding="utf-8"?>
<transition
	xmlns:android="http://schemas.android.com/apk/res/android">
	<item
		android:drawable="@drawable/rect_green">
	</item>
	<item
		android:drawable="@drawable/rect_yellow">
	</item>
</transition>

Также у item есть атрибуты left, top, right, bottom для задания отступа.

 

В коде, для переключения между Drawable используются методы startTransition и reverseTransition. Оба метода принимают на вход количество мсек, которое будет длиться переход.

Java-реализация – класс TransitionDrawable.

 

Inset Drawable

Насколько я понял – это просто обертка Drawable, которая позволяет указать padding-отступы. Корневой тег – <inset>, атрибуты отступа insetLeft, insetTop, insetRight, insetBottom.

Java-реализация – класс InsetDrawable

 

Clip Drawable

Тег <clip> позволяет обрезать Drawable по горизонтальной и (или) вертикальной оси. Какая часть картинки будет обрезана зависит от значения level. Используемый диапазон тут от 0 до 10000, где 0 - картинка полностью обрезана и не видна, 10000  - картинка видна полностью. Атрибут gravity позволяет указать направление урезания.

Рассмотрим несколько примеров.

Устанавливаем программно (методом setLevel) уровень в 7000. А XML рисуем такой:

<?xml version="1.0" encoding="utf-8"?>
<clip
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:clipOrientation="horizontal"
	android:drawable="@drawable/ic_launcher"
	android:gravity="left">
</clip>

Ось - горизонтальная, направление - влево. Т.е. картинка обрезается по горизонтали справа-налево до 70% (7000 от 10000).

 

 

Уровень установим в 2000, а xml делаем таким:

<?xml version="1.0" encoding="utf-8"?>
<clip
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:clipOrientation="vertical"
	android:drawable="@drawable/ic_launcher"
	android:gravity="top">
</clip>

Картинка обрезается по вертикали снизу вверх до 20%

 

Уровень 5000, xml:

<?xml version="1.0" encoding="utf-8"?>
<clip
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:clipOrientation="horizontal|vertical"
	android:drawable="@drawable/ic_launcher"
	android:gravity="right|bottom">
</clip>

Картинка обрезается по обоим осям вправо и вниз до 50%

 

 

Уровень 6000, xml:

<?xml version="1.0" encoding="utf-8"?>
<clip
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:clipOrientation="horizontal"
	android:drawable="@drawable/ic_launcher"
	android:gravity="center">
</clip>

Картинка обрезается по горизонтали к центру до 60%

 

Java-реализация – класс ClipDrawable

 

 

Scale Drawable

Тег <scale> позволяет сжать картинку по горизонтальной (scaleWidth) и (или) вертикальной (scaleHeight) оси и сместить полученное изображение в указанную часть (scaleGravity) доступного пространства.

У меня этот тип Drawable работал только, если установить ему level > 0.

 

Рассмотрим примеры

<?xml version="1.0" encoding="utf-8"?>
<scale
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:drawable="@drawable/ic_launcher"
	android:scaleGravity="left"
	android:scaleWidth="30%">
</scale>

Сжимаем на 30% по горизонтали и смещаем влево.

 

 

<?xml version="1.0" encoding="utf-8"?>
<scale
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:drawable="@drawable/ic_launcher"
	android:scaleGravity="bottom"
	android:scaleHeight="70%">
</scale>

Сжимаем на 70% по вертикали и смещаем вниз.

 

 

<?xml version="1.0" encoding="utf-8"?>
<scale
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:drawable="@drawable/ic_launcher"
	android:scaleGravity="bottom|right"
	android:scaleHeight="50%"
	android:scaleWidth="50%">
</scale>

Сжимаем на 50% по обоим сторонам и смещаем вправо-вниз.

 

 

<?xml version="1.0" encoding="utf-8"?>
<scale
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:drawable="@drawable/ic_launcher"
	android:scaleGravity="center"
	android:scaleHeight="60%"
	android:scaleWidth="40%">
</scale>

Сжимаем на 40% по ширине и 60% по высоте, и смещаем в центр

 

Java-реализация – класс ScaleDrawable

 

Animation drawable

Тег <animation-list> дает возможность устроить слайд-шоу из нескольких Drawable. Для этого надо указать все используемые Drawable и время отображения для каждого из них.

 

anim.xml:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true">
	<item android:drawable="@drawable/rect_green" android:duration="500"></item>
	<item android:drawable="@drawable/rect_red" android:duration="500"></item>
	<item android:drawable="@drawable/rect_yellow" android:duration="500"></item>
</animation-list>

Список Drawable с указанием времени отображения для каждого. Атрибут oneShot установленный в true говорит системе о том, что воспроизведение нужно только один раз. Если поставить false, то анимация будет циклично повторяться.

Чтобы запустить процесс анимации, необходимо получить Drawable, привести его к типу AnimationDrawable и вызвать метод start.

Java-реализация – класс AnimationDrawable.


Присоединяйтесь к нам в Telegram:

- в канале StartAndroid публикуются ссылки на новые статьи с сайта startandroid.ru и интересные материалы с хабра, medium.com и т.п.

- в чатах решаем возникающие вопросы и проблемы по различным темам: Android, Compose, Kotlin, RxJava, Dagger, Тестирование, Performance 

- ну и если просто хочется поговорить с коллегами по разработке, то есть чат Флудильня




Language

Автор сайта

Дмитрий Виноградов

Подробнее можно посмотреть или почитать.

Никакие другие люди не имеют к этому сайту никакого отношения и просто занимаются плагиатом.

Социальные сети

 

В канале я публикую ссылки на интересные и полезные статьи по Android

В чате можно обсудить вопросы и проблемы, возникающие при разработке



Группа ВКонтакте



Поддержка проекта

Яндекс
410011180491924

WebMoney
R248743991365
Z551306702056

Paypal