Курс по созданию приложений для android [Часть 2]

Всем доброго времени суток!
Прошу прощения за задержку, были некоторые проблемы с техникой. Собственно, всё рассказал уже в комментарий первой части)

Те, кто наткнулись случайно -- настоятельно рекомендую сначала освоить первую часть! Курс по созданию приложений для android

В данном уроке мы научимся как создавать и расставлять объекты. Урок может быть скучноват, но это просто необходимо понять, т.к. без фундамента хороший дом не построить..

Я не забыл моменты в своей жизни, когда задавал вопрос, а через несколько лет слыша подобный, понимал, насколько он глупый. Осознание того, что это не вопрос глупый, а я (в тот момент, когда забыл, что был когда-то таким) пришло недавно, поэтому описывать буду максимально подробно (кто частично знаком или понял какой-то момент "налету" -- просто пропустите спойлер, в случае сложностей же -- не пренебрегайте ими.

Не будем долго разглагольствовать и сразу приступим к делу!

В первую очередь запустим Android Studio.
Начинаем новый проект и снова выбирает "Empty Activity" -> "Next"
Указываем название проекта (к примеру, Lesson_2)
Не забываем указать, что использовать будет язык Java
Минимальный API Я выбираю 21 (Android5.0)
Жмём "Finish"



Как и в прошлый раз, дайте студии прогрузиться.

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

Выберите файл "activity_main.xml", далее переключитесь на режим "Design"



Тут мы сможем сразу видеть как изменяется размер, положение, цвет, форма и прочее объектов в нашем приложении.

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

За фон всего приложения отвечает параметр "ConstraintLayout", поэтому на него и кликаем. После этого справа появятся все доступные свойства, нажмите "All attributes", найдите там "Background" и кликните на ползунок справа



Если хотите, что бы фон был просто цветной -- кликните, на слово "Color" там на colorAccent и выберите цвет.
Если хочется, что бы на фоне было изображение -- оставайтесь в пункте "Drawable" и выберите изображение. Да, кстати, что бы добавить своё -- закройте окно свойств и в самом левом столбике с папками откройте "res -> drawable", но не торопитесь просто перетягивать туда файл, он может добавиться с ошибками. Лучше скопируйте файл на вашем ПК а затем, выделив папку "drawable" нажмите сочетание "ctrl"+"v", после чего нажмите на "ОК" и снова идите в свойства "ConstraintLayout"

Готово, фон задали, теперь давайте создадим кнопку, это очень просто!

В "activity_main.xml" выберите пункт "Button", во втором открывшемся столбике возьмите и перетащите кнопку на рабочую поверхность, в удобное для Вас место.

Куда бы вы не разместили вашу первую кнопку -- при запуске приложения она всё равно будет вверху-слева, что бы этого не произошло, необходимо указать, от каких границ будут рассчитываться координаты объекта. Для этого возьмите за верхний круг на кнопке и подтяните его к верхней границе рабочей области (экрана телефона), кнопка сразу же подскочит вверх, так и должно быть. Теперь возьмите за нижний круг и подтяните его к нижней границе соответственно. Вы заметите, что линия стала "пружинной". Поступите точно так же и с боковыми точками. Вот теперь возьмитесь за кнопку и разместите её туда, где Вы сами хотите её видеть.



Кнопку разместили, но она совершенно ничего не делает, давайте возьмём классический пример и заставим меняться текст после нажатия на кнопку. Для этого добавьте текст на рабочее место ("Text" и перетащите"TextView" на рабочее место), проделайте с ним тоже самое, что и с кнопкой.
Обратите внимание, что точку можно прицепить и к границе другого объекта, а не только к границе экрана, для чего это, думаю, что Вы догадались и сами.

В свойства справа укажите id для Вашего текста, не оставляйте его стандартным, я указал "text2"



Пролистайте вниз и найдите свойство "text". Введите в графу над ключом изначально отображаемый текст.

Тоже самое можете сделать и для кнопки "Button" назвав её тем самым как угодно, однако, если чувствуете, что начали путаться -- вернитесь к этому пункту после того, как первый раз запустите приложение!



Если размер текста вас неудовлетворяет -- выбирите другой параметр свойства "textAppearance" (на два пункта ниже)

Вновь выберете Вашу кнопку в списке компонентов и найдите справа свойство "onClick"{1}. В поле правее впишите точно так же onClick (Это имя метода для обработки нажатия, но пока что, если ранее с этим не знакомились, не заморачивайтесь, а просто сделайте так (так чаще всего указано в примерах и учебниках, так сделаем и мы, что бы Вы могли сверять свои работы с другими примерами). Понемногу мы всё разберём.
После переключитесь на режим текста {2}.



Всё что мы сделали с Вами, можно было прописать ручками тут, но на первое время пользуйтесь визуализацией.

Найдите строку "onClick" в кнопке "Button", поставьте курсор на подчёркнутое красным "onClick" и нажмите "alt"+"enter".

В появившемся меню выберите "Create 'onClick(View)' in 'MainActivity'"



Вы тут же попадёте в файл "MainActivity.java", где появится заготовка обработки нажатия.
Давайте напишем наш код:

над "@Override" напишите следующее:

Таким образом мы объявили переменную типа "TextView" и назвали её "mText" (тип переменной менять нельзя, а вот назвать её Вы можете как угодно, с одной оговоркой: имя переменной должно начинаться со строчной "m"а остальная часть имени начинаться с заглавной буквы.

Когда будете писать этот код и любой другой -- кликайте по первой строке или нажимайте просто enter, если у Вас появляется подсказка ПОСЛЕ того, как Вы написали СЛОВО целиком. Таким образом появляется дополнительный код в другой части, о котором мы тоже поговорим позже.

И, пожалуйста, соблюдайте табуляцию! После каждой открытой фигурной скобки -- писать код следует на новой строке правее (это сделано для удобства и читаемости кода)



Далее внутри метода "onCreate()", сразу после "setContentView()" напишите следующую строку
таким образом мы связали нашу переменную {1} с нашим текстом с помощью идентификатора (id){2}, который прописали ему ранее



Почти всё сделано, ещё чуть-чуть! Постарайтесь не уходить а доделать, и только после этого заварить себе чай и всё переосмыслить.

Возвращаемся в "public void onClick()".

Именно тут описывается всё, что должно произойти после нажатия на кнопку.

Пишем внутри метода после фигурной скобки:
тут мы указываем нашу переменную {1} и говорим ей принять{2} следующий текст{3}



Ну вот и всё! Поздравляю!!! Программа полностью готова и её можно запустить на эмуляторе или своём устройстве!

Нажмите "Shift"+"F10" или зелёный треугольник, дождитесь запуска программы, нажмите на кнопку и похвалите себя!)

Домашнее задание: сделать такое же приложение, добавив туда несколько кнопок: Две кнопки меняют один и тот же текст, после нажатия третей кнопки -- появляется текст, которого ранее не было. Маленькая подсказка: при добавлении следующих кнопок не нужно ставить курсор на "onCreate" и нажимать "alt"+"enter"

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