Android Interface(UI) 界面控件简单介绍01

Posted 2020-07-30

1、TextView：显示文本

常用的属性设置：
android:textIsSelectable="true" 设置文本内容可选（触发系统的复制粘贴功能）
android:drawableLeft="@mipmap/ic_launcher" 设置文本内容的图标
其它包括drawableRight, drawableTop, drawableBottom, drawableStart, drawableEnd
android:text="Hello World!" 设置显示的文本内容
android:textColor="@color/colorAccent" 设置文本颜色
android:textSize="24sp" 设置文本字体大小
android:textStyle="bold" 设置字体的样式（bold 粗体，normal 默认， italic 斜体）
android:clickable="true" 是否可以单击
android:onClick="" 可单击的情况下，可以设置单击事件
android:ellipsize="marquee" 设置文本内容超出显示范围的显示方式
end, marquee, middle, none, start
android:lines="1" 设置显示的行数
android:maxLines="1" 最大的行数
android:minLines="1" 最小的行数
android:gravity 设置文本内容的位置
android:background="@color/colorPrimary" 设置背景颜色

 

2、EditText：输入框（是TextView的子类）

用于接收输入文本内容
常用的属性：
android:hint="" 当输入框没有内容时显示提示信息
其它属性与TextView类同

两个事件监听：
1、输入变化的事件监听：
addTextChangedListener（new TextWatcher(){
beforeTextChanged 文本改变之前
onTextChanged 文本正在改变
afterTextChanged 文本改变之后
}）;

2、编辑完成的动作监听（回车符）
setOnEditorActionListener（new OnEditorActionListener(){
onEditorAction() 实现编辑完成后的动作（比如提交内容）
}）;

3、Button：按钮（设置点击事件）

通常使用Button组件的单击事件来提交数据，或触发某个操作
1、实现Button的事件监听的三种方式：
<1>通过实现监听器接口：View.OnClickListener，通常在Activity界面来实现（也可以是其他界面类）
实现事件的处理方法：onClick(View v)，通过判断参数组件的ID，来确定用户操作的是哪个按钮
switch(v.getId()) 实现不同按钮的操作
为每个按钮添加事件处理（setOnClickListener(this)）
在处理多个按钮事件时，建议使用（效果最高）
<2>使用匿名内部类直接给按钮设置事件监听
setOnClickListener(new View.OnClickListener(){
public void onClick(View v){
//......
}
});
使用此方式的好处，代码集中简洁，少量时使用，由于使用匿名内部类会生成单独的类，所以会影响一定
的性能。
<3>在布局文件中使用属性自定义单击事件的方法
在布局文件中用 android:onClick="方法名"
在Activity类中自定义方法：public void 方法名(View v){}，好处简洁，但是有一定限制

以上三种方法：最好是第一种

2、配置按钮的样式：
<1>配置透明的按钮样式
在配置布局文件中的按钮组件上使用style属性：
style="?android:attr/borderlessButtonStyle"
或者设置
background="@null"
<2>配置自定义按钮的样式：
使用selector(选择器)
在res/drawbale目录下创建一个配置文件，比如 button_bg.xml
在文件中：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- state_pressed表示按下事件， drawable 可以是颜色或背景图片-->
<item android:state_pressed="true" android:drawable="@color/button_pressed"/>
<!-- 配置默认的样式 -->
<item android:drawable="@color/button_default"/>
</selector>
然后在按钮的布局设置中使用background属性引用资源配置文件：
background="@drawable/button_bg"

4、ImageButton：图形按钮（可自定义设置按钮形状，效果）

与Button按钮类似，表示一个图片按钮
1、通过src属性指定按钮上显示的图片
src="@mipmap/ic_launcher"
也可以通过定义一个selector来设置图片选择器，比如在drawable/imagebutton_bg.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@mipmap/de_btn_main_add_hover"/>
<item android:drawable="@mipmap/de_btn_main_add"/>
</selector>

2、定义按钮的形状（可以应用在所有按钮上）
定义 drawable/button_shape.xml
<!--
rectangle 矩形
corners 角度
padding 内边距
stroke 边界的线
-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/colorAccent" />
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
<stroke android:color="#000000" android:width="5dp"/>
</shape>

5、ImageView：显示图形（）

表示显示一个图片的组件
通过src属性指定要显示的图片资源
显示图片时要注意，以适当的大小进行显示，如果一个界面中出现大量较大的图片（占内存），那么
会出现内存溢出的情况，所以以合适的大小显示合适的图片由为重要

