Сложение двух чисел в Android Studio на Java (Android приложение)

Статьи из цикла

В статье рассказывается как создать приложения сложения двух чисел в Android Studio для Android.

Приготовления

В статье Установка Android Studio в Windows узнаете, как установить и настроить Android Studio.

Создание проекта

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

Выбор типа главной активности

Выбор настроек проекта

Готовый проект в Android Studio

Перейдем вначале к файлу activity_main.xml, который отвечает за разметку внешнего вида приложения:

Переход к activity_main.xml

В Android Studio 4 изменили размещение переключателя дизайна и кода разметки экрана:

Переключение на режим дизайна разметки кода

Размещение компонентов

По умолчанию в Android Studio в качестве разметки используется контейнер ConstraintLayout. Для новичков он не совсем простой. Поменяем на обычный LinearLayout.

Перейдем в текстовой режим разметки XML файла. Там мы внутри контейнера ConstraintLayout видим элемент TextView с фразой Hello, World!:

Переход к текстовому отображению activity_main.xml

И заменим содержимое всего файла на следующий код:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:orientation="vertical" >

</LinearLayout>

В Android Studio 4 изменили размещение переключателя дизайна и кода разметки экрана:

Переключение на режим текста разметки кода

Перейдем обратно в режим дизайна:

Возвращение к визуальному редактированию activity_main.xml

Перетащим текстовое поле:

Перетащенное текстовое поле

Включим отображение атрибутов компонентов:

Отображение атрибутов компонентов

Обратим внимание на то, что поле имеет имя (id) editText:

Идентификатор текстового поля

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

Изменение параметра text

Перетащим еще одно текстовое поле, которое будет иметь имя editText2:

Второе текстовое поле

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

Изменение параметра text

Перетащим кнопку:

Кнопка

Поменяем текст на кнопки, например, на Сложить:

Кнопка

Перетащим поле с текстом для вывода:

Текстовое поле для вывода

Начальный текст поменяем, например, на =:

Текстовое поле для вывода

Начальный размер шрифта в TextView маленький, так что увеличим его. За это отвечает свойство textSize, которое можно найти либо в списке всех атрибутов, либо через поиск:

Текстовое поле для вывода

В текстовом варианте получившаяся разметка будет такой:

Переход в режим текстового редактирования activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="2" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="3" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Сложить" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="="
        android:textSize="36sp" />
</LinearLayout>

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

Соединение компонентов с Java кодом

Перейдите в окно редактирования кода главной активности:

Переход в Java код активности

Добавьте в класс три переменных, отвечающих за два текстовых поля ввода и одно текстовое поля вывода:

private EditText editText;
private EditText editText2;
private TextView textView;

Объявление переменных в коде

Видите, что в этих строчках есть красные слова (что означает наличие ошибки). Это от того, что не подключены библиотеки для этих типов данных. Курсор (каретку) щелкните по слову EditText, и нажмите Alt + Enter. И там выберите Import class:

Предложение решить проблему через Alt + Enter

Импорт класса EditText

Также сделайте с TextView:

Импорт класса TextView

Краснота уйдет:

Отсутствие ошибок после импорта классов

В методе onCreate соедините созданные переменные с теми полями, что объявлены в разметке.

Внимание! Добавлять эти строчки нужно после setContentView:

editText = findViewById(R.id.editText);
editText2 = findViewById(R.id.editText2);
textView = findViewById(R.id.textView);

Место расположения кода с findViewById

Обратите внимание, что значение id компонентов совпадают с id компонентов из XML файлов. То что названия Java переменных совпадают — это только для удобства:

Указание на ID элементов из XML файла

Теперь надо прописать код обработки клика кнопки, чтобы при её нажатии считывались числа, складывались и сумма выводилась в TextView. Будет рассмотрено два способа.

Первый способ обработки клика кнопки

Добавим в класс активности новый метод, например, с названием clickButton:

public void clickButton(View v) {
}

Метод clickButton

И через Alt + Enter убираем красноту:

Метод clickButton без красноты

В метод него добавим код обработки клика кнопки:

// Объявим числовые переменные
double a, b, c;

// Считаем с editText и editText2 текстовые значения
String s1 = editText.getText().toString();
String s2 = editText2.getText().toString();

// Преобразуем текстовые переменные в числовые значения
a = Double.parseDouble(s1);
b = Double.parseDouble(s2);

// Проведем с числовыми переменными нужные действия
c = a + b;

// Преобразуем ответ в число
String s = Double.toString(c);

// Выведем текст в textView
textView.setText(s);

Тело метода clickButton

Полный код файла MainActivity.java у меня выглядит так:

