安卓开发学习笔记_UI开发_常用控件的使用方法

TextView

内容

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="This is TextView"/>
</LinearLayout>

android:layout_width(height)有三个可选值:

• match_parent: 与父布局大小一样
• warp_content: 大小刚好能包含里面的内容
• 固定值: 单位用dp(与屏幕密度无关)

位置

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...
    <TextView
        ...
        android:gravity="center"
        .../>
</LinearLayout>

TextView中的文字是默认居左上角对齐的.

android:gravity用来指定文字的对齐方式, 可以用"|"同时指定多个值

• top
• bottom
• start
• end
• center(效果等同于"center_vertical | center_horizontal"): 垂直和水平方向都居中对齐

字体大小与颜色

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...

    <TextView
        ...
        android:textColor="#00ff00"
        android:textSize="24sp"
        .../>
</LinearLayout>

android:textColor 用于指定文字的颜色
android:textSize 用于指定文字的大小(单位是sp)

Button

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...

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

Android系统默认会将按钮上的英文字母转换成大写, 可以通过添加android:textAllCaps="false"属性来保留原始文字内容

为按钮注册一个监听器

Java单抽象方法接口的特性, 函数式API的写法

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        button.setOnClickListener {
            // 在此处添加逻辑
        }
    }
}  

实现接口的写法

class MainActivity : AppCompatActivity(), View.OnClickListener{

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityMainBinding.inflate(layoutInflater)

        setContentView(binding.root)
        binding.button.setOnClickListener(this)
    }

    override fun onClick(v: View?)
    {
        when (v?.id)
        {
            R.id.button -> {
                // 在此处添加逻辑
            }
        }
    }
}

让MainActivity实现了View.OnClickListener接口, 并重写了onClick()方法, 在调用button的setOnClickListener()方法时将MainActivity的实例传了进去. 每当点击按钮时, 就会执行onClick()方法中的代码.

EditText

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...

    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
    
</LinearLayout>

提示性文本

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...

    <EditText
        ...
        android:hint="Type something here"/>

</LinearLayout>

maxLines

当输入的内容增多, EditText会被不断拉长, 因为EditText的高度指定的是wrap_content, 因此他总能包住里面的内容, 这样界面会不好看.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...

    <EditText
        ...
        android:maxLines="2"/>

</LinearLayout>

通过android:maxLines指定了EditText的最大行数为两行, 当输入内容超过两行, 文本就会向上滚动.

点击按钮获取EditText的输入内容

class MainActivity : AppCompatActivity(), View.OnClickListener{

    ...

    override fun onClick(v: View?)
    {
        when (v?.id)
        {
            R.id.button -> {
                val inputText = binding.editText.text.toString()
                Toast.makeText(this, inputText, Toast.LENGTH_SHORT).show()
            }
        }
    }
}

ImageView

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    ...

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/img_1"/>

</LinearLayout>

通过android:src属性给ImageView指定了一张图片.
由于图片的高和宽都是未知的, 所以将ImageView的宽和高都设定为wrap_content.

动态替换图片

class MainActivity : AppCompatActivity(), View.OnClickListener{

    ...

    override fun onClick(v: View?)
    {
        when (v?.id)
        {
            ...
            // 无图
            R.id.button5 -> {
                binding.imageView.setImageDrawable(null)
            }
            // img_1
            R.id.button2 -> {
                binding.imageView.setImageResource(R.drawable.img_1)
            }
            // img_2
            R.id.button3 -> {
                binding.imageView.setImageResource(R.drawable.img_2)
            }
        }
    }
}

ProgressBar

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    ...

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

进度条.

Android控件的可见属性, 可以通过android:visibility进行指定.

• visible 默认值, 表示可见, 不指定android:visibility时, 控件都是可见的
• invisible 控件不可见, 但是仍然占据原来的位置和大小, 可以理解为控件变为透明状态了.
• gone 控件不仅不可见, 而且不再占据任何屏幕空间.

切换进度条的可见属性

class MainActivity : AppCompatActivity(), View.OnClickListener{

    ...

    override fun onClick(v: View?)
    {
        when (v?.id)
        {
            ...
            // 切换进度条的可见属性
            // setVisibility()方法, 允许传入View.VISIBLE, View.INVISIBLE, View.GONE3种值
            R.id.button4 -> {
                if(binding.progressBar.visibility == View.VISIBLE){
                    binding.progressBar.visibility = View.GONE
                }else{
                    binding.progressBar.visibility = View.VISIBLE
                }
            }
        }
    }
}

水平进度条

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...
    <ProgressBar
        android:id="@+id/progressBar2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        style="?android:attr/progressBarStyleHorizontal"
        android:max="100" />
</LinearLayout>

通过android:max属性给进度条设置一个最大值, 可以在代码中动态地更改进度条的进度, 代码如下:

class MainActivity : AppCompatActivity(), View.OnClickListener{

    ...

    override fun onClick(v: View?)
    {
        when (v?.id)
        {
            ...
            R.id.button6 -> {
                binding.progressBar2.progress += 10
            }
        }
    }
}

AlertDialog

class MainActivity : AppCompatActivity(), View.OnClickListener{

    ...

    override fun onClick(v: View?)
    {
        when (v?.id)
        {
            ...
            // 通过AlertDialog.Builder构建一个对话框
            AlertDialog.Builder(this).apply {
                // 设置标题
                setTitle("This is Dialog")
                // 设置内容
                setMessage("Something important.")
                // 设置可否使用Back键关闭对话框
                setCancelable(false)
                // 设置确定按钮的点击事件
                setPositiveButton("OK") { dialog, which ->
                }
                // 设置取消按钮的点击事件
                setNegativeButton("Cancel") { dialog, which ->
                }
                // show()方法显示对话框
                show()
            }
        }
    }
}

参考

郭霖. 《第一行代码 Android 第3版》