After you have a basic understanding of Andriod Studio and have it installed and running on your computer, you can use it to build UI elements, connect it to backend code, and test your app on it's emulator. This Andriod app takes input text from the user and outputs the same text onto the screen.
Building UI in XML files
Connecting UI to backend code with variables and methods
Implementing backend functionality
Testing on an emulator
You can build the UI using XML text:
- Open the
activity_main.xml
file. - The
TextView
element is setup by default. - Copy the
EditText
,Button
, andTextView
elements from theactivity_main.xml
file. - Copy the string and color resources from the
strings
andcolor
files, respectively.
You need to gain access to the EditText
and TextView
elements from the UI.
- Open the
MainActivity.java
file. - Declare the UI elements variables:
EditText editText;
TextView textView;
The import statements are automatically added.
- Initialize these variables in the
OnCreate
method:
editText = findViewById(R.id.edit_text);
textView = findViewById(R.id.text_view);
You can now use these elements as variables.
- Create the method framework for defining the button functionality:
public void displayResults(View view) {
//TODO: Implement the functionality
}
The backend functionality code is as follows:
public void displayResults(View view) {
String inputText = editText.getText().toString(); //Any text entered in the EditText element is stored in inputText
if (inputText.equals("")){
return; //If no text is entered break out of the function
}
textView.setText(inputText); //Set the TextView element to the input text
}
Load up an emulator using the AVD manager and run the program: