Създаване на приложения за мобилни устройства / Creating applications for mobile devices

В рамките на това упражнение ще се проследи процеса по създаване на опростено приложение за извършване на изчислителни процеси с два оператора. Студентите ще упражнят получените до момента знания за създаване на приложения и дейности и ще разширят тези знания с нови, свързани със създаването на нови Java класове в AS.

2. Цел на упражнението

• Създаване на опростен графичен интерфейс за приложение, което ще извършва процесите по събиране, изваждане, умножение и делене между два оператора;
• Създаване в отделен файл на нов Java клас за описание на обекта калкулатор и за дефиниране на основните му функции;
• Добавяне на изключения за проверка на въведените стойности и за изчислението.

3. Създаване на ново приложение, дефиниране на линейна екранна подредба и създаване на елементи

Стъпка 1. – Създаването на ново приложение може да стане по познатия начин от предходното упражнение. От началният екран на Android Studio (ако Android Studio директно отвори последния проект, трябва да го затворите за да стигнете до началния екран), изберете “New project”. На следващия екран, изберете “Empty Activity”.

In this exercise, the processes of creating a simple application for performing computational processes with two operators will be shown. Students will practice their new gained knowledge of creating applications and activities and will expand this knowledge with new ones related to creating new Java classes in Android Studio.

2. Exercise goals

• Creating a simple graphical interface for an application that will perform the addition, subtraction, multiplication and division processes between two operators;
• Creating a new Java class in a separate file for definition of the object calculator and its main functions;
• Add exceptions for wrong input values and wrong arithmetic operations.

3. Creating a new application, defining a linear screen layout and creating elements

Step 1. – Creating a new application can be done in the way you already know from the previous exercise. From the home screen of Android Studio (if the Android Studio directly opens the last project, you should close it to reach the home screen), select “New project”. On the next screen, select “Empty Activity”.

На следващия екран, въведете следните настройки за проекта и изберете Next:
• Name: Lab5
• Package name: com.example.lab5
• Save location: C:\Users\your_username\AndroidStudioProjects\Lab5
• Language: Java
• Minimum SDK: API 19: Android 4.4 (KitKat)

След което натиснете Finish. ще генерира автоматично всички файлове и компоненти, от които ще се състои новото приложение. След приключване на този процес ще се изведе следния прозорец:

On the next screen, enter the following project settings and select Next:


• Name: Lab5
• Package name: com.example.lab5
• Save location: C:\Users\your_username\AndroidStudioProjects\Lab5
• Language: Java
• Minimum SDK: API 19: Android 4.4 (KitKat)

Then click Finish. Android Studio will automatically generate all the files and components that the new application will contain. After completing this process, the following window will appear:

Новосъздаденото приложение представлява познатото ви Hello World приложение от предишните упражнения.
Стъпка 2. – Стартиране на приложението. Използвайте клавишната комбинация Shift+10, за да стартирате приложението. Изберете съответния виртуален смартфон.

Стъпка 1. – В рамките на това упражнение ще реализираме LinearLayout екранна подредба, в която ще има два елемента за въвеждане на информация от тип EditText и един елемент за извеждане на резултата от действията от тип TextView. Избора на действие ще се извършва посредством четири бутона, които ще се визуализират във вградена екранна подредба от тип RelativeLayout. Реализираното приложение е представено на фигурата.

The newly created application is the same as the Hello World application from the previous exercise.
Step 2. – Use Shift + 10 to launch the application. Select the appropriate virtual smartphone.

Step 1. – During this exercise, the LinearLayout screen layout will be implemented, which will have two elements for entering values of type EditText and one element for displaying the results of actions of type TextView. The choice of action will be made through four buttons, which will be displayed in the screen layout of the type RelativeLayout. The appearance of the application is presented in the figure.

Стъпка 2. – Започнете създаването на приложението с промяната на екранната подредба от ConstraintLayout на LinearLayout. Използвайте вертикална екранна подредба. Програмен код за създаването на екранната подредба е представен на фигурата.

Step 2. – Start creating the application by changing the screen layout from ConstraintLayout to LinearLayout. Use a vertical screen layout. Program code for creating the screen layout is presented in the figure.

Стъпка 3. – Премахнете съществуващия към момента TextView елемент и преминете към създаването на елементите от екранната подредба.

Step 3. – Remove the currently existing TextView element and proceed to the creation of the elements from the screen layout.

Стъпка 1. – Отворете файла strings.xml. Променете наименованието на приложението (стойността на променливата app_name) на Calc. Дефинирайте новите ресурси, които ще представят текста в полетата за въвеждане на текст и ще определят наименованието на бутоните. За момента няма да използваме променливата „computationError“. Тя ще се използва за извеждане на съобщението за грешка, когато добавим проверките в Точка 7. Финалната версия на файла с променливите трябва да изглежда както е показано на фигурата.

Step 1. – Open the strings.xml file. Change the name of the application (the value of the variable app_name) to Calc. Define the new resources that will be displayed as text in the text input fields and that will define the name of the buttons. The variable “computationError” will not be used at this time. It will be used to display the error message when checks are added in Section 7.
The final version of the strings file should look as shown in the figure.

Стъпка 2. – Стартирайте приложението в емулатор. Ако сте изпълнили правилно всички стъпки и ако нямате някъде грешки, трябва да ви се стартира основен екран за приложението, който изглежда като този от фигурата.

Step 2. – Run the application in the emulator. If you have performed all the steps correctly and if you do not have any errors somewhere, the main screen for the application will be visualized, which looks like the one in the figure.

