1. Создание и настройка диалоговых окон

Диалоговое окно – это небольшое окно, которое предлагает пользователю принять решение или ввести дополнительную информацию. Диалоги, как правило, не занимают весь экран и используются в событиях, для продолжения которых требуется действие пользователя.

Базовый класс для диалогов – Dialog, но его напрямую реализовывать не рекомендуется. Рекомендуется использовать:

AlertDialog – диалоговое окно, в котором могут отображаться заголовок, до трех кнопок, список для выбора либо пользовательский макет;
DatePickerDialog или TimePickerDialog – диалоги для выбора даты и времени.

В качестве контейнера диалоговых окон следует использовать DialogFragment.

Очень подробная статья про использование и конфигурацию диалогов - здесь.

Дополнительную информацию и диалогах и сценариях их использования читайте здесь, здесь и здесь.

Создание и открытие диалогового окна

Для создания диалога необходимо расширить класс DialogFragment и создать AlertDialog в callback-методе onCreateDialog().

Рассмотрим работу с диалоговыми окнами на примере. Создадим проект, добавим в макет поле ввода и кнопку, по нажатию на которую появляется диалоговое окно

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/editText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        android:ems="10"
        android:hint="enter some text"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:text="Open Dialog"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/editText" />
</android.support.constraint.ConstraintLayout>

Создадим класс фрагмента диалога, в методе onCreateDialog() создадим объект диалога и вернем объект диалога.

MyDialog.java

public class MyDialog extends DialogFragment {

    @NonNull
    @Override
    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

        AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
        builder.setMessage("Сообщение диалогового окна");

        return builder.create();
    }
}

Обратите внимание, что для настройки объекта диалога используется паттерн Builder ("Строитель"), информацию про этот паттерн можно найти здесь.

Теперь перейдем в класс MainActivity.java и напишем обработчик кнопки. По нажатию на кнопку будет показано диалоговое окно

MainActivity.java

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        findViewById(R.id.button).setOnClickListener(v -> {

            MyDialog dialog = new MyDialog();
            dialog.show(getSupportFragmentManager(), "dlg");
        });
    }
}

Обратите внимание, что, так как диалоговое окно является фрагментов, для его корректной работы мы должны передать объект FragmentManager, который осуществляет управление фрагментами.

Запустим приложение и посмотрим на результат

Настройка диалогового окна

Android позволяет гибко настроить внешний вид и поведение диалогового окна: вы можете добавить, заголовок, иконку, до трех кнопок, а также менять тип сообщения или даже предоставить свой макет для создания уникальных диалоговых окон.

Давайте попробуем модифицировать наше диалоговое окно. Для этого нам необходимо вернуться в класс диалога и в методе onCreateDialog() и добавить нужные компоненты с помощью сеттеров объекта строителя.

MyDialog.java

@NonNull
@Override
public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    builder.setTitle("Заголовок диалогового окна");
    builder.setIcon(R.drawable.ic_report_problem_black_24dp);
    builder.setMessage("Сообщение диалогового окна");
    builder.setPositiveButton("OK", null);
    builder.setNeutralButton("Neutral Choice", null);
    builder.setNegativeButton("Cancel", null);

    return builder.create();
}

Посмотрим на результат

Возможности Android позволяют вам вместо простого сообщения добавить в диалоговое окно группу радиокнопок или чекбоксов.

Пример для группы радиокнопок

MyDialog.java

@NonNull
@Override
public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    builder.setTitle("Заголовок диалогового окна");
    builder.setIcon(R.drawable.ic_report_problem_black_24dp);

    builder.setSingleChoiceItems(R.array.dialog_choices, 0, (dialog, which) -> {
        // Обработчик нажатия на радиокнопку
    });

    builder.setPositiveButton("OK", null);
    builder.setNeutralButton("Neutral Choice", null);
    builder.setNegativeButton("Cancel", null);

    return builder.create();
}

