Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alexzaitsev/meter-number-picker
The android library that provides a simple and customizable NumberPicker styled as meter.
https://github.com/alexzaitsev/meter-number-picker
android android-library custom-view meter-number-picker meters meterview numberpicker view
Last synced: 24 days ago
JSON representation
The android library that provides a simple and customizable NumberPicker styled as meter.
- Host: GitHub
- URL: https://github.com/alexzaitsev/meter-number-picker
- Owner: alexzaitsev
- License: apache-2.0
- Created: 2018-01-27T09:12:16.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2020-04-28T22:59:05.000Z (over 4 years ago)
- Last Synced: 2024-10-11T02:49:26.407Z (about 1 month ago)
- Topics: android, android-library, custom-view, meter-number-picker, meters, meterview, numberpicker, view
- Language: Java
- Size: 4.71 MB
- Stars: 98
- Watchers: 8
- Forks: 21
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Meter Number Picker
The android library that provides a simple and customizable NumberPicker styled as meter. It's based on [NumberPicker](https://github.com/ShawnLin013/NumberPicker).
[](https://android-arsenal.com/details/1/6723)
## Usage
Make sure you've added maven central to the list of your repositories at the root `build.gradle`:
```
repositories {
mavenCentral()
}
```
Then add a dependency into your module's `build.gradle`:
```
dependencies {
implementation 'com.alex-zaitsev:meternumberpicker:1.0.5'
}
```
## Content
The library contains 2 views: [MeterNumberPicker](https://github.com/alexzaitsev/meter-number-picker/blob/master/meternumberpicker/src/main/java/com/alexzaitsev/meternumberpicker/MeterNumberPicker.java) and [MeterView](https://github.com/alexzaitsev/meter-number-picker/blob/master/meternumberpicker/src/main/java/com/alexzaitsev/meternumberpicker/MeterView.java). `MeterNumberPicker` is a base block for `MeterView`. On the screenshot above whole view is the `MeterView` and a single block of it is `MeterNumberPicker`. They are pretty simple, you can easily create your own meter class based on them.
## Usage
Firstly, create a style for your number picker:
```
<item name="mnp_min">0</item>
<item name="mnp_max">9</item>
<item name="mnp_textColor">@android:color/white</item>
<item name="mnp_textSize">50sp</item>
<item name="mnp_paddingHorizontal">5dp</item>
<item name="mnp_paddingVertical">25dp</item>
```
Then, create a style for your meter view and pass the previous style:
```
<item name="mv_firstColor">@android:color/black</item>
<item name="mv_numberOfFirst">5</item>
<item name="mv_numberOfSecond">1</item>
<item name="mv_pickerStyle">@style/MeterNumberPickerStyle</item>
<item name="mv_secondColor">@android:color/holo_red_dark</item>
```
Almost there! Now create your view and apply the style:
```
```
You can use `MeterNumberPicker` directly without `MeterView` wrapper. Look at the [MeterView](https://github.com/alexzaitsev/meter-number-picker/blob/master/meternumberpicker/src/main/java/com/alexzaitsev/meternumberpicker/MeterView.java) sources to catch more details.
You may also want to check the [sample](https://github.com/alexzaitsev/meter-number-picker/tree/master/sample).
## Attributes
#### MeterNumberPicker
|attribute name|attribute description|
|:-:|:-:|
|mnp_min|The min value of this widget.|
|mnp_max|The max value of this widget.|
|mnp_value|The current value of this widget.|
|mnp_textColor|The text color of the numbers.|
|mnp_textSize|The text size of the numbers.|
|mnp_typeface|The typeface of the numbers.|
|mnp_minWidth|The min width of this widget.|
|mnp_minHeight|The min height of this widget.|
|mnp_paddingHorizontal|Internal horizontal padding of this widget (left/right).|
|mnp_paddingVertical|Internal vertical padding of this widget (top/bottom).|
#### MeterView
|attribute name|attribute description|
|:-:|:-:|
|mv_numberOfFirst|Number of the first-placed blocks.|
|mv_numberOfSecond|Number of the second-placed blocks.|
|mv_firstColor|Background color for the first-placed blocks.|
|mv_secondColor|Background color for the second-placed blocks.|
|mv_pickerStyle|The style for the `MeterNumberPicker`.|
|mv_enabled|Defines whether view reacts on clicks.|
## License
[MeterNumberPicker](https://github.com/alexzaitsev/meter-number-picker) is under [Apache 2.0](https://github.com/alexzaitsev/meter-number-picker/blob/master/LICENSE).