【Android】常见控件及使用

视图的设置

控件与布局都继承于视图，因此视图的设置方式对其作用都是一样的，接下来就先讲述视图的不同设置方式

设置视图的宽高：

对视图的宽高进行设置，首先确保XML中的宽高属性值为wrap_content，接着打开该页面对应的Java代码，执行以下步骤：

1. 调用控件对象的getLayoutParams方法，获取该控件的布局参数
2. 布局参数的width属性表示宽度，height属性表示高度，修改这两个属性值
3. 调用控件对象的setLayoutParams方法，填入修改后的布局参数使之生效

设置视图的间距：

1. 采用layout_margin属性，它指定了当前视图与周围平级视图之间的距离。包括layout_margin、layout_marginLeft、layout_marginRight、layout_marginTop、layout_marginBottom
2. 采用padding属性，它指定了当前视图与内部下级视图之间的距离。包括padding、paddingLeft、paddingRight、paddingTop、paddingBottom

设置视图的对齐方式：

1. 采用layout_gravity属性，它指定了当前视图相对于上级视图的对齐方式
2. 采用gravity属性，它指定了下级视图相对于当前视图的对齐方式

二者的取值包括：left、right、top、bottom，还可以用竖线连接各取值，例如”left|top“，朝左上角对齐

TextView

1. 作用：主要用于在界面上显示一些文本信息，默认是居左上角对齐

2. 设置文本大小的方法：

   • 在Java代码当中使用setTextSize方法，即可指定文本的大小
   • 在XML文件中通过android：textSize指定文本的大小，此时需要指定字号单位

   px：它使手机屏幕的最小显示单位，与设备的显示屏有关

   dp：它是与设备无关的显示单位，只与屏幕的尺寸有关

   sp：它专门用来设置字体的大小，在系统设置中可以调节字体的大小

3. 设置文本的颜色：

   • 在Java代码中调用setTextColor方法即可设置文本的颜色，集体色值可从Color类取
   • 在XML文件中则通过属性android:textColor指定文本颜色，色值由透明度alpha和RGB三原色（红、绿、蓝）联合定义。色值有八位十六进制数与六位十六进制数两种表达方式，例如八位编码FFEEDDCC中：FF表示透明度（FF表示完全不透明，00表示完全透明）、EEDDCC分别表示三原色的浓度（RGB三色的数值越大，表示颜色越浓，也越亮）

Button

1. 作用：继承于TextView，是一个按钮，可以写对应的方法，使按下这个按钮从而执行我们想要他执行的操作

2. 与TextView的区别：

   • Button具有默认的按钮背景，而TextView默认无背景

   • Button的内部文本默认居中对齐，而TextView的内部文本默认靠左对

   • Button会默认将英文字母转成大写，而TextView保持原本的英文大小写

3. 与TextView相比新增了两个属性

   • textAllCaps属性：它制定了是否将英文字母转成大写，为true代表自动转成大写，为false表示不做大写转换，一般没有声明默认为true
   • onClick属性：它用来接管用户的点击动作，指定了点击按钮时要触发那个方法，但对于现在已经过时，我们一般在Java活动代码里写

4. 点击事件和长按事件:

   监听器：意思是专门监听控件的动作行为。只有控件发生了指定的动作，监听器才会触发开关去执行对应的代码逻辑

   按钮控件的两种常用的监听器：

   • 点击监听器：通过setOnClickListener方法设置，按钮被按住少于500毫秒时，会触发点击事件
   • 长按监听器：通过setOnLongClickListener方法设置，按钮被按住超过500毫秒时，会触发长按事件

5. 按钮的禁用与恢复

   不可用按钮：按钮不允许点击，即使点击也无任何反应，同时按钮文字颜色为黑色

   可用按钮：按钮允许点击，点击按钮会触发点击事件，同时按钮文字为正常的黑色

   是否允许点击由enabled属性控制，属性值为true表示允许点击，为false表示不允许点击

