经过前面的基础学习，下面来学习一个稍微复杂一点点的页面编辑吧。
登录页面在很多地方都用得到，例如学校的各类网站、app的账户登录等等。
所以，我们一起来学习如何设计吧！
按照第一个案例新建工程Demo3
登录界面如图所示，需要用到TextView、Button、EditText三个控件：
1、TextView控件
TextView控件用于界面显示一段文本信息。下面展示该控件的用法，修改工程中Activity_main.xml文件：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="你好呀!"/>
</LinearLayout>运行结果如下：
在线性布局中添加TextView控件，设置其所占宽度、高度、排列方式等，参数可以根据上一篇博客提到的布局进行更改哦！
2、Button控件
Butto控件，也就是我们常说的按钮，是程序与用户交互非常重要的一个 控件。Button控件的属性与TextView差不多（在Activity_main.xml文件中编辑）。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...
<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1"/>
<Button
android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAllCaps="false"
android:text="button2"/>
</LinearLayout>运行结果如图：
接下来为Button的点击事件注册一个监听器（在MainActivity.java文件中编辑）：
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button btn1=findViewById(R.id.btn1);
btn1.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View v){
//在此添加按钮1点击处理
//例如弹出一个短暂停留的通知框Toast
Toast.makeText(MainActivity.this,"我是Button1",Toast.LENGTH_SHORT).show();
}
});
Button btn2 =findViewById(R.id.btn2);
btn2.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View v){
//在此添加按钮1点击处理
Toast.makeText(MainActivity.this,"我是Button2",Toast.LENGTH_SHORT).show();
}
});
}
}结果显示如下：
上面代码会报一些包的错误，原因是因为没有导入相应的包，在软件中设置自动导包：点击file-setting，并配置如图所示，点击OK即可：
3、EditText控件
EditText控件即输入框，允许用户在控件里输入和编辑内容。其中android：hint属性可以设置EditText控件输入的提示文字（在Activity_main.xml文件中编辑）。
<Linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...
<EditText
android:id="@+id/et"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="请输入内容"/>
</LinearLayout>
另外若是不想换行输入，要单行输入则在android:hint="请输入内容"前面添加android:maxLines="1"即可结果显示：
案例实现
要求：登录界而主要可以分为三个部分,第一个部分为文本信息“登录界面”第二部分为账“号密码输人区，第三部分为登录按钮；
思路：
(1) 整个布局使用线性布局，排列方向为vertical垂直排列。
(2)添加一个TextView,设置字体大小为30sp.字体颜色为井00字体内容为“登录界面”,字体居中显示。
(3)添加一个水平的分割线。
(4)添加一个线性布局，排列方向为horizontal水平排列。该子布局内添加一一个TextView显示“账号:”，接着添加一个EditText 用于输人账号，使用android: hint设置提示文字。接着在线性布局上添加属性android : layout marginLeft 设置左边距，添加属android:layout_marginRight设置右边距。同理，继续添加一个线性布局用来显示密码和输入密码。
(5)添加一个按钮,其宽度占满，高度适配。
(6)为了让第二部分的内容能够在第一 部分和第三部分的中间，在第二部分的上面和下面分别添加一个View控件，高度比重为1,用于占位。
代码实现如下：
1、在layout目录下新建layout_login.xml文件，编辑如下代码：
<LinearLayout xmlns:android="http:schemas:android.com/apk/res/android"
android:layout_width="match_ parent"
android:layout_height="match_ parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="登录界面"
android:textColor="#0000ff"
android:textSize="30sp"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#ffff00"/>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="账号:"/>
<EditText
android:id="@+id/etUserName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="请输入账号"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="密码:"/>
<EditText
android:id="@+id/etPassword"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="请输入密码"
android:inputType="textPassword"
android:maxLines="1"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<Button
android:id="@+id/btnLogin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:layout_marginBottom="50dp"
android:text="登录"/>
</LinearLayout>2、修改MainActivity. java中的onCreate() 方法的语句为setContentView(R.layout. layout_ login) ,并且在onCreate中绑定按钮和输人框。注册按钮的事件监听器，对按钮点击进行处理，具体代码如下所示:
public class MainActivity extends AppCompatActivity implements View.OnC1ickListener{
//账号输人框
private EditText etUserName;
//密码输人框
private EditText etPassword;
//登录按钮
private Button btnLogin;
@Override
protected void onCreate(Bundle savedInstanceState){
super. onCreate(savedInstanceState);
setContentView(R. layout. layout_ login);
//绑定布局中的控件
btnLogin=findViewById(R.id.btnLogin);
etUserName=findViewById(R.id.etUserName);
etPassmord= findViewById(R.id.etPassword);
为按钮注册事件监听器
btnLogin. setOnClickListener(this);
}
@Override
public void onClick(View v){
switch(v.getId()){
case R.id.btnLogin:
//获取输人的账号
String userName=etUserName.getText().toString();
//获取输人的密码
String password=etPassword.getText().toString();
Toast.makeText(this,"账号是" + userName +"，密码是"+password,Toast.tENGTH_SHORT).show( );
break;
defaalt:
break;
}
}
}运行结果如下：
到此登录页面的案例就完成啦！ 这是结合前面学到的布局、简单控件的一个综合性小案例！
