Android,第一个APP

新建项目

打开Android Studio,如果你还没打开的话。然后File->New->New Project在新出现的New Project界面中:

Android,第一个APP_第1张图片
new_project.png

  • Application name中输入应用的名称。我们的这个应用就叫“Yo”。
  • Company Domain里输入“31day.com”。这个company domain就是公司域名,我们暂时就以这个系列为名称。
  • Project name里会出现com.a31day.yo。这个是可以编辑的,在这个名称的后面有一个Edit按钮。点击之后可以进入编辑状态。
  • Project location修改我们要创建的项目的位置,一般来说默认的就可以。
    以上的内容全部填写完成之后,点击Next

Android,第一个APP_第2张图片
target_android_devices.png

在这个界面中主要选择的是项目所需要支持的设备,如 Phone and Tablet就是手机和平板。在下面的依次还可以选择 Wear手表, TV电视等。

我们选择的是手机和平板。在这个项目下有一个Minimum SDK。这个是项目最小支持哪个版本的系统。我们这里选择API 21: Android 5.0 (Lollipop)。现在大多数的手机都可以支持到Android 5.0了。

之后继续Next

Android,第一个APP_第3张图片
add_activity.png

在这个界面中选择给应用添加的Activity类型。我们只选择 Empty Activity。之后 Next

Android,第一个APP_第4张图片
np_customize_activity.png

在这个界面中指定 Activity的名称和这个 Activity需要使用的 Layout(布局)的名称。这里什么都不需要做,可以直接 Next。额,应该是 Finish了。到此,创建新项目所需要的初期设定全部完成。下面就开始写代码吧。

编写代码

Android,第一个APP_第5张图片
begin coding

在正式开始编写代码以前,这是你会看到的界面。点击屏幕最上的绿色三角形按钮,AVD会运行起来,并且我们的应用也会在这个AVD中运行起来。


Android,第一个APP_第6张图片
avd

现在的APP还太简单,只是一个Hello World!离我们需要的功能还差的多。现在就开始编写代码,添加我们需要的功能。

布局

我们在创建项目的时候就已经设定了布局文件的名称activity_main.xml。这个文件在app/res/layout目录下。双击打开。

Android,第一个APP_第7张图片
linearlayout

双击之后显示的是布局的XML布局文件的原始形态。此处注意左下角括住的两个按钮: DesignText。分别是图形设计和文本。图形设计可以用拖拽的方式来设置布局,文本的方式是直接手写XML节点来编辑布局。右上角括住的是预览。编辑布局之后可以在预览中查看布局的效果。 本教程主要是用文本的方式编辑布局。因为图形拖拽的方式虽然看起来很不错,但是由于Android Studio支持的比较有限,所以在稍后复杂一点的时候还是要回到文本编辑布局的方式。

在布局中的TextView是一个展示只读文本的视图。Android中接受用户输入,展示文本和用户可以点击的按钮等都叫做视图。在第二行可以看到LinearLayout,这个是用来存放各种视图的容器。但是Android Studio默认生成的不是这个布局容器。我们需要手动修改为LinearLayout,并参照上图添加一下内容:android:orientation="vertical"。这句的意思就是保证在这个布局容器的视图全部是按照添加的顺序竖直向下依次排列的。稍后会有详细的介绍。这里不做深究。

以上都好了以后就可以添加我们需要的视图了。首先,我们需要一个可以让用户输入名字的视图。EditText就是专门负责接收用户输入的内容的。

TextView的下面键入以下内容:

    
  • android:id, 这个后面java代码用来关联视图的唯一字符串。名字随便起,但是为了容易辨认我们用前面是作用(输入用户名的)后面是视图名称,中间是下划线的组成方式。
  • android:layout_width,视图的宽度,必须要写。否则报错。"match_parent"是指和LinearLayout一样宽。
  • android:layout_height 视图的高度,必填。"wrap_content"是指高度仅限包裹内容。
  • android:hint,输入的时候的提示。

接下来需要一个按钮,点击之后可以在“hello world”的TextView里输出“Yo 谁谁谁”的字符串。

添加按钮:

    
  • android:id,和上文一个意思。
  • android:layout_width,同上。
  • android:layout_height,同上。
  • android:text,是按钮上显示的文本内容。

打开Preview(预览),可以看到我们添加的视图都已经按照自上而下的顺序显示了出来。

Android,第一个APP_第8张图片
Preview 预览

让视图动起来

视图都有了,下过的米都有了。下面就来添加Java代码,让这些视图动起来。

app/java/com.a31day.yo中找到activity文件。双击打开。现在代码是这样的:

public class MainActivity extends AppCompatActivity {

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

要让视图联动,势必先找到要用到的视图。在setContentView(R.layout.activity_main);后面敲回车,准备键入我们查找视图的代码。

首先找到“Yo”按钮:


public class MainActivity extends AppCompatActivity {

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

        Button yoButton = (Button) findViewById(R.id.enter_button);
    }
}

方法findViewById就是专门用来找布局中的视图的。我们在布局中添加按钮的时候的android:id="@+id/enter_button"就指定了按钮视图的id为* enter_button找到视图之后得到的是最原始的视图类型,所以需要强制的转化为我们需要的特定类型的视图类型,比如按钮和下面的EditText。*
下面再找到输入用的视图:

EditText nameEditText = (EditText) findViewById(R.id.username_edittext);

现在输入用的和点击用的视图都有了。由于输入的内容我们只需要取出来就可以,所以不需要复杂的处理。这里开始处理按钮视图的点击功能。

    yoButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            // 这里添加点击的处理代码
        }
    });

// 这里添加点击的处理代码替换成我们获取用户输入的内容的代码:

yoButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        String inputString = nameEditText.getText().toString();
    }
});

似乎忘了一件事吧。可以输入,可以点击说“Yo”了。怎么输入呢?说好的用“hello world”的TextView来显示Yo的内容的呢?这个当做一个零时的问题,有你来处理。

  1. 在布局文件中给TextView添加id
  2. MainActivity类中添加查找这个视图的代码。

只是一个小问题,这里给出答案:
布局:

    

代码:

TextView yoTextView = (TextView) findViewById(R.id.yo_textview);

那么我们就可以输出我们需要的内容了。

yoButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        String inputString = nameEditText.getText().toString();
        yoTextView.setText("Yo " + inputString);
    }
});

运行起来看一下吧。


Android,第一个APP_第9张图片

完整代码




    

    

    

java代码:

package com.a31day.yo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

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

        Button yoButton = (Button) findViewById(R.id.enter_button);
        final EditText nameEditText = (EditText) findViewById(R.id.username_edittext);
        final TextView yoTextView = (TextView) findViewById(R.id.yo_textview);

        yoButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String inputString = nameEditText.getText().toString();
                yoTextView.setText("Yo " + inputString);
            }
        });
    }
}

你可能感兴趣的:(Android,第一个APP)