6. 示例：

   主活动的代码：

   public class MainActivity extends AppCompatActivity {
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           EdgeToEdge.enable(this);
           setContentView(R.layout.activity_main);
           ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main), (v, insets) -> {
               Insets systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars());
               v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom);
               return insets;
           });
   
           Button buttonshort = (Button) findViewById(R.id.Button_short);
           Button buttonlong = (Button) findViewById(R.id.Button_long);
   
           //点击事件
           buttonshort.setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View v) {
                   Toast.makeText(MainActivity.this,"你点击了点击事件的按钮", Toast.LENGTH_SHORT).show();
               }
           });
   
           //长按点击事件
           buttonlong.setOnLongClickListener(new View.OnLongClickListener() {
               @Override
               public boolean onLongClick(View v) {
                   Toast.makeText(MainActivity.this, "你长按了这个按钮", Toast.LENGTH_LONG).show();
   
                   return true;
               }
           });
   
           Button buttonopen = (Button) findViewById(R.id.open);
           Button buttonclose = (Button) findViewById(R.id.close);
           Button button3 = (Button) findViewById(R.id.Button_3);
   
           //对按钮3进行打开，使其可以使用
           buttonopen.setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View v) {
                   if (button3.isEnabled() == false) {
                       button3.setEnabled(true);
                   }
               }
           });
   
           //对按钮3进行禁用
           buttonclose.setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View v) {
                   if (button3.isEnabled() == true) {
                       button3.setEnabled(false);
                   }
               }
           });
       }
   }
   

   布局文件代码：

   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:app="http://schemas.android.com/apk/res-auto"
       xmlns:tools="http://schemas.android.com/tools"
       android:id="@+id/main"
       android:orientation="vertical"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       tools:context=".MainActivity">
   
       <TextView
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:id="@+id/Textview"
           android:textColor="#00ff00"
           android:text="This is TextView"/>
   
       <Button
           android:id="@+id/Button_short"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:text="short"
           android:textAllCaps="false" />
   
       <Button
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:id="@+id/Button_long"
           android:text="long"/>
   
       <LinearLayout
           android:layout_width="match_parent"
           android:orientation="horizontal"
           android:layout_height="40sp">
   
   
       <Button
           android:id="@+id/open"
           android:layout_width="0dp"
           android:layout_height="wrap_content"
           android:layout_weight="1"
           android:text="启动测试按钮" />
   
           <Button
               android:layout_width="0dp"
               android:layout_height="wrap_content"
               android:layout_weight="1"
               android:id="@+id/close"
               android:text="禁用测试按钮"/>
   
       </LinearLayout>
   
       <Button
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:id="@+id/Button_3"
           android:enabled="false"
           android:text="Button3"/>
   
   </LinearLayout>
   

   运行之后页面：

   

   都是与屏幕同样的宽度，TextView的文字时靠左对齐，而Button中的文字都是居中对齐，对于short按钮我们设置为android:textAllCaps="false"所以并没有转成大写，按钮3设置为android:enabled="false"一开始是禁用状态，为灰色。注意点击按钮与长按按钮的点击事件代码，长按按钮有返回值。

   当我们长按长按按钮：

   

   会弹出信息，此时Button3仍为禁用状态，接下来按下启动测试按钮，之后按下short按钮：

   

   此时Button3恢复成了可用的按钮，按下short弹出了信息

EditText

1. 允许用户在控件里输入和编辑内容，并可以在程序中对这些内容进行处理

2. 属性：

   • android:hint属性：指定了一段提示性的文本
   • android:maxLines属性：指定了EditText的最大行数为两行，这样输入内容超过两行时，文本就会向上滚动，而EditText则不会继续拉伸

3. 示例：在上面的基础上对于主活动：

   EditText editText = (EditText) findViewById(R.id.Edit);
   button3.setOnClickListener(new View.OnClickListener() {
       @Override
       public void onClick(View v) {
           String put = editText.getText().toString();
           Toast.makeText(MainActivity.this, put, Toast.LENGTH_SHORT).show();
       }
   });
   

   对于布局文件：

   <EditText
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:id="@+id/Edit"
   android:hint="Type something here"
   android:maxLines="2"/>
   

   界面：

   

   当进行输入，并按下Button3时：

   

