安卓开发：UI组件-Button和EditText

2.3Button

Button继承自TextView，除了通过属性设置按钮样式，还可以通过绑定drawable文件的方式来实现不同样式。

2.3.1按钮样式

新建Activity：ButtonActivity，添加Layout视图：activity_button.xml.

activity_button.xml：

 <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:padding="15dp">
     <Button
         android:id="@+id/btn_1"
         android:layout_width="match_parent"
         android:layout_height="40dp"
         android:text="普通按钮"
         android:textSize="20sp"
         android:textColor="#ffffff"
         android:background="#000000"
         android:layout_marginTop="10dp"/>
     <Button
         android:id="@+id/btn_2"
         android:layout_width="match_parent"
         android:layout_height="40dp"
         android:text="圆角按钮"
         android:textSize="20sp"
         android:textColor="#ffffff"
         android:background="@drawable/bg_btn1"
         android:layout_below="@id/btn_1"
         android:layout_marginTop="10dp"/>
     <Button
         android:id="@+id/btn_3"
         android:layout_width="357dp"
         android:layout_height="wrap_content"
         android:layout_below="@+id/btn_2"
         android:layout_marginTop="10dp"
         android:background="@drawable/bg_btn2"
         android:text="描边按钮"
         android:textColor="#ff9900"
         android:textSize="20sp" />
     <Button
         android:id="@+id/btn_4"
         android:layout_width="357dp"
         android:layout_height="wrap_content"
         android:layout_below="@+id/btn_3"
         android:layout_marginTop="10dp"
         android:background="@drawable/bg_btn3"
         android:text="按压效果"
         android:textColor="#ffffff"
         android:textSize="20sp" />

 </RelativeLayout>

通过如下方式添加drawable文件（复制粘贴普通xml文件由于路径不同会导致引用出现问题）：

bg_btn1.xml（圆角按钮）

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid
    android:color="#ff9900"/>
<corners
    android:radius="50dp"/>
</shape>

bg_btn2.xml（描边按钮）

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <stroke
        android:width="1dp"
        android:color="#ff9900"/>
    <corners
        android:radius="15dp"/>
</shape>

bg_btn3.xml（按压效果）

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape>
            <solid android:color="#DBA047"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
    <item android:state_pressed="false">
        <shape>
            <solid android:color="#FF9900"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
</selector>

2.3.2点击事件

在Layout文件的32行做如下改动，绑定showToast事件：

         android:text="描边按钮+点击1"
33         android:onClick="showToast"

来到Activity文件为此事件进行详细描述：

public void showToast(View view){
        Toast.makeText(this,"btn3",Toast.LENGTH_SHORT).show();
    }

或者也可以使用第二种方法实现点击，修改Layout文件42行为：

 android:text="按压效果+点击2"

因为此点击事件绑定了按钮4，btn4，来到Activity文件定义私有变量mBtn4，完善事件描述：

private Button mBtn4;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_button);
        mBtn4 = findViewById(R.id.btn_4);
        mBtn4.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(ButtonActivity.this,"btn4",Toast.LENGTH_SHORT).show();
            }
        });
    }

最后效果：

2.4EditText

同Button一样，继承自TextView。接下来通过制作一个登录界面的方式来学习。

打开MainActivity增加私有控件mBtnEditText：

private Button mBtnEditText;

在onCreate里补全内容，绑定EditTextActivit，跳转至activity_edit_text.xml。

mBtnEditText = findViewById(R.id.btn_edittext);
        mBtnEditText.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v) {
                //跳转到EditText演示界面
                Intent intent = new Intent(MainActivity.this,EditTextActivity.class);
                startActivity(intent);

            }
        });

同时，在首页增加一个导向此页面的按钮：

<Button
        android:id="@+id/btn_edittext"
        android:layout_width="match_parent"
        android:layout_height="61dp"
        android:text="EditText"
        android:textAllCaps="false"/> //加了一个属性：默认不全显示大写

activity_edit_text.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="15dp">

    <EditText
        android:id="@+id/et_1"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="19dp"
        android:background="@drawable/bg_username" //新建Drawable resourse file，给文字处设置一个圆角线框。
        android:hint="手机号" //添加导引文字。
        android:inputType="number" //此处说明了输入内容的类型，由于是手机号，所以默认为数字（见效果图），还有其他效果，可以自己尝试
        android:paddingLeft="10dp" //图标左侧与边框的距离。
        android:textColor="#000000"
        android:textSize="16sp"
        android:drawableLeft="@drawable/icon_user" //在“手机号”前加一个小图标。
        android:drawablePadding="8dp" //设置图标与文字之间的间距。
        android:maxLines="1"/> //设置最大行数。
    <EditText
        android:id="@+id/et_2"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:textSize="16sp"
        android:textColor="#000000"
        android:hint="密码"
        android:inputType="textPassword" //同样，设置输入内容的类型为密码，所以输入完成后为暗文（见效果图）
        android:layout_below="@id/et_1"
        android:layout_marginTop="15dp"
        android:background="@drawable/bg_username"
        android:paddingLeft="10dp"
        android:drawableLeft="@drawable/icon_psw"
        android:drawablePadding="8dp"
        android:maxLines="1" />
    <Button
        android:id="@+id/btn_login"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_below="@id/et_2"
        android:layout_marginTop="40dp"
        android:background="@drawable/bg_login"
        android:textColor="#fff"
        android:text="登录"
        android:textSize="18sp"/>

</RelativeLayout>

最后，在EditTextActivity为”登录“按钮添加绑定的点击事件。

增加私有控件：

private Button mBtnLogin;

完善信息：

mBtnLogin = findViewById(R.id.btn_login);
        mBtnLogin.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(EditTextActivity.this,"登录成功！",Toast.LENGTH_SHORT).show();
            }
        });

效果图：

在手机号一行默认输入数字；密码为暗文；点击登录后跳出登录成功的提示。