Code Monkey home page Code Monkey logo

value-picker's Introduction

ValuePicker

An Android library that provides a simple and customizable ValuePicker.

Platform Download Build Android Arsenal License

Contents

Demo (YouTube)

Installation

  1. Make sure that you've added the mavenCentral() repository to your top-level build.gradle file.
buildscript {
    //...
    repositories {
        //...
        mavenCentral()
    }
    //...
}
  1. Add the library dependency to your module-level build.gradle file.
dependencies {
    //...
    implementation "com.paulrybitskyi.valuepicker:valuepicker:1.0.3"
    //...
}

Usage

Basic usage of the ValuePickerView involves two steps - declaring a widget inside the XML file of your choice and configuring it in one of the Kotlin/Java classes.

Let's see how we can do that by following the steps listed above:

  1. Declaring a widget inside the XML file.

    XML (click to expand)

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorPrimary">
    
        <!-- Other widgets here -->
    
        <com.paulrybitskyi.valuepicker.ValuePickerView
            android:id="@+id/valuePickerView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:vpv_areDividersEnabled="true"
            app:vpv_isInfiniteScrollEnabled="true"
            app:vpv_maxVisibleItems="5"
            app:vpv_textColor="@color/colorAccent"
            app:vpv_dividerColor="@color/colorAccent"
            app:vpv_flingSpeedFactor="0.3"
            app:vpv_textSize="@dimen/date_picker_text_size"
            app:vpv_textTypeface="@font/ubuntu_mono_bold"
            app:vpv_divider="@drawable/custom_divider"
            app:vpv_orientation="vertical"/>
    
    </androidx.constraintlayout.widget.ConstraintLayout>

  2. Configuring the widget in one of the Kotlin/Java classes.

    Kotlin (click to expand)

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
    
        //...
    
        with(valuePickerView) {
            onItemSelectedListener = ValuePickerView.OnItemSelectedListener { item ->
                // Do something with item
            }
    
            val pickerItems = getPickerItems()
    
            items = pickerItems
            setSelectedItem(pickerItems[2])
        }
    }
    
    
    private fun getPickerItems(): List<Item> {
        return buildList {
            for(number in 1..100) {
                add(
                    PickerItem(
                        id = number,
                        title = number.toString()
                    )
                )
            }
        }
    }

    Java (click to expand)

    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
    
        ValuePickerView valuePickerView = view.findViewById(R.id.valuePickerView);
        valuePickerView.setOnItemSelectedListener((item) -> {
            // Do something with item
        });
    
        final ArrayList<Item> pickerItems = getPickerItems();
    
        valuePickerView.setItems(getPickerItems());
        valuePickerView.setSelectedItem(pickerItems.get(2));
    }
    
    
    private ArrayList<Item> getPickerItems() {
        final ArrayList<Item> pickerItems = new ArrayList<>(100);
    
        for(int i = 1; i <= 100; i++) {
            pickerItems.add(
                new PickerItem(
                    i,
                    String.valueOf(i)
                )
            );
        }
    
        return pickerItems;
    }

Advanced Usage

See the Sample app.

License

ValuePicker is licensed under the Apache 2.0 License.

value-picker's People

Contributors

mars885 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

value-picker's Issues

Crash when having only one item

Hi, the app crash when only one items,
I think it would be better if the valuePicker can still display if there is only one item

Add gif instead of Yt link

Hey, It will be great if you add .gif instead of a Youtube link as a demo in the documentation, so anyone can easily get the whole point.

Picker becomes too wide if text size is too large

First and foremost, thank you for building this! It looks amazing and serves a lot of use cases that typical android pickers and spinners don't.

I've found that if I increase the font size on a horizontal picker, the width of the picker itself will expand beyond the bounds of the parent ConstraintLayout. The spacing between items is also very wide as the text size increases. It would be nice if as the font size increases, the gaps between items decreases to fit everything on screen rather than the whole view widening.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.