package com.example.add2num;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    private EditText editText;
    private EditText editText2;
    private TextView textView;

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

        editText = findViewById(R.id.editText);
        editText2 = findViewById(R.id.editText2);
        textView = findViewById(R.id.textView);
    }

    public void clickButton(View v) {
        // Объявим числовые переменные
        double a, b, c;

        // Считаем с editText и editText2 текстовые значения
        String s1 = editText.getText().toString();
        String s2 = editText2.getText().toString();

        // Преобразуем текстовые переменные в числовые значения
        a = Double.parseDouble(s1);
        b = Double.parseDouble(s2);

        // Проведем с числовыми переменными нужные действия
        c = a + b;

        // Преобразуем ответ в число
        String s = Double.toString(c);

        // Выведем текст в textView
        textView.setText(s);
    }
}

Обратите внимание на то, что, если вы проект в самом начале назвали по-другому (у меня он называется Add2num), то первая строчка с package у вас будет другой. И если вы бездумно скопируете строчку package com.example.add2num; в ваш проект, который называется по-другому, то у вас программа не соберется и не запустится!

Мы почти закончили, но мы нигде не прописали, что метод clickButton должен срабатывать при клике на кнопку. Исправим это.

Перейдем в XML файл разметки, в котором мы уже работали. И в нем в компоненте Button добавим строчку:

android:onClick="clickButton"

Изменения в XML файле

Полный код файла activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="2" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="3" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="clickButton"
        android:text="Сложить" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="="
        android:textSize="36sp" />
</LinearLayout>

Запуск приложения

Если вы используете не физическое устройство, а эмулятор, то всегда рекомендую вначале запустить эмулятор, а потом уже запускать приложение:

Запуск AVD Manager

Запуск эмулятора

Запущенный эмулятор

Теперь можем запускать наш проект:

Запуск компилирования проекта

Выбор устройства, на котором будет запускаться проект

Запущенное приложение

Введем какие-нибудь числа и нажмем кнопку:

Результат выполнения программы

Второй способ обработки клика кнопки

Теперь реализуем второй способ обработки клика, который я рекомендую использовать вместо первого. А чем плох первый? Мы в XML файле прописали, как называется метод из Java кода, который нужно запускать, то есть смешали код реализации и код разметки между собой. Это не очень хорошо. Попробуем не вносить изменения в XML файл.

Добавим еще одну переменную для связки кнопки из XML файла с Java кодом. Красноту помните, как убирать:

private Button button;

Объявление переменной button

Также пропишите этот код:

button = findViewById(R.id.button);

Код нахождения кнопки через findViewById

А теперь напишем обработчик клика кнопки через OnClickListener. Пропишите такой код:

button.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {

    }
});

Внимание! Обратите внимание, что в первом способе код обработки кнопки clickButton мы писали вне метода onCreate, а сейчас пишем внутри метода onCreate:

Обработчик клика кнопки

Пропишем реализацию метода:

// Объявим числовые переменные
double a,b,c;

// Считаем с editText и editText2 текстовые значения
String S1 = editText.getText().toString();
String S2 = editText2.getText().toString();

// Преобразуем текстовые переменные в числовые значения
a = Double.parseDouble(S1);
b = Double.parseDouble(S2);

// Проведем с числовыми переменными нужные действия
c = a + b;

// Преобразуем ответ в число
String s = Double.toString(c);

// Выведем текст в textView
textView.setText(s);

Реализация клика кнопки

Полный код файла MainActivity.java:

package com.example.add2num;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    private EditText editText;
    private EditText editText2;
    private TextView textView;
    private Button button;

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

        editText = findViewById(R.id.editText);
        editText2 = findViewById(R.id.editText2);
        textView = findViewById(R.id.textView);
        button = findViewById(R.id.button);

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // Объявим числовые переменные
                double a,b,c;

                // Считаем с editText и editText2 текстовые значения
                String S1 = editText.getText().toString();
                String S2 = editText2.getText().toString();

                // Преобразуем текстовые переменные в числовые значения
                a = Double.parseDouble(S1);
                b = Double.parseDouble(S2);

                // Проведем с числовыми переменными нужные действия
                c = a + b;

                // Преобразуем ответ в число
                String s = Double.toString(c);

                // Выведем текст в textView
                textView.setText(s);
            }
        });
    }
}

Файл Полный код файла MainActivity.java остался без изменений (строчки android:onClick="clickButton" тут нет):

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="2" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="3" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Сложить" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="="
        android:textSize="36sp" />
</LinearLayout>

При запуске мы получим такое же по функциональности приложение, как и при первом способе:

Запущенное приложение <ul><li>Android Studio icon.svg by Google Inc. / (2019-06-07)</li></ul>

В статье рассказывается как создать приложения сложения двух чисел в Android Studio для Android.