English | 简体中文

A wheel picker for Android, built on ListView, with customizable styles.

Download the sample APK

Features

• Customizable wheel style
• Two skins: Common and Holo
• Two item templates: text, and image with text
• Loop scrolling
• Extra text next to the selected item
• Configurable number of visible items
• Linked wheels (e.g. province / city)
• Works inside scrolling containers (NestedScrollView)
• Wheel dialog
• Click events on the selected item

ScreenShot

Usage

Gradle:

1. Add the JitPack repository to settings.gradle:

dependencyResolutionManagement {
    repositories {
        google()
        mavenCentral()
        maven { url = 'https://jitpack.io' }
    }
}

2. Add the dependency to your module's build.gradle:

implementation 'com.github.venshine:WheelView:2.1.0'

Gradle Kotlin DSL:

// settings.gradle.kts
dependencyResolutionManagement {
    repositories {
        google()
        mavenCentral()
        maven("https://jitpack.io")
    }
}

// build.gradle.kts
implementation("com.github.venshine:WheelView:2.1.0")

Since 2.0.0 the library is published via JitPack. The old coordinate com.wx.wheelview:wheelview can no longer be downloaded. The color fields of WheelViewStyle (backgroundColor, holoBorderColor, textColor, selectedTextColor) are now Integer. null means the default color, so Color.WHITE now works. Since 2.0.2, when switching the main wheel changes the data of a linked sub wheel, the sub wheel goes back to its first item (it used to keep its position).

Demo

The library is written in Java and can be called directly from both Java and Kotlin. It adds no Kotlin dependency to your project.

Kotlin:

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val wheelView = findViewById<WheelView<String>>(R.id.wheelview)
        wheelView.setWheelAdapter(ArrayWheelAdapter(this)) // text adapter
        wheelView.skin = WheelView.Skin.Holo // Holo skin
        wheelView.setWheelData(listOf("item0", "item1", "item2", "item3", "item4")) // data
        wheelView.style = WheelView.WheelViewStyle().apply {
            selectedTextColor = Color.BLACK
            holoBorderColor = Color.LTGRAY // divider color
            selectedBackgroundColor = Color.parseColor("#f2f2f2") // selected item background
            textScale = 0.85f // shrink unselected items step by step
        }
        wheelView.setOnWheelItemSelectedListener { position, item ->
            Log.d("WheelView", "selected $position: $item")
        }
    }
}

Linked wheels (province / city):

val cities = hashMapOf(
    "Zhejiang" to listOf("Hangzhou", "Ningbo", "Wenzhou"),
    "Jiangsu" to listOf("Nanjing", "Suzhou", "Wuxi"),
)
val provinceWheel = findViewById<WheelView<String>>(R.id.province_wheelview)
provinceWheel.setWheelAdapter(ArrayWheelAdapter(this))
provinceWheel.setWheelData(listOf("Zhejiang", "Jiangsu"))
val cityWheel = findViewById<WheelView<String>>(R.id.city_wheelview)
cityWheel.setWheelAdapter(ArrayWheelAdapter(this))
cityWheel.setWheelData(cities.getValue("Zhejiang"))
provinceWheel.join(cityWheel)
provinceWheel.joinDatas(cities) // keys are the display text of the main wheel items

Wheel dialog:

WheelViewDialog<String>(this)
    .setTitle("Please select")
    .setItems(listOf("item0", "item1", "item2", "item3", "item4"))
    .setButtonText("OK")
    .setOnDialogItemClickListener { position, item -> Log.d("WheelView", "$position: $item") }
    .show()

A wheel created in code with WheelView(context) must be added to the view hierarchy with addView before it is displayed. The wheel height is always item height × wheel size (setWheelSize), and layout_height has no effect. For a different height, extend BaseWheelAdapter with your own item layout.

Java:

public class MainActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WheelView<String> wheelView = findViewById(R.id.wheelview);
        wheelView.setWheelAdapter(new ArrayWheelAdapter<>(this)); // text adapter
        wheelView.setSkin(WheelView.Skin.Common); // Common skin
        wheelView.setWheelData(Arrays.asList("item0", "item1", "item2", "item3", "item4")); // data
    }
}

XML:

<com.wx.wheelview.widget.WheelView
    android:id="@+id/wheelview"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

Methods:

| method | description | |:--- |:---| | void setWheelAdapter(BaseWheelAdapter adapter) | Set the adapter (required) | | void setWheelData(List list) | Set the data (required) | | void setLoop(boolean loop) | Enable loop scrolling | | void setWheelSize(int wheelSize) | Set the number of visible items (odd number) | | void setSkin(Skin skin) | Set the skin | | Skin getSkin() | Get the skin | | void setStyle(WheelViewStyle style) | Set the style | | WheelViewStyle getStyle() | Get the style | | void setWheelClickable(boolean clickable) | Make the selected item clickable | | void setSelection(final int selection) | Select the item at a position | | int getSelection() | Get the position passed to setSelection | | void join(WheelView wheelView) | Link a sub WheelView | | void joinDatas(HashMap<String, List> map) | Data of the linked sub WheelView; keys are the display text (toString()) of the main wheel items | | int getCurrentPosition() | Get the current position | | T getSelectionItem() | Get the item at the current position | | void setExtraText(String text, int textColor, int textSize, int margin) | Set extra text next to the selected item | | int getWheelCount() | Get the number of items | | void setOnWheelItemSelectedListener(OnWheelItemSelectedListener onWheelItemSelectedListener) | Listen for the selected item when scrolling stops | | void setOnWheelItemClickListener(OnWheelItemClickListener onWheelItemClickListener) | Listen for clicks on the selected item | | WheelViewDialog setDialogStyle(int color) | Set the dialog color |

WheelViewStyle:

| field | description | |:--- |:---| | Integer backgroundColor | Background color; null uses the skin default | | Integer holoBorderColor | Divider color of the Holo skin | | int holoBorderWidth | Divider width of the Holo skin in px, default 3 | | Integer textColor | Text color | | Integer selectedTextColor | Text color of the selected item | | Integer selectedBackgroundColor | Background color of the selected item, for the Common and Holo skins | | int textSize | Text size in dp, default 16 | | int selectedTextSize | Text size of the selected item in dp | | float textAlpha | Alpha of unselected items (0f ~ 1f); items fade further away from the selection, default 0.7 | | float textScale | Scale of unselected items (0f ~ 1f), applied once more for each step away from the selection; no scaling by default | | float selectedTextZoom | Zoom factor of the selected text, used when selectedTextSize is not set | | boolean selectedTextBold | Bold text for the selected item |

History

• 1.0.0(2016-03-24)
  • First release
• 1.1.0(2016-03-28)
  • Linked wheels
• 1.2.3(2016-04-14)
  • Works inside scrolling containers
• 1.3.0(2016-04-15)
  • Wheel dialog
• 1.3.1(2016-04-18)
  • Click events on the selected item
• For 2.0.0 and later, see Releases

About

• Email: venshine.cn@gmail.com

License

Copyright (C) 2016 venshine.cn@gmail.com

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.