Android开发之简单登录界面

用户界面基础

• Android系统的四大组件分别是活动(Activity)、服务(Service)、广播接收器(Broadcast Receiver)、内容提供器(Content Provider)。
  其中，活动算是一个程序的门面，活动通过onCreate()方法来对用户界面(UI)进行初始化。而用户界面的创建则分为静态和动态两种方式：

1. 静态方式即以XML布局文件来定义用户界面，通过XML布局文件中的相关属性进行控制，我将使用这种方式来实现简单的登录界面。
2. 动态方式是指通过Java代码来开发用户界面，动态地控制界面中的组件。我没有尝试过这种开发方式。

• Android项目工程的结构：

  
  Android项目工程结构

• 补充：

1. 其中java文件夹下存储有主活动文件MainActivty.java。
2. layout文件夹下存储有布局文件activity_main.xml。

简单登录界面的实现

• 准备完成的功能：

1. 界面包含两个编辑框，一个用于输入用户名；一个用于输入密码。
2. 点击登录按钮，若用户名和密码均和点击登录按钮方法中定义的相同，则显示登录成功的提示框，若不同，则提示登录失败。

• 按照要求，实现两个输入框，这里我们就需要在XML文件中进行布局，使用EditText控件进行设置。
  XML布局代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_height="match_parent"
    android:layout_width="match_parent">

    <TextView
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="用户登录界面"
        android:textAlignment="center"
        android:textSize="24sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="用户名"
        android:textAlignment="center"
        android:textSize="24sp" />

    <EditText
        android:id="@+id/username"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入您的用户名"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="密码"
        android:textAlignment="center"
        android:textSize="24sp" />

    <EditText
        android:id="@+id/password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入您的密码"/>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_height="match_parent"
    android:layout_width="match_parent">

    <Button
        android:id="@+id/login"
        android:layout_height="60dp"
        android:layout_width="wrap_content"
        android:text="登录"
        android:layout_gravity="center"
        android:textAlignment="center"
        android:textSize="18sp" />

</LinearLayout>


</LinearLayout>

• 效果如下：

  
  登录界面
• 补充：

1. LinearLayout代表当前布局方式为线性布局。
2. TextView为显示字符串的控件，例如界面上的“用户登录界面”、“用户名”、“密码”就是用TextView实现的。
3. Button为按钮控件，即为用户界面添加一个可供点击的按钮，并可在主活动中添加相应的方法实现点击按钮后要进行的操作。

• 接下来我们开始编写活动页面的代码，完成点击按钮后的匹配用户名和密码的操作。

1. 为获取到的Button对象绑定一个监听器button.setOnClickListener()。
2. 使用接口方式实现监听事件。
3. 最后在onClick()方法中实现监听事件要实现的逻辑即可。
   代码如下：

public class MainActivity extends AppCompatActivity implements View.OnClickListener{
    Button button;
    EditText username;
    EditText password;

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

        button = (Button)findViewById(R.id.login);
        username = (EditText)findViewById(R.id.username);
        password = (EditText)findViewById(R.id.password);
        button.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        String username1 = username.getText().toString();
        String password1 = password.getText().toString();
        String ok = "登录成功";
        String fail = "登录失败";
        if (username1.equals("lhk") && password1.equals("123456")) {
            Toast.makeText(MainActivity.this,ok,Toast.LENGTH_SHORT).show();
        }else {
            Toast.makeText(MainActivity.this,fail,Toast.LENGTH_SHORT).show();
        }

    }
}

• 登陆成功效果如下：

  
  登陆成功

• 登录失败效果如下：

  
  登录失败

Github地址

• 活动页面代码https://github.com/0xmxhnc/LoginTestDemo/blob/master/app/src/main/java/com/example/test/MainActivity.java
• 布局页面代码https://github.com/0xmxhnc/LoginTestDemo/blob/master/app/src/main/res/layout/activity_main.xml