arrays.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="dialog_choices">
        <item>Опция 1</item>
        <item>Опция 2</item>
        <item>Опция 3</item>
    </array>
</resources>

Пример для чекбоксов

MyDialog.java

@NonNull
@Override
public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    builder.setTitle("Заголовок диалогового окна");
    builder.setIcon(R.drawable.ic_report_problem_black_24dp);

    builder.setMultiChoiceItems(R.array.dialog_choices,
            new boolean[]{true, false, true}, (dialog, which, isChecked) -> {
        // Обработчик нажатия на чекбокс
            });

    builder.setPositiveButton("OK", null);
    builder.setNeutralButton("Neutral Choice", null);
    builder.setNegativeButton("Cancel", null);

    return builder.create();
}

arrays.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="dialog_choices">
        <item>Опция 1</item>
        <item>Опция 2</item>
        <item>Опция 3</item>
    </array>
</resources>

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

MyDialog.java

@NonNull
@Override
public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    builder.setTitle("Заголовок диалогового окна");
    builder.setIcon(R.drawable.ic_report_problem_black_24dp);

    builder.setItems(R.array.dialog_choices,(dialog, which) -> {
        // Обработчик нажатия на пункт списка
    });

    builder.setPositiveButton("OK", null);
    builder.setNeutralButton("Neutral Choice", null);
    builder.setNegativeButton("Cancel", null);

    return builder.create();
}

arrays.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="dialog_choices">
        <item>Опция 1</item>
        <item>Опция 2</item>
        <item>Опция 3</item>
    </array>
</resources>

Диалоговое окно выбора даты и времени

Отдельно стоит упомянуть про стандартные диалоговое окна для выбора даты (класс DatePickerDialog) и времени (класс TimePickerDialog).

Выбор даты и времени также реализован в виде отдельных UI виджетов, которые можно поместить в любой макет.

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

Рассмотрим пример создания диалогового окна для выбора даты. Обратите внимание, что номер возвращаемого месяца начинается с 0, поэтому увеличиваем значение месяца на единицу.

MyDialog.java

public class MyDialog extends DialogFragment {

    @NonNull
    @Override
    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

        final Calendar c = Calendar.getInstance();

        int year = c.get(Calendar.YEAR);
        int month = c.get(Calendar.MONTH);
        int day = c.get(Calendar.DAY_OF_MONTH);
        
        // Передаем контекст, слушатель для выбора даты и текущую дату
        return new DatePickerDialog(getActivity(), listener, year, month, day);
    }

    // Слушатель для выбора даты, выводим на экран сообщение
    private DatePickerDialog.OnDateSetListener listener = (view, year, month, dayOfMonth) -> {
        String msg = "дата: " + dayOfMonth + "/" + (month + 1) + "/" + year;
        Toast.makeText(getActivity(), msg, Toast.LENGTH_SHORT).show();
    };
}

Рассмотрим пример для диалогового окна выбора времени.

MyDialog.java

public class MyDialog extends DialogFragment {

    @NonNull
    @Override
    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

        final Calendar c = Calendar.getInstance();
        int hour = c.get(Calendar.HOUR_OF_DAY);
        int minute = c.get(Calendar.MINUTE);

        // Передаем контекст, слушатель, текущее время и запрашиваем у системы
        // в каком формате отображается на устройстве время (12 или 24 часа)
        return new TimePickerDialog(getActivity(), listener, hour, minute,
                DateFormat.is24HourFormat(getActivity()));
    }

    // Слушатель для выбора времени
    private TimePickerDialog.OnTimeSetListener listener = (view, hourOfDay, minute) -> {
        String msg = "Выбранное время " + hourOfDay + ":" + minute;
        Toast.makeText(getActivity(), msg, Toast.LENGTH_SHORT).show();
    };
}

PreviousЛекция 5 Next2. Передача и получение данных из диалога

Last updated 3 years ago