以适合的方式显示图片：就要对图片进行缩放
<1>定义组件的大小，让图片适应组件的方式来进行按宽高比自动缩放显示
maxHeight 图片显示的最大高度
maxWidth 图片显示的最大宽度
adjustViewBounds 保正图片的宽高比例
该方法将按原图的比例进行缩放
<2>使用scaleType对图片进行缩放
matrix 用矩阵来绘制，动态缩小放大图片来显示
fitXY 把图片不按比例扩大/缩小到View的大小显示
fitStart 把图片按比例扩大/缩小到View的宽度，显示在View的上部分位置
fitCenter 把图片按比例扩大/缩小到View的宽度，居中显示
fitEnd 把图片按比例扩大/缩小到View的宽度，显示在View的下部分位置
center 按图片的原来size居中显示，当图片长/宽超过View的长/宽，则截取图片的居中部分显示
centerCrop 按比例扩大图片的size居中显示，使得图片长(宽)等于或大于View的长(宽)
centerInside 将图片的内容完整居中显示，通过按比例缩小或原来的size使得图片长/宽等于或
小于View的长/宽
android:tint 将图片渲染成指定的颜色。

常用为：center、centerCrop

其它属性：
android:clickable="true" 是否可以单击，当该属性为true时，可以设置监听事件

注意：不要在小组件中显示大图片（图片组件的宽高小于图片本身的宽高）

6、CheckBox：复选框

用于提供多项选择
android:checked="true" 设置复选框是否默认选中
获取CheckBox组件的内容通常有两种方式：
<1>单获通过一个按钮的单击事件来检查CheckBox是否被选中
checkBox.isChecked() 判断是否为选中
再通过checkBox.getText().toString() 获取复选框的文本内容
checkBox.setChecked(boolean) 来设置是否选中
<2>通过给CheckBox组件添加CompoundButton.OnCheckedChangeListener事件
来监听复选框选中或取消选中的事件。

7、RadioButton和RadioGroup：组将RadioButton放在RadioGroup中（互斥，可用于底部导航）

要想实现多个单选按钮互斥，需要把多个单选按钮放到一个RadioGroup分组内
可以为其中一个RadioButton设置为默认选中：checked="true"
RadioGroup中通过orientation属性设置水平或垂直排列
要想监听单选按钮的事件，可以通过实现RadioGroup.OnCheckedChangeListener接口
再通过radioGroup.findViewById(checkedId)获取当前被选中的RadioButton对象
再通过radioButton.getText()获取选中单选按钮的文本内容

或者通过一个按钮的单击事件来获取RadioButton的文本内容

使用RadioButton实现底部导航栏：
原理：利用RadioButton的互斥功能来实现底部导航菜单栏的功能
1、在界面底部使用RadioGroup组合多个RadioButton,并水平排列
2、设置RadioButton的相关属性来调整样式：
android:button="@null" 去除RadioButton的小圆圈
android:layout_weight="1" 平分多个RadioButton的位置
android:drawableTop="@drawable/..." 指定上方的图标
android:gravity="center" 居中显示
android:textColor="" 定义字体颜色
其中：drawableTop，textColor可以设置selector来改变选中与未选中的效果

8、ToggleButton和Switch ：开关按钮

我们可以使用打关按钮来实现打开或关闭某一个功能的用户操作
textOn="打开" 按钮开启状态显示的文本
textOff="关闭" 按钮关闭状态显示的文本

在代码是通过isChecked方法来判断按钮的状态
监听开关按钮的事件：
setOnCheckedChangeListener（）设置开关变化的事件
或者我们通过会使用单独的按钮进行统一的事件控制

9、RatingBar 组件：评分条（通常进行自定义，效果更好）

可用于对用户、商品、用户体验等进行评分
<1>作为一个指示器，只提供查看
通过 android:isIndicator="true" 设置为指示器
<2>作为一个可与用户交互的评分
android:isIndicator="false" 默认值 用户可以点击

常用的属性：
android:numStars="5" 设置星的总数
android:stepSize="1" 设置步长（每次可以设置的递增值，可以是小数）
android:rating="3" 设置当前星数

事件监听：
当用户改变评分条的星数时，可以使用监听器接口：OnRatingBarChangeListener实现
ratingBar.setRating(4f);
ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
@Override
public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
//ratingBar 评分条组件
//rating 当前改变后的评分值
//fromUser 是否是用户操作
if(fromUser){//是否是用户操作
///
System.out.println("当前已经设置的星数，rating="+rating);
}
}
});
注意：使用评分条时宽度要使用wrap_content，否则星数量将不可控制，误导用户

使用自定义评分条：（项目中使用）
1、在drawable下定义一个配置文件：
layer-list 图层列表
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@android:id/background"
android:drawable="@mipmap/star_small_bg" />
<item
android:id="@android:id/progress"
android:drawable="@mipmap/star_small_hl" />
</layer-list>

2、在style.xml文件中定义一个样式：
<style name="mySmallRatingBar" parent="android:Widget.RatingBar">
<item name="android:progressDrawable">@drawable/ratingbar_small_bg</item>
<item name="android:maxHeight">16dp</item>
<item name="android:minHeight">16dp</item>
</style>

