Android常见界面控件
TextView
TextView控件用于显示文本信息。
常用属性
| 布局属性 | 功能描述 |
|---|---|
| android:layout_width | 设置TextView控件的宽度 |
| android:layout_height | 设置TextView控件的高度 |
| android:id | 设置TextView控件的唯一标识 |
| android:background | 设置TextView控件的背景 |
| android:layout_margin | 设置当前控件与屏幕边界或周围控件、布局的距离 |
| android:padding | 设置TextView控件与该控件中内容的距离 |
| android:text | 设置文本内容 |
| android:textColor | 设置文字显示的颜色 |
| android:textSize | 设置文字大小，推荐单位为sp |
| android:gravity | 设置文本内容的位置 |
| android:maxLength | 设置文本最大长度，超出此长度的文本不显示 |
| android:lines | 设置文本的行数，超出此行数的文本不显示 |
| android:maxLines | 设置文本的最大行数，超出此行数的文本不显示。 |
| android:ellipsize | 设置当文本超出TextView规定的范围的显示方式。 |
| android:drawableTop | 在文本的顶部显示图像 |
| android:lineSpacingExtra | 设置文本的行间距 |
| android:textStyle | 设置文本样式，如bold（粗体），italic（斜体），normal（正常） |
- 注：可以通过加
\n进行换行
例：android:text="学校：山东理工大学\n联系电话：123455"会显示两行
Button
Button控件表示按钮，它继承自TextView控件，既可以显示文本，又可以显示图片；
同时也允许用户通过点击来执行操作，当Button控件被点击时，被按下与弹起的背景会有一个动态的切换效果，这个效果就是点击效果 。
点击事件实现方式
方法1：直接通过属性指定（现在一般不用）
在布局文件中指定Button控件的onClick属性方式
-
在layout文件中指定onClick属性
android:onClick="click" -
在Activity中实现这个click方法
public void click(View v){
Log.i("指定onClick属性方式", "button is clicked");
}
方法2. 匿名内部类方式
在Activity中添加匿名内部类
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Log.i("匿名内部类方式", "button is clicked");
}
});
方法3：接口方式
- 设置Button控件的点击监听事件
btn.setOnClickListener(this);//this代表onClickListener的引用
- 接着当前Activity实现OnClickListener接口
public class MainActivity extends AppCompatActivity implements View.onClickListener
- 然后实现OnClickListener接口中的方法
@Override
public void onClick(View v) {
Log.i("接口方式", "button is clicked");
}
实用属性
去除阴影和点击效果：android:stateListAnimator="@null"
只去除阴影：style="?android:attr/borderlessButtonStyle"
图片 圆角实现
styles.xml
Android Studio的styles.xml文件位于“res/values”文件夹中，主要用来设置应用程序的全局样式或者控件样式的。
文件结构如下：
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--ShapeableImageView 圆角-->
<style name="RoundedStyle">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">30dp</item>
</style>
<!--ShapeableImageView 圆 -->
<style name="CircleStyle">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">50%</item>
</style>
</resources>
scaleType属性
scaleType属性指定了ImageView如何显示图片。包括是否进行缩放、等比缩放、缩放后展示位置等。
Android 提供了八种scaleType的属性值，每种都对应了一种展示方式，常用的几种如下：
-
fitCenter ：等比例缩放。
缺省值
图片宽高比和控件宽高比一致，则填满控件显示，居中显示，即缩放后的图片的中点和控件中点重叠。
图片宽高比和控件宽高比不一致，则等比缩放图片最长边，直到和控件宽或高一边重叠，这种情况左右或者上下可能会空白。 -
fitXY 拉伸图片至完全填充控件。
-
center 控件中心和原始图片中心重叠，图片不进行缩放，只显示控件区域的内容。
如果原始图片宽高都小于控件宽高，则看起来的效果和居中显示一样。 -
centerCrop 等比例缩放到控件中心和原始图片中心重叠且图片填满控件。
圆角裁切
解决了基本问题，开始对图片进行裁切（以圆形为例）：
效果：
xml文件
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:src="@mipmap/ic_avatar"
app:shapeAppearance="@style/CircleStyle" />
styles文件
- cornerFamily 角的处理方式，rounded圆角，cut裁剪
- cornerSize 圆角大小
可以用百分比，也可以自己计算，比如宽高100dp，圆角50dp
<!--ShapeableImageView 圆 -->
<style name="CircleStyle">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">50%</item>
</style>
描边
效果：
xml文件
- app:strokeColor 描边颜色
- app:strokeWidth 描边宽度
- 注意：padding的数值是描边宽度的一半
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:padding="2dp"
android:src="@mipmap/ic_avatar"
app:shapeAppearance="@style/CircleStyle"
app:strokeColor="@color/red"
app:strokeWidth="4dp" />
EditText
EditText表示编辑框，它是TextView的子类，用户可在此控件中输入信息。
| 属性名称 | 功能描述 |
|---|---|
| android:hint | 控件中内容为空时显示的提示文本信息 |
| android:textColorHint | 控件中内容为空时显示的提示文本信息的颜色 |
| android:password | 输入文本框中的内容显示为“.” |
| android:phoneNumber | 设置输入文本框中的内容只能是数字 |
| android:minLines | 设置文本的最小行数 |
| android:scrollHorizontally | 设置文本信息超出EditText的宽度情况下，是否出现横拉条 |
| android:editable | 设置是否可编辑 |
| android:digits | 限制用户输入的内容，用户只能输入规定的字符，其余字符无法输入 |
| android:inputType | 规定用户输入的内容类型如：phone，textPassword等等 |
处理TextChanged事件
应用场景：用户输入验证码 达到规定输入长度，自动点击确认
当EditText视图中的文本内容发生改变时，将触发TextChanged(文本变化)事件，处理EditText视图上的TextChanged事件的步骤如下：
-
确定EditText视图。
首先给出需要处理TextChanged事件的EditText视图，例如：
EditText tEdit = (EditText)findViewById(R.id.my_edit); -
确定监视器。
需要使用实现TextWatcher接口（在android.text包中）的类的对象作监视器，EditText视图通过如下方法注册监视器：
public void addTextChangedListener(TextWatcher watcher) -
监视器重写TextWatcher接口的afterTextChanged，beforeTextChanged和onTextChanged。
当EditText视图中的文本内容发生改变时，监视器就会调用重写的这3个方法。
ImageView
ImageView表示图片，它继承自View，可以加载各种图片资源。
| 属性名称 | 功能描述 |
|---|---|
| android:layout_width | 设置ImageView控件的宽度 |
| android:layout_height | 设置ImageView控件的高度 |
| android:id | 设置ImageView控件的唯一标识 |
| android:background | 设置ImageView控件的背景 |
| android:layout_margin | 设置当前控件与屏幕边界或周围控件的距离 |
| android:src | 设置ImageView控件需要显示的图片资源 |
| android:scaleType | 将图片资源缩放或移动，以适应ImageView控件的宽高 |
| android:tint | 将图片渲染成指定的颜色 |
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/bg" /> 设置背景图片
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@drawable/icon"/> 设置前景图片
ToggleButton视图
ToggleButton视图的继承关系如下：
android.widget.Button android.widget.CompoundButton android.widget.ToggleButton
和普通的Button视图相比较，ToggleButton外观可以提供两种状态，一种是选中（checked）状态，另一种是未选中状态（unchecked），用户点击ToggleButton视图可以切换它的状态。
-
android:disabledAlpha：设置按钮在未选中状态（unchecked）时的alpha值。属性取值0-1之间的小数，取值0按钮完全透明，取值1，按钮完全不透明。
-
android:textOff：设置未选中状态（unchecked）时的文本。取值是字符串。
-
android:textOn：设置选中状态（checked）时的文本。取值是字符串。
确定监视器。
- 需要使用实现CompoundButton.OnCheckedChangeListener接口的类的对象作为ToggleButton视图的监视器，ToggleButton视图通过如下方法注册监视器：
public void setOnCheckedChangeListener(CompoundButton.OnCheckedChangeListener listener)
- 重写CompoundButton.OnCheckedChangeListener接口中的方法。
toggle.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (isChecked) {
// 选中状态时需要执行的代码
} else {
//未选中状态时需要执行的代码
}
}
});
RadioButton
RadioButton为单选按钮，android:checked属性指定是否选中的状态。
RadioGroup是单选组合框，可容纳多个RadioButton，并把它们组合在一起，实现单选状态。
语法格式
<RadioGroup
android:属性名称 ="属性值"
......>
<RadioButton
android:属性名称 ="属性值"
....../>
......
<RadioGroup/>
CheckBox
CheckBox表示复选框，它是Button的子类，用于实现多选功能，通过android:checked属性指定CheckBox控件是否选中的状态。
布局代码
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="羽毛球"
android:textSize="18sp"/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="篮球"
android:textSize="18sp"/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="乒乓球"
android:textSize="18sp"/>
处理CheckBox视图上的click事件
box.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
// Perform action on click
}
});
其他常用控件
DatePicker与TimePicker
日期选择事件的接口
DatePicker.OnDateChangedListener和TimePicker.OnTimeChangedListener
可以使用public void init (int year, int monthOfYear, int dayOfMonth,
DatePicker.OnDateChangedListener onDateChangedListener)方法为DatePicker视图注册监视器。
DatePicker.OnDateChangedListener接口中的方法是public void onDateChanged (DatePicker view, int year, int month, int day)
时间选择事件的接口
public void setOnTimeChangedListener (TimePicker.OnTimeChangedListener onTimeChangedListener),方法为TimePicker视图注册监视器。
TimePicker.OnTimeChangedListener接口中的方法是：
public void onTimeChanged (TimePicker view, int hour, int minute)
Chronometer
每隔一秒钟“计时”一次，如果程序需要周期地进行某个操作，就可以考虑使用Chronometer视图。
Chronometer视图上可以触发所谓的Tick(嘀嗒)事件，即每个一秒发生一次Tick(嘀嗒)事件
事件的接口是Chronometer.OnChronometerTickListener接口，该接口中的方法public void onChronometerTick (Chronometer chronometer)
- public void start ()方法开始“计时”，调用public void stop ()方法停止“计时”。
ProgressBar进度条
android:max：该属性值确定进度条的最大值，取值正整数。对于水平进度条，其意义是将ProgressBar视图的水平空间平分为max份。
android:progress：属性值确定进度条的进度值，取值范围是0与进度条的最大值之间的整数。
系统为ProgressBar视图提供了如下样式：
- Widget.ProgressBar.Horizontal ：水平样式。
- Widget.ProgressBar.Small ：小圆形样式。
- Widget.ProgressBar.Large：大圆形样式。
- Widget.ProgressBar.Inverse：反色样式（如果视图背景是浅颜色，最好使用该样式）。
- Widget.ProgressBar.Small.Inverse：反色小圆形样式。
- Widget.ProgressBar.Large.Inverse：反色大圆形样式。
如果希望使用水平的ProgressBar视图，可以在视图的XML中包含如下设置 style="@android:style/Widget.ProgressBar.Horizontal"
例如：
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@android:style/Widget.ProgressBar.Horizontal" />
WebView
为了使得程序中的WebView视图能访问Web页，必须修改项目的配置文件AndroidManifest.xml（在工程的根目录下），在AndroidManifest.xml加入如下内容：
<uses-permission android:name="android.permission.INTERNET" />
例如：
<manifest ... >
<uses-permission android:name="android.permission.INTERNET" />
...
</manifest>
WebView视图使用public void loadUrl (String url)方法加载参数指定的Web页，
例如，假设视图中WebView视图的id是webview，那么下列代码示意加载新浪网的Web页：
WebView myWebView = (WebView)findViewById(R.id.webview);
myWebView .loadUrl("http://www.sina.com");
当WebView视图显示某个Web页之后，如果用户点击Web页中的超链接，将会导致打开系统的内置浏览器，并用内置浏览器访问超链接给出的Web页。
- 如果不想用内置浏览器去访问超链接给出的Web页，而是继续使用WebView视图显示超链接给出的Web页，那么让WebView视图事先调用void setWebViewClient(WebViewClient client)方法，并将WebViewClient类的实例传递给该方法的参数client，例如可以执行如下的代码：
myWebView.setWebViewClient(new WebViewClient());
WebView视图默认不支持Web页中的JavaScript脚本，如果准备让WebView视图支持JavaScript脚本，
//首先要获得WebView视图的WebSettings对象：
WebSettings webSettings = myWebView.getSettings();
//然后WebSettings对象开启对JavaScript脚本的支持：
webSettings.setJavaScriptEnabled(true);
Toast
Toast是Android系统提供的轻量级信息提醒机制，用于向用户提示即时消息，它显示在应用程序界面的最上层，显示一段时间后自动消失不会打断当前操作，也不获得焦点。
Toast.makeText(MainActivity.this,"WIFI已断开",Toast.LENGTH_SHORT).show();
/*
MainActivity.this 当前组件的上下文环境
"WIFI已断开" 提示的字符串信息
Toast.LENGTH_SHORT 显示信息的时长
.show(); 显示信息
*/
ListView的使用
Spinner视图
Spinner视图就是下拉列表，其特点是为用户提供多项选择。
Spinner视图中最重要的属性就是android:entries。
- 在设置该属性值之前，必须首先在值资源中给出下拉列表的选项,即需要在值资源中编写一个值资源类型的XML文件。
该文件必须包含有名字是array的标记,array的item子标记中的文本内容用于指定下拉列表的选项，例如：
<?xml version="1.0" encoding="utf-8"?>
<resources>
<array name="font_list">
<item>宋体</item>
<item>楷体</item>
<item>黑体</item>
</array>
</resources>
该XML文件的名字建议是array.xml。然后,指定android:entries属性的值是值资源某个array标记, 例如android:entries = "@array/font_lis"
常用属性
Spinner动态赋值
动态创建Spinner视图的关键是需要一个实现Adapter接口的类的实例，习惯将这样的类称作一个适配器，适配器的作用是将某些数据转换为Spinner视图中的选项。
//获得一个Spinner视图，
Spinner list = findByViewId(R.id.my_list);
//然后Spinner视图调用
void setAdapter(SpinnerAdapter adapter)方法
ArrayAdapter adapter=new ArrayAdapter(this , layoutID , array);
数据适配器(Adapter)
ArrayAdapter也是BaseAdapter的子类，用法与SimpleAdapter类似，开发者只需要在构造方法里面传入相应参数即可。ArrayAdapter通常用于适配TextView控件。
的构造方法如下：
处理Spinner选择事件
需要使用实现AdapterView.OnItemSelectedListener接口
重写接口中的onItemSelected和onNothingSelected方法。
例如：
public void onItemSelected(AdapterView parent, View view, int pos, long id) {
//参数parent存放着当前Spinner视图的引用，参数pos的值是被选中的选项的索引值（从0开始）
Object item= parent.getItemAtPosition(pos);//返回选中的选项
}
public void onNothingSelected(AdapterView<?> parent) {
// Another interface callback
}
选择事件带来的问题
Spinner视图的首项（索引值是0的项）默认处于选中状态，因此如果程序代码部分处理了选择事件，那么程序就会立刻执行onItemSelected方法。如果希望用户选择某项后再进行有关操作，代码部分可以不处理选择事件，而是处理一个按钮的onClick事件。当处理onClick事件时，再根据Spinner视图的中的选项情况进行相关的操作 。
ListView
ListView以列表的形式展示数据内容，并且能够根据列表的高度自适应屏幕显示。
| 属性名称 | 功能描述 |
|---|---|
| android:listSelector | 当条目被点击后，改变条目的背景颜色 |
| android:divider | 设置分割线的颜色 |
| android:dividerHeight | 设置分割线的高度 |
| android:scrollbars | 是否显示滚动条 |
| android:fadingEdge | 去掉上边和下边的黑色阴影 |
Adapter
数据适配器是数据与视图之间的桥梁，它类似于一个转换器，将复杂的数据转换成用户可以接受的方式进行呈现。
常用的数据适配器
BaseAdapter
SimpleAdapter
ArrayAdapter
BaseAdapter
顾名思义BaseAdapter是基本的适配器。他实际上是一个抽象类，通常在自定义适配器时会继承BaseAdapter。
BaseAdapter中的方法
| 方法名称 | 功能描述 |
|---|---|
| public int getCount() | 获取Item条目的总数 |
| public Object getItem(int position) | 根据position（位置）获取某个Item的对象 |
| public long getItemId(int position) | 根据position（位置）获取某个Item的id |
| public View getView(int position, View convertView, ViewGroup parent) | 获取相应position对应的Item视图，position是当前Item的位置，convertView用于复用旧视图，parent用于加载XML布局。 |
SimpleAdapter
SimpleAdapter extends BaseAdapter，实现了BaseAdapter的四个抽象方法并进行封装。因此在使用SimpleAdapter进行数据适配时，只需要在构造方法中传入相应的参数即可。SimpleAdapter的构造方法的具体信息如下：
public SimpleAdapter(
Context context,//上下文对象，一般就是本页面this
List<? extends Map<String, ?>> data, //数据集合
int resource,//Item布局的资源id
String[] from,//Map集合中的key值
int[] to//Item布局中对应的控件
)
优化加载数据
使用ViewHolder类
在加载Item布局时，会使用findViewById()方法找到Item布局中的各个控件，在每一次加载新的Item数据时都会进行控件寻找，这样也会产生耗时操作。
为了优化ListView减少耗时操作，可以将要加载的子View放在ViewHolder类中，当第一次创建convertView时将这些控件找出，在第二次重用convertView时就可直接通过convertView中的getTag()方法获得这些控件。
复用convertView
为了防止数据量过大造成内存溢出，在使用ListView时通常会进行优化，其中一种是复用convertView。
对话框AltertDialog
RecyclerView
RecyclerView：是Android5.0之后提供的用于在有限的窗口范围内显示大量数据的控件。
与ListView相比，RecyclerView的优势为：
-
展示效果：RecyclerView控件可以通过LayoutManager类实现横向或竖向的列表效果、瀑布流效果和GridView效果，而ListView控件只能实现竖直的列表效果。
-
适配器：RecyclerView控件使用的是RecyclerView.Adapter适配器，该适配器将BaseAdapter中的getView()方法拆分为onCreateViewHolder()方法和onBindViewHolder()方法，强制使用ViewHolder类，使代码编写规范化
-
复用效果：RecyclerView控件复用Item对象的工作由该控件自己实现，而ListView控件复用Item对象的工作需要开发者通过convertView的setTag()方法和getTag()方法进行操作。
-
动画效果：RecyclerView控件可以通过setItemAnimator()方法为Item添加动画效果，而ListView控件不可以通过该方法为Item添加动画效果。
实现步骤
一、在app/build.gradle中添加RecyclerView 依赖库
implementation 'androidx.recyclerview:recyclerview:1.2.0-alpha01‘
二、定义Layout中视图对象
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
三、自定义Adapter
class MyRecyclerAdapter extends RecyclerView.Adapter<VH>
四、定义LayoutManager
- LinearLayoutManager：横向、纵向的列表
- GridLayoutManager：像GridView一样的网格布局
- StaggeredGridLayoutManager：瀑布流的效果
五、设置RecyclerView 的Adapter
recyclerView.setAdapter(adapter)
自定义View
当使用系统控件不满足需求时，需要自定义控件。
最简单的自定义View就是创建一个类继承自View类或者其子类，并重写该类的构造方法。
浙公网安备 33010602011771号