All Projects → wangpeiming110 → Wheelview

wangpeiming110 / Wheelview

a great functional custom WheelView with demo in dialog and bottomDialog,android 滚动选择控件,滚动选择器,时间选择,日期选择

Programming Languages

java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to Wheelview

Finalcut
A text-based widget toolkit
Stars: ✭ 244 (+454.55%)
Mutual labels:  widget, dialog
Flutter app
🔥🔥🔥本项目包括各种基本控件使用(Text、TextField、Icon、Image、Listview、Gridview、Picker、Stepper、Dialog、Slider、Row、Appbar、Sizebox、BottomSheet、Chip、Dismissible、FlutterLogo、Check、Switch、TabBar、BottomNavigationBar、Sliver等)、豆瓣电影、tubitv、每日一文、和天气、百姓生活、随机诗词、联系人、句子迷、好奇心日报、有道精品课、高德定位、音乐播放器🎵、追书神器等板块
Stars: ✭ 2,140 (+4763.64%)
Mutual labels:  widget, dialog
wui
Collection of GUI widgets for the web
Stars: ✭ 44 (+0%)
Mutual labels:  widget, dialog
Uploadcare Widget
Uploadcare Widget, an ultimate tool for HTML5 file upload supporting multiple file upload, drag&drop, validation by file size/file extension/MIME file type, progress bar for file uploads, image preview.
Stars: ✭ 183 (+315.91%)
Mutual labels:  widget, dialog
Flutter crop
Crop any widget/image in Android, iOS, Web and Desktop with fancy and customizable UI, in pure Dart code.
Stars: ✭ 107 (+143.18%)
Mutual labels:  demo, widget
Widgetexamples
A demo project showcasing different types of Widgets created with SwiftUI and WidgetKit.
Stars: ✭ 125 (+184.09%)
Mutual labels:  demo, widget
Material Viewpagerindicator
Dot-based Android ViewPager indicator with Material Design animations.
Stars: ✭ 511 (+1061.36%)
Mutual labels:  demo, widget
Bootstrap Show Modal
A Bootstrap 4 / jQuery plugin wrapper, to create modals dynamically in JavaScript
Stars: ✭ 38 (-13.64%)
Mutual labels:  dialog
React Antd Todo
A simple todo list app built with React, Redux and Antd - Ant Design
Stars: ✭ 42 (-4.55%)
Mutual labels:  demo
Dom Examples
Code examples that accompany various MDN DOM and Web API documentation pages
Stars: ✭ 984 (+2136.36%)
Mutual labels:  demo
Dstc7 Audio Visual Scene Aware Dialog Avsd Challenge
Stars: ✭ 37 (-15.91%)
Mutual labels:  dialog
Flutter mono kit
A collection of convenient widgets and utils made by mono.
Stars: ✭ 39 (-11.36%)
Mutual labels:  widget
Realtime Detectron
Real-time Detectron using webcam.
Stars: ✭ 42 (-4.55%)
Mutual labels:  demo
Segmentedcontrol
Cross-platform segmented control for Titanium
Stars: ✭ 37 (-15.91%)
Mutual labels:  widget
Beziercurve
Bezier curve master
Stars: ✭ 43 (-2.27%)
Mutual labels:  demo
Dejajs Components
Angular components
Stars: ✭ 37 (-15.91%)
Mutual labels:  demo
Flutter Chat Demo
The chat app made by Flutter and Firebase
Stars: ✭ 1,016 (+2209.09%)
Mutual labels:  demo
Snapfeed Sdk
Interactive user feedback tool for Flutter 🎉
Stars: ✭ 43 (-2.27%)
Mutual labels:  widget
Caroline
A simple Cairo Chart Library for GTK and Vala
Stars: ✭ 41 (-6.82%)
Mutual labels:  widget
Redaxo Mit Docker
Simple 🐳 Docker setup for REDAXO development. Contains demo website and beginner’s guide!
Stars: ✭ 40 (-9.09%)
Mutual labels:  demo

WheelView

a great functional custom WheelView with demo in dialog and bottomDialog,android 滚动选择控件,滚动选择器

=========

Attributes

There are several attributes you can set:

attr 属性 description 描述
lineColor divider line color 分割线颜色
itemVisibleNum wheelview show item count 此wheelView显示item的个数
textColorOuter unSelected Text color 未选中文本颜色
textSizeOuter unSelected Text size 未选中文本字体大小
textColorCenter selected Text color 选中文本颜色
textSizeCenter selected Text size 选中文本字体大小
isLoop isLoop or no 滚轮是否首尾相连
lineSpaceingDimens item unit margin height 每个item单元格中文字距离上下的高度
wheelGravity align direction:left;center;right 对齐方向:靠左对齐 居中 靠右对齐

Method

1. setItems(List items, int initPosition)

set WheelView items and init selected position 设置WheelView的数据和初始位置

2. setOnItemSelectedListener(OnItemSelectedListener OnItemSelectedListener)

set listener on WheelView that can get info when WheelView changed selected item. 对WheelView设置监听器,当WheelView 选中项改变时返回选中项的索引和值。

How to use

