An authoritative guide for Android Programming-Reading notes (ii)-The first small program

The authoritative guide for Android Programming-Reading notes (ii)

-First Small program

The first example is an introduction

The application name is Geoquiz. The user answers the question on the screen by clicking the True or False button, Geoquiz can instantly feedback the answer correctly or not.

This example gives us a brief introduction to the use of several basic components, as well as basic event monitoring. Let's have a basic understanding of the use of basic components and the monitoring of events.

This article is divided into 2 parts, the first part is to create a simple UI. The second part is to add code to the UI to respond to some actions.

(Note: All things that you do not understand or understand are not important, but we will introduce them in more detail later.) ）

Objectives of this chapter

• First contact with Android development, get rid of mystery.
• Android Studio was used to create this app.
• The use of primary components.
• A small amount of Java code to warm up.

Create the first example of the program Geoquiz UI

File->new Project

Application Name:geoquiz

And then click Next

Here we choose Phone and Tablet, Minimum SDK I chose 4.2. I chose this because I was doing it for a few minutes now, and I was confused in my head. Simply choose the default SDK version on the book. Click Next.

The book said that the blank Activity although the interface is not the same rich a lot of many, we still follow the book. It should be the simplest to look at a name. Click Next.

At this stage,

Activity name:quizactivity

Layout Name:activity_quiz

Title:geoquiz

The other default. Then click Finish to finish creating the app.

Simple analysis of the file

When the app is created, this is the file structure of the program. Because now just do the most preliminary UI. Then the initial UI is modified in Res->layout->activity_quiz.xml.

Writing your app's UI

Remove all the code inside, we re-write the new code.

Here's an easy way for us to pull directly into a linearlayout. (The property-related settings are first laid out, first by the basic dependencies of the space required) drag the TextView onto the linearlayout, then drag a linearlayout to LinearLayout. Then drag the 2 button control onto the second linearlayout.

We've put together 5 builds:

• a vertical linearlayout component;
• a TextView component;
• a horizontal linearlayout component;
• Two button components;

Then we add the properties of the space based on the source code, the specific properties such as

<linearlayout

Android:layout_width= "Match_parent"

android:layout_height= "Match_parent"

android:gravity= "Center"

android:orientation= "Vertical"

Xmlns:android= "Http://schemas.android.com/apk/res/android" >

<textview

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

Android:padding= "24DP"

android:text= "@string/question_text"/>

<linearlayout

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

android:orientation= "Horizontal" >

<button

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

android:text= "@string/true_button"

Android:id= "@+id/button"

android:layout_gravity= "Center_horizontal"/>

<button

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

android:text= "@string/false_button"

Android:id= "@+id/button2"/>

</LinearLayout>

</LinearLayout>

Of course, we can also add properties like this

For example, select the vertical linearlayout and then in the property interface can see such as interface, we add 4 attributes, Layout:width for Match_parent, layoutheight for Match_parent, Orientation for vertical, gravity as center.

Other space please follow the settings in the code, or directly copy the code to overwrite the activity_quiz.xml in Res->layout

The XML hierarchy diagram is as follows:

The 5 components in preview API 17:android 4.2.2 are as follows

At this point, you may find that the interface is different from what I'm showing, such as TextView, which is not what it looks like, like this:

The reason for this is that we changed the code to Values->strings.xml.

<resources>

<string name= "App_name" >GeoQuiz</string>

<string name= "Action_settings" >Settings</string>

<string name= "Question_text" > Question: Constantinople is the largest city in turkey.</string>

<string name= "True_button" >True</string>

<string name= "False_button" >False</string>

</resources>

After this change, the interface is normal. At this point, a basic UI comes out. This intermediate design to the control's properties and the problem of the resource file. These can be put in place, followed by a slow analysis of the meaning of these attributes and resource files.

If you are already familiar with the properties of the component, you can skip

Some common properties of components

1. Android:layout_width and Android:layout_height Properties

