In this tutorial, we want to make our App interactive by making it to respond to button clicks. When the user clicks on the button, an event will occur.Project: To display a number on the screen and a button. So, when the button is clicked, the number will be updated. Anytime you click on the button, the default number is increased by 1.
So, let’s get started.
First off, you will have to create a new project, give it any name you want. If you don’t know how to create a new project in Android Studio. Check this link, I explained explicitly on how create a new Android Studio project www.rexandroid.blogspot.com
If you’ve launched Android Studio already and you are in project but want create another project.
Go to the top bar, Click on File > New Project and fill up the rest.
In activity_main, enter this following codes. Here is a link on how to understand the basics of XML, working with XML
<?xml version="1.0"
encoding="utf-8"?>
<LinearLayout
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"
android:orientation="vertical"
android:padding="16dp"
tools:context="com.android.rexben.demomapp.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="Number"
android:textSize="20sp" />
<!--The text that will be updated when a
button is clicked-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="0"
android:textSize="20sp"
android:id="@+id/textView"/>
<!--The button that is responsible for add
numbers-->
<Button
android:id="@+id/add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add" />
</LinearLayout>
In your MainActivity.java, enter this following lines of code
package com.android.rexben.demoapp;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
//This variable called field because it declared out a method
//It is variable where we store the values that are added
private int numberUpdate;
@Override
protected void onCreate(Bundle
savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Casting views by resource IDs
final TextView defaultText =
(TextView) findViewById(R.id.textView);
Button addButton = (Button)
findViewById(R.id.add);
//setOnClickListener is responsible for happens when a button is
clicked
//Any codes writing inside the
setOnClickListener will be executed when the button is clicked
addButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View
view) {
//Anytime the button is clicked 1 is added to the screen
numberUpdate = numberUpdate + 1;
//Displays the numberUpdate to the screen
//if you don't set the
text, nothing will be display to
//the screen
defaultText.setText("" + numberUpdate);
}
});
}
}
When you are done, test run your App on your Android device. If you don’ know how to run the App on your mobile device, check this link Getting familiar with Android Studio numberUpdate = numberUpdate + 1;
To:
numberUpdate = numberUpdate - 1; to decrease the value by 1 anytime there is a click.
numberUpdate = numberUpdate * 5; to multiply the value by 5 anytime there is a click.
numberUpdate = numberUpdate / 2; to divide the value by 2 anytime there is a click.
Just add the default value of your choice
private int numberUpdate
= 10;
If you don’t want only the number to show, if you want to display other texts. For instance, instead of displaying only “1”, you can add “Number 1”.Just add the text you want and add a space so that the text and the number won’t be together. You can enter a long text but it must be in between "".
