Tried "Hello World" using Android Studio

Author:@kengo_kuwahara
Source:Qiita

Introduction

I will show you how to develop Android application using Android Studio.

What's Android studio?

It is familiar to those who have used the integrated development environment, except that there is a preview screen on the right side.

You can open and close the menu from the bottom and the left and right bars. Basically, as with the image above, the menu other than the necessary minimum (code and preview) is closed.

How to implement

In development using Android Studio, we will implement it by editing the xml file and the java file.

xml file

It is a file for setting appearance, such as the position of buttons and text boxes. For those who have experience developing with JavaScript, it may be easier to understand as html files in JavaScript development.

java file

It is a file for setting the operation, such as processing when pressing the button. If you have experience developing with JavaScript, it may be easier to understand if it corresponds to js file in JavaScript development.

Implement

This time we will edit activity_main.xml and MainActivity.java. After loading the completed image (or the result after completion), write the actual code.

Complete image

The setting is as follows.

xml

Label: "Hello World !!"
Button: "Change label"

Java

Method that puts label "change text" when pushing "change label" button.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout...
　　<!--(略)-->
    <TextView
        android:id="@+id/chage"
        android:text="Hello World!!"
        android:textSize="32sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        android:layout_marginLeft="101dp"
        android:layout_marginTop="81dp" />

    <Button
        android:id="@+id/mybottun"
        android:onClick="changeLabel"
        android:text="Change text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        android:layout_marginLeft="138dp"
        android:layout_marginTop="160dp" />
</android.support.constraint.ConstraintLayout>

<TextView ...

It is setting of a label.

<Button ...

It is the setting of the button.

android: id = "@ + id / hoge"

Specify the id of the object.

android: layout_width = "wrap_content"

Specify the size of the object. By specifying "wrap_content" it automatically adjusts the size according to the object to be displayed (for example, if you increase the character "change label" displayed on the button, the button will become larger accordingly).

app: layout_constraintLeft_toLeftOf = "parent"

It is a setting about the placement of the object. This sets the object on the left side of the screen.

layout_constraintLeft_toLeftOf is set based on the position of the right side = "hoge". The left edge of the screen is set by specifying parent. Also, by setting app: layout_constraintLeft_toLeftOf = "[object id]", it can be left aligned with the specified object.

android: layout_marginLeft = "101 dp"

layout_constraintLeft_to Set the number of dp margins to be set from the position specified by LeftOf and others.

By the way, if you put the mouse on the object in Preview of Andoroid Studio, you can see from what position to what dp position. It is also possible to change the position by dragging the object.

MainActivity.java

public class MainActivity extends AppCompatActivity {

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

    /**
     *
     * @param view
     */
    public void changeLabel(View view) {
        TextView tv = (TextView) findViewById(R.id.chage);
        tv.setText("changed text");
    }

}

onCreate()

If you make xml at all, it will be meaningless unless be read it. This method describes which xml is called when invoked, in setContentView. Here, activity_main.xml is set up.

changeLabel()

Describe the operation when pressing the button. In order to fetch an event from the screen, take a variable of type view as an argument. After that, obtain the ID of the label you want to change and set the value with setText.