Стъпка 1. – Отворете файла MainActivity.java. Дефинирайте си два обекта от тип EditText – mOperandOneEditText и mOperandTwoEditText. Дефинирайте и обект за извеждане на резултата – mResultTextView. Както виждате от програмния сегмент, трябва да дефинирате и един обект от тип Calculator. Класа за този елемент ще дефинираме по-късно.

Step 1. – Open the MainActivity.java file. Define two new variables of type EditText – mOperandOneEditText and mOperandTwoEditText. Also define a variable to display the result – mResultTextView. On the figure, it is visible that variable of type Calculator is needed. The class for this element will be defined later.

Стъпка 2. – Променете съдържанието на функцията onCreate, като добавите връзката между новосъздадените обекти и полетата от екранната подредба. Използвайте функцията findViewById със съответните аргументи. Инициализирайте mCalculator.

Step 2. – Change the content of the onCreate function by adding the link between the newly defined variables and the fields of the screen layout. Use the findViewById function with the appropriate arguments. Initialize mCalculator.

Стъпка 3. – Дефинирайте функционалността на бутоните от екранната подредба. Както виждате, бутоните извикват функция compute, но с различни атрибути.

Step 3. – Define the functionality of the buttons from the screen layout. It can be seen that all the buttons call the compute function, but with different parameters.

Стъпка 4. – Дефинирайте функцията за извършване на изчисленията. Тази функция се извиква след натискане на бутон и има за входен атрибут действието, което трябва да се извърши. Самата функция извиква на два пъти функцията getOperand, за да получи стойностите в двете полета за въвеждане на текст. След получаване на стойностите и в зависимост от натиснатия бутон се преминава към извършване съответното действие с тях. За целта се използва switch – case оператор. Както виждате резултата от изпълнението на този оператор е променлива result, с която се връща резултата от изчислението. Самите функции за изчисление трябва да се дефинират в класа Calculator, който ще създадем в следващите стъпки.

Step 4. – Function for performing the calculations should be added. This function is called after pressing a button and it takes as an input attribute the action to be performed. The function itself calls the getOperand function twice to get the values from the two input fields. After receiving the values and depending on the pressed button, the corresponding action is performed. A switch-case operator is used for this purpose. As it can be seen, calling this functions returns a variable result, which contains the result of the calculation. The calculation functions themselves must be defined in the Calculator class, which will be created in the following steps.

Стъпка 5. – Последните две функции, които ще дефинираме в MainActivity.java са функцията за извличане на съдържанието на полетата за въвеждане и функцията за конвертиране на цифровата стойност в символен низ, преди показването на резултата.

Step 5. – The last two functions that will be defined in MainActivity.java are the function for extracting the content of the input fields and the function for converting the numeric value into a string before displaying the result.

Стъпка 6. – Изберете папката с Java файла за приложението. С десен бутон изберете New -> Java Class за да създадете нов java файл и да дефинирате класа на калкулатора. В диалоговия прозорец въведете наименование Calculator.

Step 6. – In the folder containing the Java file, new file should be created. It can be done by right-clicking to the folder and then New -> Java Class to create a new java file and define the calculator class. In the dialog box, Calculator should be entered as the name of the class.

Стъпка 7. – За новосъздадения клас Calculator трябва да се дефинират всички подчинени функции, които ще се използват от обектите от този клас. Реализирайте функциите за събиране, изваждане, умножение и деление с два оператора.

Step 7. – For the newly created Calculator class, all child functions that will be used by the objects of this class must be defined. Implement the addition, subtraction, multiplication and division functions with two operators.

Стъпка 8. – Стартирайте приложението в емулатор и тествайте неговата функционалност. Ако искате, стартирайте и тествайте приложението на реално устройство. Пробвайте да натиснете някой от бутоните, но без да сте въвели стойности. Пробвайте да делите на нула или с празен оператор. Приложението трябва да спре да работи.

Step 8. – Run the application in an emulator and test its functionality. The application can also be executed and tested on a real device. Try pressing one of the buttons, but without entering values. Try dividing by zero or with an empty operator. The application should stop working.

Стъпка 1. – За да избегнем възникването на грешки (заради липсващи стойности) и прекратяването на действието на приложението ще разгледаме как може да се въведат няколко проверки и да се дефинират изключения, които да не прекратяват работата на калкулатора. Започнете с дефинирането на нова променлива в MainActivity.java, която ще се извежда като заглавие за съобщението.

Step 1. – To avoid errors (due to missing values) and the termination of the application, checks should be added and exceptions should be defined which will prevent crashing of the app. New variable should be defined in MainActivity.java, which will be displayed as the message header.

Стъпка 2. – За да избегнем опити за неправилно деление от страна на потребителя, променете функцията onDiv, както е указано на фигурата. Тествайте приложението с делене на нула като въведете 0 за втория оператор и като оставите оператора празен.

Step 2. – To prevent the user from incorrect division, the onDiv function should be edited as shown in the figure. Test the application by entering 0 for the second operator and by leaving the second operator blank.

Стъпка 3. – Редактирайте функцията compute и добавете проверки за изчитане на операторите в EditText полетата. Не променяйте switch оператора!

Step 3. – The compute function should be edited and checks should be added for the operands in the EditText fields. The switch operator should not be changed!

Стъпка 4. – Стартирайте повторно приложението и пробвайте да извършите действие с празен оператор.

Step 4. – Restart the application and try to perform an operation with an empty operand.