Основы создания интерфейса

16.01.2025

Графический интерфейс пользователя (GUI) в Android представляет собой иерархию объектов android.view.View и android.view.ViewGroup. Каждый объект ViewGroup является контейнером, который организует дочерние объекты View. К контейнерам относятся такие элементы, как RelativeLayout, LinearLayout, GridLayout, ConstraintLayout и другие.

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

---

Иерархия визуальных компонентов

Большинство визуальных элементов, наследующихся от класса View, например кнопки или текстовые поля, находятся в пакете android.widget.

---

Три стратегии определения интерфейса

1. Создание элементов управления программно в коде Java.

2. Объявление элементов интерфейса в XML.

3. Комбинированный подход: базовые элементы разметки определяются в XML, а остальные добавляются во время выполнения.

Начнем с первой стратегии — создания интерфейса в коде Java.

---

Создание интерфейса в коде Java

Создадим новый проект в Android Studio. В качестве шаблона выберем Empty Views Activity.

Назовем проект ViewsApp.

После создания проекта основными файлами для работы с визуальным интерфейсом будут:

• MainActivity (Java-код активности).

• activity_main.xml (разметка активности).

  

---

Пример: простой интерфейс

Определим в классе MainActivity простейший интерфейс:

package com.example.viewapp;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // создание TextView
        TextView textView = new TextView(this);
        // установка текста в TextView
        textView.setText("Hello METANIT.COM!");
        // установка высоты текста
        textView.setTextSize(28);
        // установка визуального интерфейса для activity
        setContentView(textView);
    }
}

---

Разбор кода

1. Создание виджета:

   TextView textView = new TextView(this);

   Конструктор виджета принимает контекст — объект android.content.Context, которым обычно является текущий класс MainActivity.

2. Установка свойств:

   textView.setText("Hello METANIT.COM!");
   textView.setTextSize(28);

   Методы, начинающиеся с set, позволяют настроить свойства виджета. Например, setText() задает текст, а setTextSize() — размер шрифта.

3. Установка интерфейса:

   setContentView(textView);

   Метод setContentView() принимает объект View, который будет отображаться в интерфейсе.

   

---

Пример: более сложный интерфейс

Добавим TextView в контейнер ConstraintLayout:

package com.example.viewapp;

import androidx.appcompat.app.AppCompatActivity;
import androidx.constraintlayout.widget.ConstraintLayout;

import android.os.Bundle;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // создание ConstraintLayout
        ConstraintLayout constraintLayout = new ConstraintLayout(this);
        // создание TextView
        TextView textView = new TextView(this);
        textView.setText("Hello METANIT.COM!");
        textView.setTextSize(28);

        // параметры размещения TextView
        ConstraintLayout.LayoutParams layoutParams = new ConstraintLayout.LayoutParams(
                ConstraintLayout.LayoutParams.WRAP_CONTENT,
                ConstraintLayout.LayoutParams.WRAP_CONTENT
        );
        layoutParams.leftToLeft = ConstraintLayout.LayoutParams.PARENT_ID;
        layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;
        textView.setLayoutParams(layoutParams);

        // добавление TextView в ConstraintLayout
        constraintLayout.addView(textView);

        // установка ConstraintLayout в качестве интерфейса
        setContentView(constraintLayout);
    }
}

---

Объяснение кода

1. Создание LayoutParams:

   ConstraintLayout.LayoutParams layoutParams = new ConstraintLayout.LayoutParams(
       ConstraintLayout.LayoutParams.WRAP_CONTENT,
       ConstraintLayout.LayoutParams.WRAP_CONTENT
   );

   Устанавливается ширина и высота элемента. Константа WRAP_CONTENT означает, что размеры виджета зависят от его содержимого.

2. Выравнивание элемента:

   layoutParams.leftToLeft = ConstraintLayout.LayoutParams.PARENT_ID;
   layoutParams.topToTop = ConstraintLayout.LayoutParams.PARENT_ID;

   Позиционирование относительно границ контейнера (PARENT_ID).

3. Добавление элемента в контейнер:

   constraintLayout.addView(textView);

4. Установка интерфейса:

   setContentView(constraintLayout);

---

Общие этапы добавления элементов в контейнеры

1. Создание объекта ViewGroup.LayoutParams и настройка его свойств.

2. Передача объекта LayoutParams методу setLayoutParams() элемента.

3. Добавление элемента в контейнер с помощью метода addView().

Хотя интерфейс можно создавать программно, более оптимальным способом является использование XML-файлов для описания визуального интерфейса. Это позволяет отделить логику приложения (Java-код) от его интерфейса (XML-разметка). В следующей теме рассмотрим этот подход.