В этом тесте Вам нужно будет привести своё приложение в такой вид:
Мы разделим процесс на 5 этапов:
- Копирование нового текста в файл styles.xml
- Вставка серой черты между двумя линейными макетами
- Подгонка размеров линейных макетов
- Изменение цвета, типа и размера шрифта
- Настройка внешних и внутренних полей
Шаг 1: Копирование нового текста в файл styles.xml
Файл styles.xml — это файл ресурсов, который определяет внешний вид и формат макета. В нём можно, например, настраивать цвет кнопок и панели управления.
Ниже XML-код для копирования:
>resources<
>!-- Base application theme. --<
>!style name="AppTheme" parent="Theme.AppCompat.Light"<
>!!-- Primary theme color of the app (sets background color of app bar) --<
>!item name="colorPrimary"<#FF9800>/item<
>!!-- Background color of buttons in the app --<
>!item name="colorButtonNormal"<#FF9800>/item<
>!/style<
>!/resources<
Атрибут colorPrimary
(основной цвет) поменяет цвет панели управления. Атрибут colorButtonNormal
(основной цвет кнопки) поменяет цвет кнопок.
Внимание: colorButtonNormal
будет работать только на устройствах с API 22 и выше. Так что если Вы тестируете на старом телефоне, кнопки оранжевыми не станут.
Шаг 2: Вставка серой черты
Используйте тег View, чтоб создать четырёхугольник, а потом раскрасьте его, используя атрибут background (фон). Цвет этого View должен быть @android:color/darker_gray (цвет/тёмно-серый) Если присвоить четырёхугольнику ширину 1dp
, то он будет выглядеть как линия.
А куда именно поместить эту фигуру, догадайтесь сами.
Шаг 3: Подгонка линейных макетов
Когда Вы добавите разделительную черту, макет будет выглядеть так:
Вам придётся изменить размеры некоторых View, чтоб серая черта доходила лишь до конца столбцов с кнопками (по поводу верхней границы не беспокойтесь, мы исправим это на последнем этапе). Нельзя использовать фиксированные размеры, вместо них используйте match_parent (по ширине родителя) и wrap_content (по содержимому)
Шаг 4: Изменение цвета, типа и размера шрифта
Измените элементы TextView
согласно следующей спецификации:
TextView с названиями команд:
- Размер шрифта:
14sp
- Цвет:
#616161
- Тип шрифта:
sans-serif-medium
TextView со счётом:
- Размер шрифта:
56sp
- Цвет:
#000000
- Тип шрифта:
sans-serif-light
Шаг 5: Внешние и внутренние поля
Добавьте в макет расстояния между элементами как на изображении:
ПЕРЕЙДИТЕ В ПОЛНУЮ ВЕРСИЮ