Северный (Арктический) федеральный университет им. М.В. Ломоносова
Опубликован: 10.04.2014 | Доступ: свободный | Студентов: 5395 / 511 | Длительность: 14:18:00
Специальности: Программист
Самостоятельная работа 3:

Основы разработки интерфейсов мобильных приложений

< Лекция 3 || Самостоятельная работа 3: 123456789 || Лекция 4 >

6.2.5 Область просмотра изображений

Теперь займемся созданием области отображения изображений, которые пользователь будет оценивать.

Добавьте "рамку" <FrameLayout> в <RelativeLayout>:

Добавление "рамки"

увеличить изображение
Рис. 6.32. Добавление "рамки"

Обратите внимание, что предупреждающий жёлтый треугольник исчез, но появился у нового элемента, и это значит, что всё идёт по плану.

Укажем этому элементу ширину, высоту и id. Предупреждение должно пропасть.

Свойства "рамки"

Рис. 6.33. Свойства "рамки"

Сейчас FrameLayout "заезжает" на поле ввода и кнопку. Чтобы исправить это, нужно задать для "рамки" параметр, который будет следить, чтобы "рамка" находилась ниже, чем поле ввода и кнопка.

Выберите из списка Outline "рамку" и кликом правой кнопки мыши вызовите контекстное меню: Other Properties -> Layout Parametrs -> Layout Below…

Контекстное меню "рамки"

увеличить изображение
Рис. 6.34. Контекстное меню "рамки"

Появится окно. В нём выбираем из списка "ID" имя лейаута, на котором находятся поле ввода и кнопка:

Выбор элемента, ниже которого должна быть "рамка"

Рис. 6.35. Выбор элемента, ниже которого должна быть "рамка"

Жмём ОК и "рамка" примет вид:

Новое расположение "рамки"

увеличить изображение
Рис. 6.36. Новое расположение "рамки"

Теперь для наглядности поместим туда изображение.

Сначала поместим само изображение в папку res/drawable/ и обновим её.

Это нужно для того, чтобы новые данные загрузились в проект.

Обновление папки

Рис. 6.37. Обновление папки

Теперь поместим внутрь "рамки" <ImageView>

Перемещение <ImageView>

Рис. 6.38. Перемещение <ImageView>

В появившемся окне выбираем нужное нам изображение и жмём OK

Выбор файла

Рис. 6.39. Выбор файла

Изображение должно появится на активности:

Визуализация изображения

Рис. 6.40. Визуализация изображения

Вместе с изображением появился новый предупреждающий знак.

В описании предупреждения сказано: "[Accessibility] Missing contentDescription attribute on image". Давайте разберёмся, что это означает.

Атрибут android:contentDescription используется в программах, которые поддерживают специальные возможности для людей с нарушениями зрения и слуха. То есть, текст, прописанный в этом атрибуте, не будет показан на экране, но при включенной в "Специальных возможностях" услуге "звуковые подсказки" этот текст будет проговариваться, когда пользователь переходит к этому элементу управления.

Этот атрибут можно задать для ImageButton, ImageView и CheckBox, и задавать его или нет - дело каждого.

Свойства у изображения должны быть следующими:

Свойства изображения

Рис. 6.41. Свойства изображения
< Лекция 3 || Самостоятельная работа 3: 123456789 || Лекция 4 >
Марат Нуриджанян
Марат Нуриджанян

Пример: Скачать среду можно с сайта для разработчиков Android (http://developer.android.com/sdk/index.html).

Там скачать можно только Android Studio

Владимир Каункин
Владимир Каункин

В самостоятельной работе 2 в примере решения задания некорректно загадывается число (в двух местах), выбирая случайное целое число из диапазона [0, 99] вместо [1, 100], как того требует условие. Кроме того, загадывание числа всё таки лучше вынести в отдельный метод, как мне кажется.
 

Gena Shushkevich
Gena Shushkevich
Россия
Асмик Гаряка
Асмик Гаряка
Армения, Ереван