3、在布局文件中定义RatingBar组件
用style属性引用自定义的样式
style="@style/mySmallRatingBar"

10、Spinner组件：下拉列表

通过提供一组选项数据，让用户选择
实现一个Spinner组件：
1、在布局文件中定义Spinner组件
<Spinner
android:width="wrap_content"
android:height="wrap_content"
android:id="@+id/spinner_city">

2、给Spinner下拉列表提供数据
<1>通过字符串数组资源文件定义
res/values/strings.xml文件中定义：
<string-array name="city">
<item>北京市</item>
<item>上海市</item>
<item>深圳市</item>
<item>武汉市</item>
<string-array>
res/values/arrays.xml文件中定义：与strings.xml文件定义相同

<2>通过在代码中提供
通过是从其它地方获取数据（比如网络、数据库等）

3、利用一个适配器把
数据填充到Spinner组件中
从资源文件中获取数据并创建一个适配器
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource();
createFromResource()参数：
<1>context : 上下文
<2>数据资源ID
<3>列表中用于显示数据的布局

通过直接创建ArrayAdapter的方式：
//获取资源对象
String[] citys = getResources().getStringArray(R.array.city);
ArrayAdapter<CharSequence> adapter = new ArrayAdapter<CharSequence>(
this,R.layout.spinner_item,citys);

自定义下拉列表布局：
//使用自定义的布局文件
ArrayAdapter<CharSequence> adapter =ArrayAdapter.createFromResource(this,
R.array.city,R.layout.spinner_item);
spinner_item布局文件通常使用android默认的ID：@android:id/text1

//获取下拉列表当前选中的值
String city = spinner_city.getSelectedItem().toString();

11、AutoCompleteTextView：自动完成（当输入数据时可给予用户提示，登录界面常用）

给用户提供建议选项
常用属性：
android:completionThreshold="1" 输入字符数，显示提示选项
android:completionHint="请选择一个城市" 提示信息
android:dropDownSelector="#def9de" 选中下拉列表的颜色

提供的建议列表，通过适配器提供
ArrayAdapter<CharSequence> arrayAdapter = ArrayAdapter.createFromResource(
this,R.array.city,android.R.layout.simple_list_item_1);
autoCompleteTextView.setAdapter(arrayAdapter);

12、ProgressBar :进度条组件（可用于加载数据，给用户更好的体验）

两种样式：
1、表盘样式（圆的，一直在转）
2、水平样式（提供进度值的可视，通常用于加载确定时间的操作提示）
默认是表盘样式，如需水平样式，通过设置 style属性
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"

当进度条是可确定值的我们可以设置以下属性：
android:max="100" 进度条的最大值
android:progress="50" 当前的进度值
android:secondaryProgress="80" 当前的第二进度值

如果是水平样式，也可以通过indeterminate属性设置为进度不确定
android:indeterminate="true" true表示进度条不确定，false表示确定
如果为true进度条的样式将为重复水平滚动

ProgressDialog 对话框进度条
以对话框的方式显示进度条样式：
可以是表盘样式或水平样式
ProgressDialog pd = new ProgressDialog(this);
默认是表盘样式
设置为水平样式：
pd.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);//设置为水平样式
pd.setMax(100);//设置最大进度值
pd.setMessage("正在努力加载中...");
pd.setTitle("加载数据");
pd.setCancelable(true);//不允许取消

//监听对话框关闭的事件
pd.setOnDismissListener(new DialogInterface.OnDismissListener() {
@Override
public void onDismiss(DialogInterface dialog) {
dialog.cancel();
}
});

pd.show(); //显示

模拟下载：

private void showDialog(){
        final ProgressDialog pd = new ProgressDialog(this);
        pd.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
        pd.setTitle("下载");
        pd.setMessage("正在玩命下载中.....");
        pd.setMax(100);
        pd.setProgress(0);
        pd.setCancelable(false);
        pd.show();
        //使用线程模拟一个下载操作
        new Thread(new Runnable() {
            @Override
            public void run() {
                while (true){
                    //判断进度值是否为最大值，如果是表示下载完成，取消对话框，结束线程
                    if(pd.getProgress()>=pd.getMax()){
                        pd.cancel();
                        break;
                    }
                    pd.incrementProgressBy(10);//增长进度
                    try {
                        Thread.sleep(1000);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                }
            }
        }).start();
    }

小编寄语：本文简单总结，若有错误，望大牛能给予纠正，万分感谢。同时希望本文可以帮到更多的人，一起努力，共同进步。本文为安卓技术的首篇博文，欢迎大家阅读，以后会有更多的技术分享。祝大家在程序猿道路一帆风顺#努力#奋斗@everyone