It has been more than a week since the first project summary “Android Project Summary (1)- arc ViewPager and arc HeaderView”, and while I have time today weekend, I will bring you the second one: selectors used in the project.
A, requirements,
In our development process, we may encounter the need to give the user several options or to select values from a range without the user having to manually enter them. Typical scenarios are as follows: the receiving address of e-commerce APP, and the user selects provinces and counties. When filling in the date of birth, the user selects the year, month and day, or some other number worth selecting, etc. There is a similar feature in the recent project, so it is summarized here.
Several scenarios used in the project:
1. Selection of year, month and day
2, provincial and urban three-level linkage
3. Time selection
4. Numerical selection
PickerView
If you need a time selector or provinces and counties linkage control, just a Google, out of a large number, but is really useful to use not much, today for everyone to recommend a used open source control AndroidpikerView, it can basically meet all the choices in your project: Year, month, day and time selection, two-level linkage, three-level linkage, and selection from a given list.
Github address: github.com/Bigkoo/Andr…
It has the following functions:
- Three-level linkage
- Setting Linkage
- Set cycle mode
- Supports custom layout.
- Supports item separator Settings.
- Item spacing is supported.
- The time picker supports start and end dates.
- Support “year, month, day, hour, minute, second”, “province, city, region” and other options of the unit (label) display, hide and customize.
- Supports customization of text, color, and text size
- When the length of the Item text is too long, the text adaptively scales to the length of the Item to avoid the problem of incomplete display
- Dialog mode is supported.
- Supports custom container Settings.
There are two kinds of selectors in the PickerView:
- A selector for selecting the time and date: TimePickerView
- Select a selector for a given range or a given option, secondary and tertiary linkage: OptionsPickerView
It is very simple to use, using the constructor mode, many configurable items, can be configured according to their own needs, as follows:
pvTime = new TimePickerView.Builder(this.new TimePickerView.OnTimeSelectListener() {
@Override
public void onTimeSelect(Date date,View v) {// Select the event callback
tvTime.setText(getTime(date));
}
})
.setType(new boolean[] {true.true.true.true.true.true})// All displays by default
.setCancelText("Cancel")// Cancel button text
.setSubmitText("Sure")// Confirm the button text
.setContentSize(18)// Scroll the text size
.setTitleSize(20)// Title text size
.setTitleText("Title")// Title text
.setOutSideCancelable(false)// Click the screen, click on the control outside the range, whether to cancel the display
.isCyclic(true)// Whether to iterate
.setTitleColor(Color.BLACK)// Title text color
.setSubmitColor(Color.BLUE)// Determine the button text color
.setCancelColor(Color.BLUE)// Cancel the button text color
.setTitleBgColor(0xFF666666)// Title background color Night mode
.setBgColor(0xFF333333)// The background color of the wheel Night mode
.setDate(selectedDate)// If not set, the default is system time */
.setRangDate(startDate,endDate)// Start terminate year month day setting
.setLabel("Year"."Month"."Day"."When"."Points"."Seconds")// The default setting is year, month, day, hour, minute, second
.isCenterLabel(false) // Whether to display only the label text of the middle selected item. If false, all items have labels.
.isDialog(true)// Whether to display the dialog style
.build();Copy the codeIii. Project practice
1. Selection of year, month and day
The code is as follows:
TimePickerView pvTime = new TimePickerView.Builder(this.new TimePickerView.OnTimeSelectListener() {
@Override
public void onTimeSelect(Date date, View v) {
Calendar calendar = Calendar.getInstance();
calendar.setTime(date);
mTextViewYear.setText(calendar.get(Calendar.YEAR) + "");
mTextViewMonth.setText(calendar.get(Calendar.MONTH) + 1 + "");// The month is one less than the actual month
mTextViewDay.setText(calendar.get(Calendar.DAY_OF_MONTH) + "");
mBirthday = DateUtils.getDateString(date);
Log.e("TAG"."birth:" + mBirthday);
}
})
.isCenterLabel(false)
.setType(new boolean[] {true.true.true.false.false.false})
.setDate(selectedDate)
.setRangDate(startDate, endDate)
.setTitleText("Born")
.setBgColor(Color.parseColor("#F6F7F6"))
.setTitleSize(getResources().getColor(R.color.text_color_333))
.setSubmitColor(getResources().getColor(R.color.text_color_main))
.setCancelColor(getResources().getColor(R.color.text_color_999))
.build();
pvTime.show();Copy the codeThe effect is as follows:
The TimePickerView conveniently selects a start date, an end date, and a default date that pops up.
2. Three-level linkage between provinces and counties
The code is as follows:
private void showPickerView(a) {// Pop up the selector
OptionsPickerView pvOptions = new OptionsPickerView.Builder(this.new OptionsPickerView.OnOptionsSelectListener() {
@Override
public void onOptionsSelect(int options1, int options2, int options3, View v) {
// Returns three levels of selected positions
mProvince = mProvinceBean.options1Items.get(options1).getPickerViewText();
mCity = mProvinceBean.options2Items.get(options1).get(options2);
mArea = mProvinceBean.options3Items.get(options1).get(options2).get(options3);
setProvinceText();
}
})
.setTitleText("City Choice")
.setDividerColor(Color.GRAY)
.setTextColorCenter(Color.BLACK) // Set the text color of the selected item
.setContentTextSize(20)
.setBgColor(Color.parseColor("#F6F7F6"))
.setTitleSize(getResources().getColor(R.color.text_color_333))
.setSubmitColor(getResources().getColor(R.color.text_color_main))
.setCancelColor(getResources().getColor(R.color.text_color_999))
.build();
pvOptions.setPicker(mProvinceBean.options1Items, mProvinceBean.options2Items, mProvinceBean.options3Items);// Level selector
pvOptions.show();
}Copy the codeThe effect is as follows:
3. Time selection
The code is as follows:
protected void showTimePicker(TimePickerView.OnTimeSelectListener listener) {
if(mTimePicker ! =null) {
mTimePicker.show();
return;
}
Calendar selectedDate = Calendar.getInstance();
Calendar startDate = Calendar.getInstance();
Calendar endDate = Calendar.getInstance();
// Correct setting mode Cause: The precautions are described
selectedDate.set(1990.0.1);
startDate.set(1949.0.1);
// Get the current year, month, and day
endDate.setTimeInMillis(System.currentTimeMillis());
mTimePicker = new TimePickerView.Builder(this, listener)
.isCenterLabel(false)
.setType(new boolean[] {false.false.false.true.true.false})
.setDate(selectedDate)
.setRangDate(startDate, endDate)
.setTitleText("Measurement time")
.setBgColor(Color.parseColor("#F6F7F6"))
.setTitleSize(getResources().getColor(R.color.text_color_333))
.setSubmitColor(getResources().getColor(R.color.text_color_main))
.setCancelColor(getResources().getColor(R.color.text_color_999))
.build();
mTimePicker.show();
}Copy the codeThe effect is as follows:
4. Numerical selection
The code is as follows:
mOptionsPickerView = createHighBasePicker(title, new OptionsPickerView.OnOptionsSelectListener() {
@Override
public void onOptionsSelect(int options1, int options2, int options3, View v) {
mBsValue = datas.get(options1).bs;
mItemBloodSugar.setContent(mBsValue + ""); mStatusView.setBSValue(mBsValue); }}); mOptionsPickerView.setPicker(datas); mOptionsPickerView.show();// The createHighBasePicker method is as follows:
protected OptionsPickerView createHighBasePicker(String title, OptionsPickerView.OnOptionsSelectListener listener) {
OptionsPickerView picker = new OptionsPickerView.Builder(this, listener)
.setTitleText(title)
.setBgColor(Color.parseColor("#F6F7F6"))
.setTitleSize(getResources().getColor(R.color.text_color_333))
.setSubmitColor(getResources().getColor(R.color.text_color_main))
.setCancelColor(getResources().getColor(R.color.text_color_999))
.build();
return picker;
}Copy the codeThe effect is as follows:
Third, summary
The above are several scenarios used in the project. Of course, the functions are not limited to this, and some secondary linkage and custom style functions are not demonstrated. If you need them, you can go to Github homepage to see the relevant introduction, or go to Demo to see the usage of various selectors. Overall a pretty good open source project, close to 6K Star. Those who need it go and have a try!
More dry articles, pay attention to the public number:
