Mobile_2_1

1.

Рассматриваемые вопросы
Создание графического интерфейса
Понятие Layout
Основные элементы интерфейса
Структура класса Activity
Работа с графическим интерфейсом в классе
1

2.

Создание графического интерфейса
Для создания графического интерфейса необходимо
создать класс, описывающий экран, на основе класса
Activity или кого-нибудь из его потомков
Созданный класс должен быть обязательно
зарегистрирован в манифесте
В большинстве случаев для экрана делается описание в
layout
2

3.

Понятие Layout
Описание интерфейса делается в формате xml
Корневым тегом в файле должен быть один из
контейнерных классов, чаще всего это LinearLayout
В корневом элементе также необходимо прописать ссылку
на описание формата файла вида:
xmlns:android="http://schemas.android.com/apk/res/android"
Большинство остальных параметров в тегах должны иметь
префикс android:
3

4.

LinearLayout
LinearLayout позволяет расположить дочерние элементы в один
ряд, либо горизонтально, либо вертикально.
LinearLayout имеет параметр orientation, позволяющий выбрать
вертикальное или горизонтальное расположение элементов
android:orientation="vertical"
Во многих случаях все взаимное расположение элементов на
экране делается путем вложения друг в друга нескольких
LinearLayout
4

5.

LinearLayout
LinearLayout позволяет расположить дочерние элементы в один
ряд, либо горизонтально, либо вертикально.
LinearLayout имеет параметр orientation, позволяющий выбрать
вертикальное или горизонтальное расположение элементов
android:orientation="vertical"
Во многих случаях все взаимное расположение элементов на
экране делается путем вложения друг в друга нескольких
LinearLayout
5

6.

Понятие Layout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
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:textAppearance="?android:attr/textAppearanceMedium"
android:text="First Line"
android:id="@+id/textView"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Second Line"
android:id="@+id/textView2"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click Me"
android:id="@+id/button"/>
</LinearLayout>
6

7.

Понятие Layout
7

8.

Основные элементы интерфейса
8

9.

Основные элементы интерфейса
TextView является базовым классом для большинства элементов,
содержащих текст: кнопок, редакторов и т. д.
В чистом виде предназначено для отображения текста. Имеет
следующие свойства:
ellipsize ставит многоточие, если текст не помещается
gravity — выравнивание текста внутри элемента
hint — текст, если основной текст пустой
lines — сколько строк текста в элементе
textColor, textSize, textStyle свойства текста
android:orientation="vertical"
9

10.

Основные элементы интерфейса
EditText является базовым классом для текстовых редакторов и
т. д.
Имеет в основном те же параметры, что и TextView, но,
дополнительно имеет параметры для управления клавиатурой:
inputType — позволяет выбрать поведение клавиатуры и смаого
редактора : text — обычный текст, textEmailAddress — адрес
эл.почты, textUri — интернет адрес, number — число, phone —
телефон. textPassword – ввод пароля, textMultiline —
многострочный текст.
Данные значения можно объединять.
android:inputType="number|textPassword"
10

11.

Основные элементы интерфейса
Button является базовым классом для кнопок, включая
переключатели и т.д.
В чистом виде предназначено для кнопок с текстом или текстом и
иконкой. Имеет следующие свойства:
drawableLeft drawableRight drawableTop drawableBottom —
позволяют задать идентификатор иконки и заодно указать ее
расположение.
Если необходимо создать кнопку только с иконкой, необходимо
использовать класс ImageButton
У него идентификатор иконки задается свойством src
11

12.

Основные элементы интерфейса
От Button наследуются ряд других классов:
CheckBox — простой переключатель
ToggleButton – кнопка, которая выглядит как обычная, но
работает как переключатель, т. е. залипает при нажатии.
RadioButton — элементы из которых составляется группа
переключателей с возможностью одиночного выбора.
Отдельно следует упомянуть элемент WebView, предназначенный
для отображения веб-страниц. Движок в большинстве версий
основан на движке Chrome.
В этот элемент можно загружать страницы из интернет, из
ресурсов и из файловой системы устройства.
12

13.

Структура класса Activity
От Button наследуются ряд других классов:
CheckBox — простой переключатель
ToggleButton – кнопка, которая выглядит как обычная, но
работает как переключатель, т. е. залипает при нажатии.
RadioButton — элементы из которых составляется группа
переключателей с возможностью одиночного выбора.
Отдельно следует упомянуть элемент WebView, предназначенный
для отображения веб-страниц. Движок в большинстве версий
основан на движке Chrome.
В этот элемент можно загружать страницы из интернет, из
ресурсов и из файловой системы устройства.
13

14.

Жизненный цикл
14

15.

Класс Activity
package com.example.firstapplication;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
15

16.

Структура класса Activity
В классе Activity практически всегда переопределяется метод
onCreate, который вызывается всегда, когда экран создается.
Именно в нем необходимо выполнять все начальные настройки.
В частности именно здесь загружается интерфейс из ресурса.
setContentView(R.layout.activity_main);
Если следует сохранять данные при закрытии приложения, это
следует делать с помощью переопределения метода onPause
Остальные методы, связанные с прекращением работы Activity,
такие как onDestroy, переопределять не имеет смысла, т. к. они в
большинстве случаев не вызываются.
16

17.

Работа с графическим интерфейсом в
классе
Чтобы работать с элементами интерфейса в классе, нужно
сначала получить доступ к объектам.
TextView tv = (TextView)findViewByID(R.id.textView2);
Получив объект элемента, им можно управлять вызывая методы.
Например,
tv.setText("New Text!!!!!!!!!");
Данный метод позволяет изменить текст у любого текстового
элемента, включая кнопки.
Также имеется метод getText(), позволяющий получить текст.
17

18.

Работа с графическим интерфейсом в
классе
Чтобы обрабатывать события, в частности нажатия кнопок,
можно создавать анонимные классы на основе OnClickListener, и
привязывать их с помощью setOnClickListener
Button btn = (Button)findViewById(R.id.button);
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
TextView tv = (TextView)findViewById(R.id.textView2);
tv.setText("Button is clicked!!!!!!");
}
});
18