Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Разработка приложений под Android. Выпуск 20 от 07.02.2020


Уважаемые читатели! Перед вами двадцатый выпуск рассылки по созданию приложений для платформы Android. Сайт рассылки - http://mimags.ru, зеркало - http://inwoo.atwebpages.com.
В данном выпуске продолжим корректировать приложение My First App.
При запуске приложения на экран телефона выводятся текстовое поле и кнопка (рис. 1).
Изменим строки интерфейса. Обратите внимание, что для ввода текста и метки кнопки установлены значения по умолчанию.
Выполните следующие шаги, чтобы изменить строки интерфейса:
1. Откройте окно проекта, а затем откройте файл app>src>main>res>values>strings.xml. Это файл строковых ресурсов, где вы можете указать все свои строки пользовательского интерфейса. Он позволяет вам управлять всеми строками интерфейса в одном месте, что облегчает их поиск, обновление и локализацию.
2. Нажмите Открыть редактор в верхней части окна (рис. 2). Откроется редактор переводов, который предоставляет простой интерфейс для добавления и редактирования строк по умолчанию. Это также поможет вам организовать все ваши строки.
3. Нажмите кнопку «Добавить ключ» (рис. 3), чтобы создать новую строку в качестве «текста подсказки» для текстового поля. В этот момент открывается окно, показанное на рисунке 4.
4. В диалоговом окне «Добавить ключ» выполните следующие действия:
Введите «edit_message» в поле «Ключ».
Введите «Введите сообщение» в поле Значение по умолчанию.
Нажмите ОК.
5. Добавьте еще один ключ с именем «button_send» со значением «Отправить».
6. Чтобы вернуться к файлу макета, щелкните Activity_main.xml на панели вкладок. Затем добавьте строки следующим образом:
6.1. Нажмите на текстовое поле в макете. Если окно Атрибуты не отображается справа, щелкните Атрибуты на правой боковой панели.
6.2. Найдите текстовое свойство, для которого в настоящее время установлено значение «Name», и удалите значение.
6.3. Найдите свойство подсказка (hint), а затем нажмите кнопку Выберите ресурс (Pick a Resource), которая находится справа от текстового поля. В появившемся диалоговом окне дважды щелкните edit_message из списка (рис. 5).
6.4. Нажмите кнопку в макете и найдите ее текстовое свойство, для которого в данный момент установлено значение «Button». Затем нажмите кнопку Pick a Resource и выберите button_send.
Результат приведен на рис. 6.
Сделайте размер текстового поля гибким
Чтобы создать макет, отвечающий разным размерам экрана, необходимо растянуть текстовое поле, чтобы заполнить все горизонтальное пространство, оставшееся после кнопки и полей.
Прежде чем продолжить, нажмите «Select Design Surface» на панели инструментов и выберите «Blueprint» (рис. 7).
Чтобы сделать текстовое поле гибким, выполните следующие действия.
1. Выберите оба представления (текстовое поле и кнопку). Для этого нажмите текстовое поле, удерживайте Shift, затем щелкните кнопку, затем щелкните правой кнопкой мыши любой из них и выберите «Цепочки»> «Создать горизонтальную цепочку» (Chains > Create Horizontal Chain). На рис. 8 и рис. 9 показан вид макета после данной операции.
Цепь обеспечивает двунаправленную связь между двумя или более виджетами , что позволяет синхронизировать сцепленные виджеты.
2. Нажмите кнопку и откройте окно Атрибуты. Затем с помощью инспектора представлений в верхней части окна «Атрибуты» установите для правого поля значение 16 dp.
3. Нажмите на текстовое поле, чтобы просмотреть его атрибуты. Затем дважды щелкните индикатор ширины, чтобы он установился на «Соответствие ограничениям» (Match Constraints), как показано  на рисунке 10.
Термин «Соответствие ограничениям» означают, что ширина увеличивается в соответствии с определением горизонтальных ограничений и полей. Поэтому текстовое поле растягивается, чтобы заполнить горизонтальное пространство, оставшееся после кнопки, с учетом полей вокруг виджетов.

Перейдите на вкладку Text.
Текст должен совпадать с приведенным ниже:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="com.example.myfirstapp.MainActivity">

    <EditText
        android:id="@+id/editText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:ems="10"
        android:hint="@string/edit_message"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/button"
        app:layout_constraintHorizontal_bias="0.5"
        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_marginEnd="16dp"
        android:layout_marginStart="16dp"
        android:text="@string/button_send"
        app:layout_constraintBaseline_toBaselineOf="@+id/editText"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/editText" />
</androidx.constraintlayout.widget.ConstraintLayout>

Все изменения, вносимые в визуальном редакторе (вкладка Design), отражаются в разметке XML макета (вкладка Text). Также справедливо и обратное: все изменения, вносимые в разметке XML макета, отражаются в визуальном редакторе.
Таким образом, можно добавлять компоненты графического интерфейса в макет как в визуальном редакторе, так и в разметке XML. Чаще всего, для получения желаемых результатов используется работа с XML напрямую, без применения визуального редактора. Дело в том, что прямое редактирование XML позволяет более точно управлять макетом.

Запустите приложение. На экране телефона выводятся текстовое поле и кнопка (рис. 11).

Был создан макет, определяющий внешний вид приложения. Макет включает в себя текстовое поле и кнопку.
Активность определяет, как приложение должно взаимодействовать с пользователем. Среда Android Studio сгенерировала активность, но она пока не выполняет никаких действий.

В следующем выпуске продолжим разработку приложения и добавим реакцию на действия пользователя.
Всего доброго, уважаемые читатели. Хорошего вам дня!

В избранное