Android组件之Button

概述

Button 是按钮，主要用来给用户点击触发一些事件的。例如点击后跳转到另外一个页面，例如点击删除按钮时弹出一个确认框以确认用户是否删除。

在xml布局中定义Button

<Button
    android:id="@+id/my_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="点击我" />

在Activity中获取Button

Button myButton = findViewById(R.id.my_button);

样式设置

在xml中进行设置

    <Button
        <!-- id，在该xml文件中唯一标识该组件，不可与其他组件id重名，在Java代码中通过该id来获取该组件 -->
        android:id="@+id/my_button"
        <!-- 按钮宽度 -->
        android:layout_width="wrap_content"
        <!-- 按钮高度 -->
        android:layout_height="wrap_content"
        <!-- 文本颜色 -->
        android:textColor="#FF0000"
        <!-- 文本大小 -->
        android:textSize="20sp"
        <!-- 文本样式：bold(粗体)/italic(斜体)/normal(常规) -->
        android:textStyle="bold"
        <!-- 字体 -->
        android:fontFamily="sans-serif"
        <!-- 按钮文本内容 -->
        android:text="点击我"
        <!-- 内边距 -->
        android:padding="12dp"
        <!-- 外边距 -->
        android:layout_margin="8dp"
        <!-- 直接设置背景颜色值 -->
        android:background="#FF4081"
        <!-- 设置左侧图标 -->
        android:drawableLeft="@drawable/img"
    />

效果如图：

在Java中实现

public class MainActivity extends AppCompatActivity {

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

        // 获取Button组件
        Button myButton = findViewById(R.id.my_button);

        // 给按钮设置一些样式
        // 设置文本颜色
        myButton.setTextColor(Color.parseColor("#FF0000"));
        // 设置文本大小
        myButton.setTextSize(20);
        // 设置文本样式：bold(粗体)/italic(斜体)/normal(常规)
        myButton.setTypeface(Typeface.defaultFromStyle(Typeface.BOLD));
        // 设置按钮文本内容
        myButton.setText("点击我");
        // 设置字体
        myButton.setTypeface(ResourcesCompat.getFont(this, R.font.my_custom_font));
        // 设置内边距
        myButton.setPadding(dpToPx(50), dpToPx(20), dpToPx(50), dpToPx(20));
        // 设置外边距
        ViewGroup.MarginLayoutParams params = (ViewGroup.MarginLayoutParams) myButton.getLayoutParams();
        params.setMargins(dpToPx(50), dpToPx(20), dpToPx(20), dpToPx(20)); // 左、上、右、下
        myButton.setLayoutParams(params);
        // 设置背景色
        myButton.setBackgroundColor(Color.parseColor("#000000"));
        // 设置左侧图标，设置图标（左、上、右、下，未设置的方向传null）
        myButton.setCompoundDrawablesWithIntrinsicBounds(
                ContextCompat.getDrawable(this, R.drawable.img),  // 左侧图标
                null,      // 上方图标
                null,      // 右侧图标
                null       // 下方图标
        );
    }

    // 将 dp 转换为像素
    public int dpToPx(int dp) {
        float density = getResources().getDisplayMetrics().density;
        return (int) (dp * density + 0.5f); // 四舍五入
    }
}

效果如图：

其他设置

在xml中进行设置

<!-- 禁用或启用按钮，true标识启用，false表示禁用 -->
android:enabled="true"
<!-- 设置组件是否可见，visible表示可见，invisible表示不可见并且组件保留空间，gone表示不可见且组件不占据空间 -->
android:visibility="visible"
<!-- 图片作为按钮背景 -->
android:background="@drawable/img"

在Java中实现

// 禁用按钮
myButton.setEnabled(false);  
// 设置组件是否可见
myButton.setVisibility(View.VISIBLE);
// 图片作为背景
myButton.setBackgroundResource(R.drawable.img);

圆角按钮

首先在创建 res/drawable/rounded_button.xml，内容如下：

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="24dp" />  <!-- 圆角半径 -->
    <solid android:color="#FF4081" />  <!-- 背景色 -->
</shape>

接着在xml文件中应用样式：

android:background="@drawable/rounded_button"

在Java中设置代码如下：

// 设置圆角按钮
myButton.setBackgroundResource(R.drawable.rounded_button);

注：如果遇上设置圆角按钮背景色不生效的情况，可以把<Button改为<android.widget.Button，如下：

    <android.widget.Button
        android:id="@+id/my_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/rounded_button"
        android:text="点击我" />

效果如下：

事件

单击事件

方式一，直接注册使用匿名内部类：

public class MainActivity extends AppCompatActivity {

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

        // 获取Button组件
        Button myButton = findViewById(R.id.my_button);
        // 为按钮注册点击事件
        myButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 实现单击事件的逻辑
                // 例如，给出一个提示
                Toast.makeText(getApplicationContext(), "你点击了我！", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

方式二，通过实现View.OnClickListener：

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

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

        // 获取Button组件
        Button myButton = findViewById(R.id.my_button);
        // 为按钮注册点击事件
        myButton.setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        if (view.getId() == R.id.my_button) {
            // 实现单击事件的逻辑，例如，给出一个提示
            Toast.makeText(getApplicationContext(), "你点击了我！", Toast.LENGTH_SHORT).show();
        }
    }
}

效果如图：

长按事件

实现代码如下：

        // 为按钮注册长按事件，即鼠标按住按钮不动
        myButton.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View view) {
                // 写事件逻辑
                Toast.makeText(getApplicationContext(), "你长按了我哟", Toast.LENGTH_SHORT).show();
                return false;
            }
        });

完整实例

xml代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/my_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:background="#FF4081"
        android:drawableLeft="@drawable/img"
        android:fontFamily="sans-serif"
        android:padding="12dp"
        android:text="点击我"
        android:textColor="#FF0000"
        android:textSize="20sp"
        android:textStyle="bold" />
</LinearLayout>

java 代码如下：

public class MainActivity extends AppCompatActivity {

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

        // 获取Button组件
        Button myButton = findViewById(R.id.my_button);
        // 为按钮注册点击事件
        myButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 实现单击事件的逻辑
                // 例如，给出一个提示
                Toast.makeText(getApplicationContext(), "你点击了我！", Toast.LENGTH_SHORT).show();
            }
        });

        // 为按钮注册长按事件，即鼠标按住按钮不动
        myButton.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View view) {
                // 写事件逻辑
                Toast.makeText(getApplicationContext(), "你长按了我哟", Toast.LENGTH_SHORT).show();
                return false;
            }
        });
    }
}

效果如图：