This represents the width and height properties of the component. To accommodate the display of mobile devices, they are usually set to one of the following two attribute values

Match_parent: The view is the same size as its parent view.

Wrap_content: The view automatically resizes according to its content.

The root element linearlayout is a root element, but it also has a parent view, which is the entire view hierarchy that Android provides to accommodate the app.

1. Android:orientation Property

This property determines whether the linearlayout is placed horizontally or vertically. When vertically placed, the first defined subassembly appears at the top of the screen. In horizontal linearlayout, the first defined subassembly appears at the leftmost end of the screen.

(Here the book mentions a special case, first pretended not to see, and so on. ）

1. Android:text Property

The TextView and button components have the Android:text property. This property specifies the text content displayed by the component. In this example, the Android:text property value is not a string literal, but rather a reference to a string resource (string resources). Of course, you can also set android:text= ' True ' directly, but this is not a good method. Examples are not recommended, the actual is not recommended, the future to localize more trouble ah.

Create the first example of the Geoquiz code section

This application needs to be done by clicking the True or False button to get a response. In order to bind the button to the event, we want to do the following things:

1. Give each button an ID.

<button

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

android:text= "@string/true_button"

Android:id= "@+id/true_button"

android:layout_gravity= "Center_horizontal"/>

<button

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

android:text= "@string/false_button"

Android:id= "@+id/false_button"/>

@+id/true_button True_button is the ID.

@+id/false_button False_button is the ID.

In fact, I am a little puzzled here why this ID to write so, but also irrelevant to the DA, so write it. Just remember, yes.

1. referencing components

Define the variable of the button first in quizactivity

Private Button Mtruebutton;

Private Button Mfalsebutton;

Then assign the component to the variable in OnCreate

Mtruebutton = (Button) Findviewbyid (R.id.true_button);

Mfalsebutton = (Button) Findviewbyid (R.id.false_button);

Here we can also understand why the previous ID was so written.

1. Setting up listeners

Mtruebutton = (Button) Findviewbyid (R.id.true_button);

Mtruebutton.setonclicklistener (New View.onclicklistener ()

{

@Override

public void OnClick (View v)

{

The code for the event is written here

}

});

Mfalsebutton = (Button) Findviewbyid (R.id.false_button);

Mfalsebutton.setonclicklistener (New View.onclicklistener ()

{

@Override

public void OnClick (View v)

{

The code for the event is written here

}

});

Here, the event monitoring is done, as to the code of the event how to write, that is the latter thing. In the example, a toast is made.

Response to completion code

1. We first add the corresponding post-reaction information.

Add the following code to the Values->strings.xml

<string name= "Correct_toast" >Correct!</string>

<string name= "Incorrect_toast" >Incorrect!</string>

1. Write the response code in the listener.

Mtruebutton = (Button) Findviewbyid (R.id.true_button);

Mtruebutton.setonclicklistener (New View.onclicklistener ()

{

@Override

public void OnClick (View v)

{

The code of the event is written here;

Toast.maketext (Quizactivity.this,r.string.correct_toast,toast.length_short). Show ();

}

});

Mfalsebutton = (Button) Findviewbyid (R.id.false_button);

Mfalsebutton.setonclicklistener (New View.onclicklistener ()

{

@Override

public void OnClick (View v)

{

The code for the event is written here

Toast.maketext (Quizactivity.this,r.string.incorrect_toast,toast.length_short). Show ();

}

});

The code after adding the event is shown above. Then click Run->app

Clicking the True button will display the screen correct!

Summary:

Some doubts. From the beginning to the present, I have only done 2 things in the development environment, installed Java and installed Android Studio, I did not set environment variables such as Java_home. The SDK is created at the time of the choice of 4.2 and do not know the line can not be changed in the future? And I didn't find R.java, but I can use this with r.id or r.string, which is a lot different from ADT.

An authoritative guide for Android Programming-Reading notes (ii)-The first small program