ImageView

1. 作用：放进一个图片

2. ImageButton是显示图片的图像按钮，但它继承自ImageView，而非继承Button

   • ImageButton与Button的区别：

     • Button既可以显示文本，也可以显示图片，ImageButton只能显示图片不能显示文本
     • ImageButton上的图像可按比例缩放，而Button通过背景设置的图像会拉伸变形
     • Button只能靠背景显示一张图片，而ImageButton可分别在前景和背景显示图片，从而实现两张图片叠加的效果

   • ImageButton与ImageView的区别：

     • ImageButton有默认的按钮背景，ImageView默认无背景
     • ImageButton默认的缩放类型为center，而ImageView默认的缩放类型为fitCenter

     三种图像的居中显示：

     fitCenter：即允许缩小图片，也允许放大图片

     centerInside：只允许缩小图片，不允许放大图标

     center：始终保持原尺寸

     因此，当视图的尺寸小于图片时，fitCenter与centerInside都会相应的进行缩小。

3. 示例：

   在上面的代码基础上进行添加

   主活动：

   //使按下按钮使图片进行转换
   ImageView imageView = (ImageView) findViewById(R.id.draw1);
   button3.setOnClickListener(new View.OnClickListener() {
       @Override
       public void onClick(View v) {
           imageView.setImageResource(R.drawable.draw2);
       }
   });
   //对ImageButton写对应的监听器方法
   ImageButton imageButton = (ImageButton) findViewById(R.id.Image_button);
   imageButton.setOnClickListener(new View.OnClickListener() {
       @Override
       public void onClick(View v) {
           Toast.makeText(MainActivity.this, "You knock ImageButton", Toast.LENGTH_SHORT).show();
       }
   });
   

   对应布局文件：

   <ImageView
       android:layout_width="80dp"
       android:layout_height="80dp"
       android:id="@+id/draw1"
       android:src="@drawable/draw"/>
   
   <ImageButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/Image_button"
       android:src="@mipmap/ic_launcher"/>
   

   运行之后初界面：

   

   此时放置了一个图片和一个ImageButton，首先按启动测试按钮使Button3转换成可用状态，再按下Button3按钮，此时第一张图片进行了转换，再按一下第二张图片，此时就弹出对应信息

   运行后界面：

   

ProgressBar

1. 作用：显示一个进度条，表示我们程序正在加载一些数据

注意：所有的控件都可以通过android:visibility=""进行指定控件的可见属性

visible：在没有声明的时候默认是这种属性，表示控件为可见的

invisible：表示控件不可见，当仍占据着原来的大小和位置

gone：不可见，而且不占用任何的屏幕空间

控件的可见还可以在代码中进行设置

示例：

仍在上面代码进行修改（小编将上面的两个图片放在了一行）：所带来的就是一个不停转圈的进度圈

主活动代码：

ProgressBar progressBar = (ProgressBar) findViewById(R.id.progress_bar);
button3.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        if (progressBar.getVisibility() == View.GONE) {
            progressBar.setVisibility(View.VISIBLE);
        } else {
            progressBar.setVisibility(View.GONE);
        }
    }
});

布局文件的代码：

<ProgressBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:id="@+id/progress_bar"/>

得到的视图：

进行修改：

主活动（使每按一次，进度条都增加10）：

button3.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
       int sum = progressBar.getProgress();
        sum += 10;
        progressBar.setProgress(sum);
    }
});

布局文件：

<ProgressBar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    style="?android:attr/progressBarStyleHorizontal"
    android:max="100"
    android:id="@+id/progress_bar"/>

style=“?android:attr/progressBarStyleHorizontal”：改变了进度条的形状

android:max属性：代表进度条的最大值

此时视图为：

AlertDialog

1. 作用：可以在当前的界面弹出一个对话框，这个对话框是置顶于所有界面元素之上的，能够屏蔽掉其他控件的交互能力，因此一般用于提示一些非常重要的内容或者警告信息

