五、Android-常用UI控件

5. UI常用控件

Android控件的可见属性。所有的Android控件都具有这个属性，可以通过android:visibility进行指定，可选值有3种：visible、invisible和gone。

• visible: 表示控件是可见的，这个值是默认值，不指定android:visibility时，控件都是可见的。
• invisible: 表示控件不可见，但是它仍然占据着原来的位置和大小，可以理解成控件变成透明

状态了。

• gone: 则表示控件不仅不可见，而且不再占用任何屏幕空间。

我们可以通过代码来设置控件的可见性，用的是setVisibility()方法，允许传入View.VISIBLE、View.INVISIBLE和View.GONE这3种值。

5.1 TextView

显示一段文本信息，类似于IOS的UILabel。

<TextView
    android:id="@+id/textView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:textColor="#00ff00"
    android:textSize="24sp"
    android:text="Hello World!"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

5.2 Button

Button是程序用于和用户进行交互的一个重要控件。类似于IOS的UIButton。

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/button1"
        android:text="Button1"
        />

为Button添加点击事件监听器的两种方式：

        binding.button2.setOnClickListener {
            val inputText = binding.editText.text.toString()
            Toast.makeText(this, inputText, Toast.LENGTH_SHORT).show()
        }

class MainActivity : AppCompatActivity(), View.OnClickListener {
​
      override fun onCreate(savedInstanceState: Bundle?) {
          // 需要遵守View.OnClickListener接口，然后实现onClick方法
          binding.button1.setOnClickListener(this)
      }
  
      override fun onClick(p0: View?) {
        when (p0) {
            binding.button1 -> {
                Log.d("MainActivity", "button1")
            }
            binding.button2 -> {
                val inputText = binding.editText.text.toString()
                Toast.makeText(this, inputText, Toast.LENGTH_SHORT).show()
            }
        }
    } 
}
​

5.3 EditText

和用户交互的重要控件，可输入、编辑内容。类似于IOS的UITextField、UITextView。

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/editText"
        android:hint="Please input something"
        android:maxLines="2"
        />

android:hint :占位符，类似IOS的Placeholder

android:maxLines：显示的最大行数，多于该数可上下滑动

获取输入的内容

val inputText = binding.editText.text.toString()

5.4 ImageView

展示图片的控件，类似IOS的UIImageView。

    <ImageView
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:id="@+id/imageView1"
        android:src="@drawable/img_1"
        android:scaleType="fitCenter"
        />

android:scaleType的可选值：

• fitXY: 对图像的横向与纵向进行独立缩放,使得该图片完全适应ImageView,但是图片的横纵比可能会发生改变
• fitStart: 保持纵横比缩放图片,知道较长的边与Image的编程相等,缩放完成后将图片放在ImageView的左上角
• fitCenter: 同上,缩放后放于中间;
• fitEnd: 同上,缩放后放于右下角;
• center: 保持原图的大小，显示在ImageView的中心。当原图的size大于ImageView的size，超过部分裁剪处理。
• centerCrop: 保持横纵比缩放图片,知道完全覆盖ImageView,可能会出现图片的显示不完全
• centerInside: 保持横纵比缩放图片,直到ImageView能够完全地显示图片
• matrix: 默认值，不改变原图的大小，从ImageView的左上角开始绘制原图， 原图超过ImageView的部分作裁剪处理

更换图片资源

binding.imageView1.setImageResource(R.drawable.img_2)

5.5 ProgressBar

用于界面上显示进度条，表示程序正在加载一些数据。

    <ProgressBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/progressBar"
        />

默认展示一个圆形的进度条。

可以在代码中控制它的显示和隐藏

                val progressBar = binding.progressBar
                if (progressBar.visibility == View.VISIBLE) {
                    progressBar.visibility = View.GONE
                } else {
                    progressBar.visibility = View.VISIBLE
                }

可指定不同的样式，通过style属性可以将它指定成水平进度条

    <ProgressBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/progressBar"
        style="@style/Widget.AppCompat.ProgressBar.Horizontal"
        android:max="100"
        />

android:max 设置一个最大值

然后可以在代码中动态的更改进度条的进度。

val progressBar = binding.progressBar
progressBar.progress += 10

5.6 AlertDialog

当前界面弹出对话框，置顶于所有界面元素之上，能够屏蔽其他控件的交互能力。类似于IOS的UIAlertController。

                AlertDialog.Builder(this).apply {
                    setTitle("This is Dialog")
                    setMessage("This is Message")
                    // 点击其他地方不消失
                    setCancelable(false)
                    setPositiveButton("OK") { dialog, which ->
                        Log.d("MainActivity", "positive")
                    }
                    setNegativeButton("Cancel") { dialog, which ->
                        Log.d("MainActivity", "negative")
                    }
                    show()
                }