文章目录
1.SeekBar组件(拖动条)
拖动条通过滑块位置来标识数值,拖动条允许用户拖动滑块来改变数值,因此拖动条常用于对系统的某种数值进行调节,比如调节音量。
SeekBar允许用户改变拖动条的滑块外边:
属性 | 介绍 |
---|---|
android:thumb | 指定一个Drawable对象,该对象作为自定义滑块 |
为了程序能响应拖动条滑块位置,通过设置OnSeekBarChangeListener监听事件实现
实例:定义两个组件,ImageView用于显示图片,SeekBar用于动态改变图片的透明度
①布局文件内容
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--用于演示的照片-->
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="@drawable/p1" />
<!--拖动进度条-->
<!--android:thumb 设置拖动条样式,这里为眼球状照片资源-->
<SeekBar
android:id="@+id/seekbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="255"
android:progress="255"
android:thumb="@drawable/view" />
</LinearLayout>
②在Activity文件代码
package com.android.seekbar;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.SeekBar;
public class MainActivity extends AppCompatActivity {
//1.1 创建对象
ImageView image; //图片
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//1.2 关联图片控件、拖动条控件
image = findViewById(R.id.image);
SeekBar seekBar = findViewById(R.id.seekbar);
//2.1 创建拖动条监听事件
seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
@Override
//2.2 当拖动滑块位置发生改变时,触发该方法
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
//3.使用setImageAlpha()方法设置透明度
image.setImageAlpha(progress);
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
}
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
}
});
}
}
③运行结果:
2.RatingBar组件(星级评分条)
星级评分条和拖动条有相同的父类:AbsSeekbar,因此它们十分相似,并且用法和功能都十分接近:允许用户通过拖动来改变进度。Ratingba与SeekBar最大区别在于:RatingBar通过星星来表示进度
属性 | 介绍 |
---|---|
android:isIndicator | 设置该星级评分条是否允许用户改变(true为不允许修改) |
android:numStars | 设置该星级评分条总共有多少个星级 |
android:rating | 设置该星级评分条默认的星级 |
android:stepSize | 设置每次最少需要改变多少个星级 |
为了让程序响应星级评分条评分的改变,通过设置OnRatingBarChangeListener监听事件实现
①布局代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--用于实践的照片-->
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="@drawable/p1" />
<!--定义星级评分条-->
<RatingBar
android:id="@+id/ratingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
android:max="255"
android:progress="255"
android:stepSize="0.5"
android:layout_gravity="center"/>
</LinearLayout>
②Activity文件代码
package com.android.ratingbar;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.RatingBar;
public class MainActivity extends AppCompatActivity {
//1.1 创建对象
ImageView image;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//1.2关联控件
image = findViewById(R.id.image);
RatingBar ratingBar = findViewById(R.id.ratingBar);
//2.1 设置监听事件
ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
@Override
public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
//2.2 动态改变图片透明度,其中255是星级评分条的最大值,5个星星就代表最大值255
image.setImageAlpha((int)(rating*255/5));
}
});
}
}
③运行结果:
3.CalendarView组件(日历视图)
日历视图(CalendarView)可用于显示和选择日期,用户可选择一个日期,也可以通过触摸来滚动日历。如果希望监控该组件的额日期改变,则可以通过CalendarView的setOnDateChangeListener()方法为此组件的点击事件添加监听事件。
属性 | 介绍 |
---|---|
android:dateTextAppearance | 设置该日历视图的日期文字的样式 |
android:firstDayOfWeek | 设置每周的第一天,允许设置周一到周日任意一天作为每周的第一天;3对应周二、4对应周三、1对应周日 |
android:maxDate | 设置该日历组件支持的最大日期,以mm/dd/yyyy格式指定最大日期 |
andriod:minDate | 设置该日历组件支持的最小日期,以mm/dd/yyyy格式指定最小日期 |
android:weekDayTextAppearance | 设置星期几的文字样式 |
网上搜索你会发现这个属性还是蛮多的,但大多要么过时,要么无效了,所以没写
本实例重点是在界面布局文件中添加一个CalendarView组件,通过setOnDateChangeListener()方法实现监听事件
①布局文件内容
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="选择您的生日"
android:gravity="center"/>
<!--日历组件-->
<CalendarView
android:id="@+id/calendarView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shownWeekCount="4"
android:selectedWeekBackgroundColor="#aff"
android:weekSeparatorLineColor="#f00"
android:unfocusedMonthDateColor="#f9f"
android:layout_gravity="center" />
<!--用于显示点击后的显示文本-->
<TextView
android:id="@+id/show"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp" />
</LinearLayout>
②Activity文件代码
package com.android.calendarview;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.CalendarView;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//1.实例化
CalendarView cv = findViewById(R.id.calendarView);
//2.设置监听事件
cv.setOnDateChangeListener(new CalendarView.OnDateChangeListener() {
@Override
public void onSelectedDayChange(@NonNull CalendarView view, int year, int Month, int dayOfMonth) {
//3.1 设置显示文本
TextView textView = findViewById(R.id.show);
//3.2 月份默认从0开始
textView.setText("生日:" + year + "年" + (Month+1) + "月" + dayOfMonth + "日");
}
});
}
}
③运行结果:
注:也不知道是控件问题还是我的问题,这个月份有点问题…月份默认从0开始,而不是1,所以在监听方法中,给month+1,看了网上别人的代码都没加
4.DatePicker(日期选择器)和TimePicker(时间选择器)
DatePicker和TimePicker是两个比较易用的组件,它们都是从FrameLayout派生而来,其中DatePicker用于选择日期;TimePicker用于选择时间。开发中,这两个组件经常一起使用
属性 | 介绍 |
---|---|
android:calendarViewShown | 设置该日期选择器是否显示CalendarView组件 |
android:endYear | 设置日期选择器允许选择的最后一年 |
android:maxDate | 设置该日期选择器支持的最大日期。以mm/dd/yyyy格式指定最大日期 |
android:minDate | 设置该日期选择器支持的最小日期。以mm/dd/yyyy格式指定最小日期 |
android:spinnersShown | 设置该日期选择器是否显示Spinner日期选择组件 |
android:startYear | 设置日期选择器允许选择的第一年 |
DatePicker通过在init()方法中设置OnDateChangedListener监听器实现监听
TimePicker通过setOnTimeChangedListener监听器实现监听
同时使用DatePicker、TimePicker组件实现选择日期、时间显示的实例
①布局文件;由于多个组件运行后内容显示不完整,这里使用ScrollView控件(竖直滚动条),ScrollView控件中只能定义一个子组件,所以大多时候会定义一个布局控件
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--定义一个DatePicker组件-->
<DatePicker
android:id="@+id/datePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:calendarViewShown="true"
android:endYear="2030"
android:spinnersShown="true"
android:startYear="2000" />
<!--定义一个TimePicker组件-->
<TimePicker
android:id="@+id/timePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<!--显示用户输入日期、时间的控件-->
<!--android:editable 设置是否可编辑
android:cursorVisible 设置光标 显示/隐藏-->
<TextView
android:id="@+id/show"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cursorVisible="false"
android:editable="false" />
</LinearLayout>
</ScrollView>
②Activity文件全部代码:
package com.android.datetimepicker;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.widget.CalendarView;
import android.widget.DatePicker;
import android.widget.TextView;
import android.widget.TimePicker;
import java.util.Calendar;
public class MainActivity extends AppCompatActivity {
//1.定义5个记录时间的变量
//年、月、日、小时、分钟
int Year, Month, Day, Hour, Minute;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//2.实例化 DatePicker、TimePicker组件
DatePicker datePicker = findViewById(R.id.datePicker);
TimePicker timePicker = findViewById(R.id.timePicker);
//3.获取当前年、月、日、小时、分钟
Calendar calendar = Calendar.getInstance();
Year = calendar.get(Calendar.YEAR);
Month = calendar.get(Calendar.MONTH);
Day = calendar.get(Calendar.DAY_OF_MONTH);
Hour = calendar.get(Calendar.HOUR);
Minute = calendar.get(Calendar.MINUTE);
//4.初始化DatePicker组件,设置监听事件
datePicker.init(Year, Month, Day, new DatePicker.OnDateChangedListener() {
@Override
public void onDateChanged(DatePicker view, int year, int monthOfYear, int dayOfMonth) { //形参
//成员变量(本类中自定义的属性) = 形参
Year = year;
Month = monthOfYear;
Day = dayOfMonth;
//7.1 调用show()方法显示时间
show(Year,Month,Day,Hour,Minute);
}
});
//5.初始化TimePicker组件,设置监听事件
timePicker.setOnTimeChangedListener(new TimePicker.OnTimeChangedListener() {
@Override
public void onTimeChanged(TimePicker view, int hourOfDay, int minute) {
Hour = hourOfDay;
Minute = minute;
//7.2 调用show()方法显示时间
show(Year,Month,Day,Hour,Minute);
}
});
}
//6.定义方法,显示内容
public void show(int year,int month,int day,int hour,int minute){
TextView textView=findViewById(R.id.show);
textView.setText(year+"年"+(month+1)+"月"+day+"日"+hour+":"+minute);
}
}
③运行结果;设置了滚动条,可以上下拖动
5.NumberPicker(数值选择器)
数值选择器用于让用户输入数值,用户可以通过键盘输入数值,也可以通过滚动选择数值,通常组件有如下三个方法:
组件方法 | 介绍 |
---|---|
setMinValue(int minValue) | 设置该组件支持的最小值 |
setMaxValue(int maxValue) | 设置该组件支持的最大值 |
setValue(int value) | 设置该组件的当前值 |
通过定义两个NumberPicker组件设置setOnValueChangedListener方法实现监听事件
①布局文件代码
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="选择低价"
android:layout_gravity="center_vertical"/>
<NumberPicker
android:id="@+id/np1"
android:layout_width="120dp"
android:layout_height="70dp"
android:focusable="true"
android:focusableInTouchMode="true" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="选择高价"
android:layout_gravity="center_vertical"/>
<!-- focusable 通过键盘(虚拟键盘或物理键盘)或轨迹球将焦点移动到当前控件上
focusableInTouchMode 可以通过触摸获取焦点 -->
<NumberPicker
android:id="@+id/np2"
android:layout_width="120dp"
android:layout_height="70dp"
android:focusable="true"
android:focusableInTouchMode="true"/>
</TableRow>
</TableLayout>
②Activity文件代码
package com.android.numberpicker;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.NumberPicker;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
//1.1 定义控件
NumberPicker np1, np2;
//1.2 定义最低价格、最高价格的初始值
int minPrice = 25,maxPrice = 75;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//2.1 关联np1控件
np1 = findViewById(R.id.np1);
//2.2 设置最小值,最大值,默认值
np1.setMinValue(20);
np1.setMaxValue(30);
np1.setValue(minPrice);
//2.3 设置监听器
np1.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
@Override
public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
//将最新的数值 赋值给 最小值
minPrice = newVal;
//5.1 调用showToastPrice()方法显示价格
showToastPrice();
}
});
//3.1 关联np2控件
np2 = findViewById(R.id.np2);
//3.2 设置最小值,最大值,默认值
np2.setMinValue(70);
np2.setMaxValue(80);
np2.setValue(maxPrice);
//3.3 设置监听事件
np2.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
@Override
public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
maxPrice = newVal;
//5.2 调用showToastPrice()方法
showToastPrice();
}
});
}
//4.定义展示价格的方法
public void showToastPrice(){
Toast.makeText(this, "最低价格:"+minPrice+"\n"+"最高价格:"+maxPrice,
Toast.LENGTH_SHORT).show();
}
}
③运行结果
6.SearchView(搜索框)
SearchView是搜索框组件,它可以让用户在文本框内输入文字,并允许通过监听器监控用户输入,当用户输入完后提交搜索时,也可以通过监听器执行实际的搜索
方法 | 介绍 |
---|---|
setIconifiedByDefault(boolean iconified) | 设置该搜索框默认是否自动缩小为图标 |
setSubmitButtonEnabled(boolean enabled) | 设置是否显示搜索框 |
setQueryHint(CharSequence hint ) | 设置搜索框默认显示的提示文本 |
setOnQueryTextListener(new SearchView.OnQueryTextListener() | 为搜索框设置事件监听器 |
当为SearchView增加一个配套的ListView,则可以为SearchView增加自动完成的功能。一下实例定义了SearchView和ListView组件,其中ListView为SearchView显示自动补齐列表
①布局文件代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<SearchView
android:id="@+id/sv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focusable="false"
android:focusableInTouchMode="false"/>
<ListView
android:id="@+id/lv"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
②Activity文件代码
package com.android.searchview;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.text.TextUtils;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.SearchView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
//1.实例化SearchView、ListView控件
SearchView sv;
ListView lv;
//2.1 创建自动完成的列表
String[] mStrings = new String[]{"aaaaaa", "bbbbb", "ccccccc"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//2.2 关联控件
sv = findViewById(R.id.sv);
lv = findViewById(R.id.lv);
//2.3 将创建的列表添加到lv上
lv.setAdapter(new ArrayAdapter<String>(this,
R.layout.support_simple_spinner_dropdown_item, mStrings));
//3.1 设置ListView启用过滤
//listview获得当前焦点的时候,相应用户输入的匹配符。筛选出匹配的listview Items
lv.setTextFilterEnabled(true);
//3.2 设置SearchView默认是否自动缩小为图标
sv.setIconifiedByDefault(false);
//3.3 设置该SearchView显示搜索按钮
sv.setSubmitButtonEnabled(true);
//3.4 设置该SearchView默认显示的提示文本
sv.setQueryHint("查找");
//4.1 为SearchView组件设置监听事件
sv.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
//单机搜索按钮时激发该方法
@Override
public boolean onQueryTextSubmit(String query) {
//实际应用中应该在该方法内执行实际查询
//此处仅使用Toast显示用户输入的查询内容
Toast.makeText(MainActivity.this, "选择的是:" + query,
Toast.LENGTH_SHORT).show();
return false;
}
//用户输入字符时激发该方法
@Override
public boolean onQueryTextChange(String newText) {
//如果newText不是长度为0的字符串
if (TextUtils.isEmpty(newText)) { //isEmpty()判断空
//清除ListView的过滤
lv.clearTextFilter();
} else {
//使用用户输入的内容对ListView列表进行过滤
lv.setFilterText(newText);
}
return false;
}
});
}
}
③运行结果
7.ScrollView(垂直滚动视图)和HorizontalScrollView(水平滚动视图)
ScrollView由FrameLayout派生而出,就是一个用于为普通组件添加滚动条的组件。ScrollView里面只能包含一个子组件,大多数会放置布局管理器作为子控件,ScrollView作用就是为该组件添加垂直滚动条。
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#ff0000" />
<TextView
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#00BCD4" />
<TextView
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#FF9800" />
<TextView
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#009688" />
</LinearLayout>
</ScrollView>
运行结果:可以上下拖动
HorizontalScrollView水平滚动条
<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent">
<TextView
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff0000" />
<TextView
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ffdc00" />
<TextView
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff48ad" />
<TextView
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff38dd" />
<TextView
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff90aa" />
</LinearLayout>
</HorizontalScrollView>
运行结果:可以左右拖动