English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Что такое Drawable
Сначала Drawable является абстрактным классом, представляющим изображения, которые можно рисовать на Canvas, часто используемые в качестве фона для view, с различными реализующими классами, выполняющими различные функции. Во-вторых, Drawable можно大致 разделить на следующие категории: изображения, состоящие из цветов. Обычно они определяются с помощью xml.
Инherits system Drawable
Реализующие классы и метки Drawable
Drawable
Получение внутренних размеров
getIntrinsicHeight, getIntrinsicWidth
- Когда Drawable состоит из изображения, метод возвращает ширину и высоту изображения
- Когда Drawable состоит из цвета, концепция ширины и высоты отсутствует, возвращается -1
Различные Drawable и их использование
BitmapDrawable
Используется для отображения изображения, например, в следующем примере
<?xml version="1.0" encoding="utf-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:antialias="true" android:dither="true" android:filter="true" android:gravity="top" android:src="@mipmap/girl" android:tileMode="repeat" />
Обычные свойства
android:antialias включить消除锯齿
android:dither включить подавление вибрации
android:filter включить эффект фильтрации
android:gravity используется для позиционирования изображения
android:src идентификатор изображения
android:tileMode режим повторения, три варианта: repeat, mirror, clamp
ColorDrawable
Это代表了单色可绘制区域，которая упаковывает фиксированный цвет и рисует на канвасе блок однотонного цвета
Пример:
<?xml version="1.0" encoding="utf-8"?> <color xmlns:android="http://schemas.android.com/apk/res/android" android:color="@color/colorAccent"> </color>
Ещё можно создавать с помощью кода
ColorDrawable drawable = new ColorDrawable(int color); //传入一个color的integer值
NinePatchDrawable
Это 9-пятнистое изображение, которое можно свободно масштабировать высоту и ширину без искажения
Пример:
<?xml version="1.0" encoding="utf-8"?> <nine-patch xmlns:android="http://schemas.android.com/apk/res/android" android:dither="true" android:filter="true" android:src="@color/colorAccent"> </nine-patch>
Установите область масштабирования с помощью draw9patch
Направления 1 и 2 на рисунке показывают, где рисуются чёрные линии в draw9patch, пересечение длины которых является областью, которую можно растянуть
Длина пересечения чёрной линии в направлениях 3 и 4 на рисунке показывает область, которую можно заполнить
ShapeDrawable
Конструкция фигур через цвет, как монохромные, так и с эффектом градиента. Возможные фигуры: прямоугольник,椭圆, кольцо, линия
Пример круга с градиентом:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <gradient android:angle="45" android:centerColor="@color/colorAccent" android:centerX="50%" android:centerY="50%" android:endColor="@color/colorPrimary" android:gradientRadius="150dp" android:startColor="@color/colorPrimaryDark" android:type="sweep" /> <size android:width="260dp" android:height="260dp" /> </shape>
Внимание: 1, значение Android:angle должно быть кратным 45 2, oval используется для рисования эллипса, когда ширина и высота size равны, рисуется круг
Пример кольца:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:innerRadius="100dp" android:shape="ring" android:thickness="10dp" android:useLevel="false" > <stroke android:width="10dp" android:color="@color/colorAccent" /> </shape>
Примечание:
3, android:useLevel установлено в false, в противном случае не будет достигнут идеальный эффект
4, innerRadius внутренний радиус кольца, innerRadiusRation коэффициент внутреннего радиуса по отношению к ширине кольца, оба значения основаны на innerRadius
5, thickness ширина кольца, thicknessRatio коэффициент ширины этого кольца, основное значение thickness
Обычные свойства
- android:shape форма для рисования, rectangle, oval, ring, line
- <stroke> обводка формы, имеет следующие свойства
- android:width ширина обводки
- android:color цвет обводки
- android:dashGap ширина штриховки
- android:dashWidth интервал между отрезками для рисования штриховки (для рисования штриховки, последние два должны быть не равны 0)
-<solid> одноцветное заполнение, android:color определяет цвет shape
- <gradient> эффект градиента, не может использоваться вместе с solid, имеет следующие свойства
- android:angle угол градиента, должен быть кратным 45
- android:startColor цвет начала градиента
- android:centerColor цвет середины градиента
- android:endColor цвет окончания градиента
- android:centerX координата горизонтальной оси центра градиента
- android:centerY координата вертикальной оси центра градиента
- android:gradientRadius радиус градиента
- android:type тип градиента, linear (линейный), sweep (сканирование), radial (радиальный)
- <corners> указывает на углы прямоугольника (rectangle), не подходит для других shape, имеет следующие свойства
- android:topLeftRadius, android:topRightRadius, android:bottomLeftRadius, android:bottomRightRadius устанавливают углы для левого верхнего, правого верхнего, нижнего левého и нижнего правого углов
- android:radius устанавливает одинаковый угол для всех углов, имеет низкий приоритет и может быть перекрыт другими четырьмя свойствами
- <size> устанавливает размеры shape, соответствующие android:width и android:height
- По умолчанию shape не имеет размеров, getIntrinsicHeight и getIntrinsicWidth возвращают -1
- Размер можно установить через size, но в качестве фона view он все равно будет растягиваться или уменьшаться до размера view
- <padding> устанавливает отступы для空的 области view, содержащей shape
StateListDrawable
Может быть рассматривается как селектор состояния, который выбирает соответствующий item из drawable, в зависимости от состояния view
Пример:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@color/colorPrimaryDark" android:state_pressed="false"></item> <item android:drawable="@color/colorAccent" android:state_pressed="true"></item> </selector>
Обычные состояния
android:state_pressed когда view удерживается, состояние нажатия
android:state_checked когда view выбран, подходит для CheckBox
android:state_selected когда view выбран
android:state_enabled когда view находится в доступном состоянии
android:state_focused когда view получает фокус
LayerDeawable
Представляет собой набор drawable, организованных по уровням, подобно концепции слоев в Photoshop, где несколько drawable располагаются на различных слоях, создавая эффект наложения
Пример:
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@mipmap/night" /> <item android:drawable="@mipmap/photo6" android:gravity="center" /> </layer-list>
注意事项：
1. layer-list может содержать несколько item, каждый из которых представляет собой drawable, и добавленный в конце item будет перекрывать добавленный ранее item
2. по умолчанию, все drawable в layer-list масштабируются до размеров view, через android:gravity можно регулировать эффект масштабирования
3. можно установить смещение в верх, низ, лево и право, android:top, android:bottom, android:left, android:right
LevelListDrawable
Представляет собой набор drawable, каждый из которых имеет уровень (level). Настройка различных уровней позволяет переключаться между различными drawable с помощью LevelListDrawable. Диапазон уровней составляет от 0 до 10000, android:maxLevel устанавливает максимальный уровень, android:minLevel устанавливает минимальный уровень
Пример:
<?xml version="1.0" encoding="utf-8"?> <level-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@mipmap/photo0" android:maxLevel="20" android:minLevel="10" /> <item android:drawable="@mipmap/photo1" android:maxLevel="40" android:minLevel="30" /> </level-list>
Через установку уровня можно переключать различные Drawable, в коде
//Переключить Hintergrund ImageView на photo1, 35 в диапазоне 30-40 iv.setImageLevel(35); //Переключить 背景 ImageView на photo0, 15 в диапазоне 10-20 iv.setImageLevel(15);
TransitionDrawable
Подкласс LayerDeawable, используемый для реализации эффекта плавного перехода между двумя Drawable
Пример:
Определение xml-файла
<?xml version="1.0" encoding="utf-8"?> <transition xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@mipmap/night" /> <item android:drawable="@mipmap/photo6" /> </transition>
Установить src для ImageView, в java-коде
iv = (ImageView) findViewById(R.id.iv_transition); drawable = (TransitionDrawable) iv.getDrawable(); drawable.startTransition(1000); // Реализация эффекта плавного перехода drawable.reverseTransition(1000);
InsetDrawable
вставка другого Drawable, и можно сохранить определенное расстояние по всем сторонам
Пример:
<?xml version="1.0" encoding="utf-8"?> <inset xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@mipmap/photo6" android:inset="20dp"> </inset>
ScaleDrawable
В зависимости от уровня Drawable масштабируется до определенной пропорции, при level 0 объект не виден, при level 10000 эффект масштабирования отсутствует
Пример:
<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@mipmap/night" android:scaleGravity="center" android:scaleHeight="50%" android:scaleWidth="50%" />
Чтобы показать эффект, необходимо установить level больше 0
iv = (ImageView) findViewById(R.id.iv_scale); ScaleDrawable drawable= (ScaleDrawable) iv.getDrawable(); drawable.setLevel(1);
- android:scaleHeight="percentage", android:scaleWidth="percentage", установка масштабирования высоты и ширины в процентах от исходного значения (100%-percentage)
- Чем больше level, тем больше изображение отображается
ClipDrawable
В зависимости от вашего уровня (level) выполняется обрезка другого Drawable, направление обрезки определяется вместе с android:clipOrientation и android:gravity. Установка level для обрезки, размер level варьируется от 0 до 10000, при level 0 объект не отображается, при level 10000 объект полностью отображается
xml определение
<?xml version="1.0" encoding="utf-8"?> <clip xmlns:android="http://schemas.android.com/apk/res/android" android:clipOrientation="horizontal" android:drawable="@mipmap/night" android:gravity="right"></clip>
<ImageView android:id="@+id/iv_clip" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/drawable_clip" />
Обрезка через установку уровня
ImageView iv = (ImageView) findViewById(R.id.iv_clip); ClipDrawable drawable= (ClipDrawable) iv.getDrawable(); drawable.setLevel(5000); // чем больше уровень, тем меньше область обрезки
Свойства
android:clipOrientation, horizontal - горизонтальная обрезка, vertical - вертикальная обрезка
android:gravity, совместно с направлением обрезки
Создание Drawable
Создание кругового Drawable
package com.yu.drawablelearing;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.ColorFilter;
import android.graphics.Paint;
import android.graphics.PixelFormat;
import android.graphics.Shader;
import android.graphics.drawable.Drawable;
public class CircleDrawable extends Drawable{
private int radius;
private int mWidth;
private int mHeight;
private Paint mPaint;
@Override
public void draw(Canvas canvas) {
canvas.drawCircle(mWidth/2,mHeight/2,radius,mPaint);
}
public CircleDrawable(Bitmap bitmap) {
radius = Math.min(bitmap.getWidth(), bitmap.getHeight())/2;
mWidth = bitmap.getWidth();
mHeight = bitmap.getHeight();
BitmapShader bitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
mPaint = new Paint();
mPaint.setShader(bitmapShader);
mPaint.setAntiAlias(true);
}
@Override
public void setAlpha(int alpha) {
mPaint.setAlpha(alpha);
invalidateSelf();
}
@Override
public void setColorFilter(ColorFilter colorFilter) {
mPaint.setColorFilter(colorFilter);
invalidateSelf();
}
@Override
public int getOpacity() {
return PixelFormat.TRANSLUCENT;
}
@Override
public int getIntrinsicHeight() {
return mHeight;
}
@Override
public int getIntrinsicWidth() {
return mWidth;
}
}
Создание прямоугольника с закругленными углами
package com.yu.drawablelearing;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.ColorFilter;
import android.graphics.Paint;
import android.graphics.PixelFormat;
import android.graphics.RectF;
import android.graphics.Shader;
import android.graphics.drawable.Drawable;
/**
* Создано pecu 24 августа 2016 года.
*/
public class RoundRectangleDrawable extends Drawable {
private RectF rectF;
private Paint mPaint;
Bitmap mBitmap;
@Override
public void draw(Canvas canvas) {
canvas.drawRoundRect(rectF, mBitmap.getWidth()/6, mBitmap.getHeight()/6, mPaint);
}
public RoundRectangleDrawable(Bitmap bitmap) {
mBitmap = bitmap;
mPaint = new Paint();
BitmapShader bitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
mPaint.setAntiAlias(true);
mPaint.setShader(bitmapShader);
}
@Override
public void setAlpha(int alpha) {
mPaint.setAlpha(alpha);
invalidateSelf();
}
@Override
public void setColorFilter(ColorFilter colorFilter) {
mPaint.setColorFilter(colorFilter);
invalidateSelf();
}
@Override
public void setBounds(int left, int top, int right, int bottom) {
super.setBounds(left, top, right, bottom);
rectF = new RectF(left, top, right, bottom);
}
@Override
public int getOpacity() {
return PixelFormat.TRANSLUCENT;
}
@Override
public int getIntrinsicWidth() {
return mBitmap.getWidth();
}
@Override
public int getIntrinsicHeight() {
return mBitmap.getHeight();
}
}
Общий процесс создания пользовательского Drawable
1. Пользовательский класс Drawable наследуется от Drawable
2. Реализуйте методы getOpacity, setColorFilter, setAlpha и т.д.
3. В методе onDraw выполняется рисование
4. Если пользовательский Drawable имеет фиксированный размер,则需要 реализовать методы getIntrinsicWidth, getIntrinsicHeight
Это конец всего содержимого статьи, надеюсь, это поможет вам в изучении, также希望大家多多支持呐喊教程。
Заявление: данное содержимое предоставлено из Интернета, авторские права принадлежат соответствующему владельцу, содержимое предоставлено пользователями Интернета, сайт не обладает правами собственности, не undergone人工 editing обработка, и не нести ответственность за соответствующие юридические вопросы. Если вы обнаружите подозрительное содержимое, пожалуйста, отправьте письмо по адресу: notice#oldtoolbag.com (во время отправки письма, пожалуйста, замените # на @) для сообщения о нарушении и предоставьте соответствующие доказательства. Если после проверки обнаружится, что содержимое нарушает авторские права, сайт немедленно удалят涉嫌侵权的内容。