Освой Android играючи
/* Моя кошка замечательно разбирается в программировании. Стоит мне объяснить проблему ей - и все становится ясно. */
John Robbins, Debugging Applications, Microsoft Press, 2000
В принципе этот приём рассматривался в примерах с виджетами и носит обобщающий характер. Мы можем создать собственный фон для различных элементов управления, таких как TextView, ImageButton, Button и др.
Создаём в папке res/drawable/ новый файл, например, custombackground.xml, в котором будем содержаться описание нужного нам фона.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"><shape>
<gradient android:angle="180" android:endColor="#FF00FF" android:startColor="#FF0000" />
<stroke android:width="3dp" android:color="@android:color/background_dark" />
<corners android:radius="3dp" />
<padding android:bottom="10dp" android:left="50dp" android:right="50dp" android:top="10dp" />
</shape></item>
<item android:state_focused="true"><shape>
<gradient android:angle="180" android:endColor="@android:color/background_dark" android:startColor="@android:color/background_light" />
<stroke android:width="3dp" android:color="@android:color/background_dark" />
<corners android:radius="3dp" />
<padding android:bottom="10dp" android:left="50dp" android:right="50dp" android:top="10dp" />
</shape></item>
<item><shape>
<gradient android:angle="180" android:endColor="@android:color/background_dark" android:startColor="@android:color/background_light" />
<stroke android:width="3dp" android:color="@android:color/background_dark" />
<corners android:radius="3dp" />
<padding android:bottom="10dp" android:left="50dp" android:right="50dp" android:top="10dp" />
</shape></item>
</selector>
Для демонстрации добавим в проект нужные виджеты и атрибуте android:background у каждого элемента пропишем наш созданный фон:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="@drawable/custombackground"
android:clickable="true"
android:text="Это TextView" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="@drawable/custombackground"
android:text="Это кнопка" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="@drawable/custombackground"
android:src="@drawable/ic_launcher" />
</LinearLayout>
Запускаем и смотрим на результат. Мы прописали различные градиенты в разных состояниях элемента: в обычном, в фокусе, при нажатии. На скриншоте видно, что при нажатии на первый элемент, фон у него меняется на другой.
Кроме общего атрибута android:background у видов существуют отдельные атрибуты android:drawableLeft/drawableTop/drawableRight/drawableBottom, позволяющие задать рисунок для отдельной части фона - слева, сверху, справа, снизу.
В качестве простейшей демонстрации будем использовать готовый значок приложения для фона.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="@drawable/ic_launcher"
android:text="Button with drawableLeft" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:drawableRight="@drawable/ic_launcher"
android:text="EditText with android:drawableRight" />
<CheckBox
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:drawableTop="@drawable/ic_launcher"
android:text="CheckBox with android:drawableTop" />
</LinearLayout>