layout:

    <wheelview.WheelView
        android:id="@+id/wheel_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="50dp"
        android:layout_marginRight="50dp"
        app:textColorCenter="@android:color/holo_blue_dark"
        app:lineSpaceingDimens="15dp"
        app:itemVisibleNum="3"
        app:lineColor="@android:color/holo_blue_dark"
        app:textSizeCenter="20dp"
        app:textSizeOuter="16dp"
        app:isLoop="false"
        app:textColorOuter="@android:color/darker_gray"
        />

Activity:

WheelView wva = (WheelView) findViewById(R.id.wheel_view);
wva.setItems(Arrays.asList(PLANETS),1);//init selected position is 1 初始选中位置为1
wva.setOnItemSelectedListener(new WheelView.OnItemSelectedListener() {
	@Override
	public void onItemSelected(int selectedIndex, String item) {
		Log.d(TAG, "selectedIndex: " + selectedIndex + ", item: " + item);
	}
});

Show in dialog:

View outerView = LayoutInflater.from(this).inflate(R.layout.dialog_content_view, null);
final WheelView wv = (WheelView) outerView.findViewById(R.id.wheel_view_wv);
wv.setItems(getNumbers(),0);//init selected position is 0 初始选中位置为0
wv.setOnItemSelectedListener(new WheelView.OnItemSelectedListener() {
	@Override
	public void onItemSelected(int selectedIndex, String item) {
		Log.d(TAG, "[Dialog]selectedIndex: " + selectedIndex + ", item: " + item);
	}
});

new AlertDialog.Builder(this)
		.setTitle("WheelView in Dialog")
		.setView(outerView)
		.setPositiveButton("OK", new DialogInterface.OnClickListener() {
			@Override
			public void onClick(DialogInterface dialog, int which) {
				Toast.makeText(MainActivity.this,
						"selectedIndex: "+ wv.getSelectedPosition() +"  selectedItem: "+ wv.getSelectedItem(),
						Toast.LENGTH_SHORT).show();
			}
		})
		.show();

Show in a bottomDialog:

View outerView1 = LayoutInflater.from(this).inflate(R.layout.dialog_select_date_time, null);
//日期滚轮
final WheelView wv1 = (WheelView) outerView1.findViewById(R.id.wv1);
//小时滚轮
final WheelView wv2 = (WheelView) outerView1.findViewById(R.id.wv2);
//分钟滚轮
final WheelView wv3 = (WheelView) outerView1.findViewById(R.id.wv3);

final TimeRange timeRange = getTimeRange();
wv1.setItems(Common.buildDays(timeRange),0);
wv2.setItems(Common.buildHourListStart(timeRange),0);
wv3.setItems(Common.buildMinuteListStart(timeRange),0);

//联动逻辑效果
wv1.setOnItemSelectedListener(new WheelView.OnItemSelectedListener() {
	@Override
	public void onItemSelected(int index,String item) {
		List hourStrList = Common.buildHoursByDay(wv1, timeRange);
		int newIndexHour = hourStrList.indexOf(wv2.getSelectedItem());
		wv2.setItems(hourStrList,newIndexHour);
		List minStrList = Common.buildMinutesByDayHour(wv1, wv2, timeRange);
		int newIndexMin = minStrList.indexOf(wv3.getSelectedItem());
		wv3.setItems(minStrList,newIndexMin);
	}
});
wv2.setOnItemSelectedListener(new WheelView.OnItemSelectedListener() {
	@Override
	public void onItemSelected(int index,String item) {
		List minStrList = Common.buildMinutesByDayHour(wv1, wv2, timeRange);
		int newIndexMin = minStrList.indexOf(wv3.getSelectedItem());
		wv3.setItems(minStrList,newIndexMin);
	}
});

TextView tv_ok = (TextView) outerView1.findViewById(R.id.tv_ok);
TextView tv_cancel = (TextView) outerView1.findViewById(R.id.tv_cancel);
//点击确定
tv_ok.setOnClickListener(new View.OnClickListener() {
	@Override
	public void onClick(View arg0) {
		bottomDialog.dismiss();
		String selectDateTimeStrToShow;
		String mSelectDate = wv1.getSelectedItem();
		String mSelectHour = wv2.getSelectedItem();
		String mSelectMin = wv3.getSelectedItem();
		String time = mSelectHour + mSelectMin;
		time = Common.timeToStr(Common.dateTimeFromCustomStr( mSelectDate, time));
		selectDateTimeStrToShow = mSelectDate + "  " + time;
		Toast.makeText(MainActivity.this, "selectDateTime: "+selectDateTimeStrToShow, Toast.LENGTH_SHORT).show();
	}
});
//点击取消
tv_cancel.setOnClickListener(new View.OnClickListener() {
	@Override
	public void onClick(View arg0) {
		bottomDialog.dismiss();
	}
});
//防止弹出两个窗口
if (bottomDialog !=null && bottomDialog.isShowing()) {
	return;
}

bottomDialog = new BottomDialog(this, R.style.ActionSheetDialogStyle);
//将布局设置给Dialog
bottomDialog.setContentView(outerView1);
bottomDialog.show();//显示对话框
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].