2. 示例：

   button3.setOnClickListener(new View.OnClickListener() {
       @Override
       public void onClick(View v) {
           //建立一个dialog实例
           AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
           //设置标题与提示的文字
           dialog.setTitle("This is dialog");
           dialog.setMessage("Something important");
           //按下按钮的反应
           dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
               @Override
               public void onClick(DialogInterface dialog, int which) {
   
               }
           });
           dialog.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
               @Override
               public void onClick(DialogInterface dialog, int which) {
   
               }
           });
           dialog.show();
       }
   });
   

   运行结果，当按下Button3按钮：

   

ProgressDialog

1. 作用：与上一个类似，不同在于这个会在对话框中显示一个进度条，一般用于表示当前操作比较耗时，让用户耐心等待

2. 示例：

   button3.setOnClickListener(new View.OnClickListener() {
       @Override
       public void onClick(View v) {
           ProgressDialog progressDialog = new ProgressDialog(MainActivity.this);
           progressDialog.setTitle("This is progressDialog");
           progressDialog.setMessage("Loading...");
           //这句代码是为了说明这个对话框能否按back键使其退出
           progressDialog.setCancelable(true);
           progressDialog.show();
       }
   });
   

   运行结果，当按下Button按钮：

   

3. 该控件有些过时，新的办法为ProgressBar加上AlerTDialog的setView方法来实现

   示例：

   先在layout目录下新建一个xml，定义一个progressbar，代码如下：

   <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       xmlns:app="http://schemas.android.com/apk/res-auto">
   
       <ProgressBar
           android:id="@+id/progressBar"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toStartOf="parent"
           app:layout_constraintTop_toTopOf="parent" />
   
   </androidx.constraintlayout.widget.ConstraintLayout>
   

   使用AlerTDialog的setView方法调用这个layout下的进度条就行了，主活动的代码如下：

   AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
   dialog.setTitle("This is dialog");  //设置标题
   dialog.setView(R.layout.progressbar);	//调用layout
   dialog.setMessage("Something important"); //设置内容
   dialog.show();
   

   AlertDialog.Builder 是 Android SDK 中的一个类，它是一个用于构建和显示 AlertDialog 对话框的辅助类。AlertDialog 是一种预定义的对话框，用于向用户显示一些重要的信息，并可能包含一些按钮以供用户选择。

   运行程序如下：

   

4. 注意：如果progressDialog.setCancelable(false);即不可通过按back按钮使其退出，我们就需要当数据加载完成之后必须要调用progressDialog的dismiss()方法来关闭对话框，否则会一直存在

ScrollView

1. 名称：滚动视图

2. 分类：

   • ScrollView：它是垂直方向上的滚动视图；垂直方向滚动时：

     android:layout_width="match_parent"
android:layout_height="wrap_content"

   • HorizontalScrollView：它是水平方向上的滚动；水平方向滚动时，与上面刚好相反

3. 示例：

   <HorizontalScrollView
           android:layout_width="match_parent"
           android:layout_height="200dp">
           <LinearLayout
               android:layout_width="wrap_content"
               android:layout_height="match_parent"
               android:orientation="horizontal">
               <View
                   android:layout_width="300dp"
                   android:layout_height="match_parent"
                   android:background="#aaffff"/>
               <View
                   android:layout_width="300dp"
                   android:layout_height="match_parent"
                   android:background="#ffffff00"/>
           </LinearLayout>
       </HorizontalScrollView>
   
       <ScrollView
           android:layout_width="match_parent"
           android:layout_height="wrap_content">
           <LinearLayout
               android:layout_width="match_parent"
               android:layout_height="match_parent"
               android:orientation="vertical">
               <View
                   android:layout_width="match_parent"
                   android:layout_height="300dp"
                   android:background="#00ff00"/>
               <View
                   android:layout_width="match_parent"
                   android:layout_height="300dp"
                   android:background="#ffff00"/>
           </LinearLayout>
       </ScrollView>
   

   运行界面：

   

中间的大方框可以水平方向滚动，下面是垂直方向滚动，每部分都由两个颜色的方块组成

到这里就结束啦！