Sunday, March 4, 2018

android kotlin - NumberPicker example

MainActivity.kt

package com.cfsuman.kotlinexamples

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import kotlinx.android.synthetic.main.activity_main.*
import android.widget.Toast
import java.text.NumberFormat
import java.util.*


class MainActivity : AppCompatActivity() {

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

        // Set the number picker minimum and maximum value
        number_picker.minValue = 5
        number_picker.maxValue = 10


        /*
            Sets whether the selector wheel shown during flinging/scrolling should
            wrap around the minimum value and maximum value.
        */
        number_picker.wrapSelectorWheel = false


        // Set number picker value changed listener
        number_picker.setOnValueChangedListener { picker, oldVal, newVal ->

            //Display the newly selected number to text view
            text_view.text = "Selected Value : $newVal"
        }



        // Display string values to the number picker
        // At first, initialize a new array instance with string values
        val colors = arrayOf("Red", "Green", "Blue", "Yellow", "Magenta", "Black", "Pink")

        // Set the number picker minimum and maximum values
        number_picker_string.minValue = 0
        number_picker_string.maxValue = colors.size - 1

        /*
            *** reference source developer.android.com ***

            void setDisplayedValues (String[] displayedValues)
                Sets the values to be displayed.

            Parameters
                displayedValues String : The displayed values. Note: The length of the displayed
                                         values array must be equal to the range of selectable
                                         numbers which is equal to getMaxValue() - getMinValue() + 1.
        */

        // Set the valued to be displayed in number picker
        number_picker_string.displayedValues = colors

        // Set number picker value change listener
        number_picker_string.setOnValueChangedListener { _, _, newVal ->

            // Display the picker selected value to text view
            text_view.text = "Selected Color : ${colors[newVal]}"
        }



        // Set a click listener for root layout widget
        root_layout.setOnClickListener {
            // Display the pickers selected value on a toast message
            Toast.makeText(
                    applicationContext,
                    "Selected ${number_picker.value} and ${colors[number_picker_string.value]}",
                    Toast.LENGTH_SHORT
            ).show()
        }



        // Manage the number picker which format value
        number_picker_formatter.minValue = 1;
        number_picker_formatter.maxValue = 10
        // Set value programmatically
        number_picker_formatter.value = 5

        /*
            *** reference source developer.android.com ***

            String format (int value)
                Formats a string representation of the current value.

            Parameters
                value int : The currently selected value.
            Returns
                String : A formatted string representation.
        */

        // Format the value
        number_picker_formatter.setFormatter(
                { i ->
                    NumberFormat.getCurrencyInstance(
                            Locale.US).format(i.toLong())
                }
        )

        // Number picker value changed listener
        number_picker_formatter.setOnValueChangedListener { _, _, newVal ->
            text_view.text = "Selected value: $newVal"
        }
    }
}
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#d8e7d6"
    android:orientation="vertical"
    android:padding="16dp"
    >
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:layout_margin="5dp"
        android:textColor="#289eff"
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        >
        <NumberPicker
            android:id="@+id/number_picker"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="50dp"
            />
        <NumberPicker
            android:id="@+id/number_picker_string"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="50dp"
            />
    </LinearLayout>
    <NumberPicker
        android:id="@+id/number_picker_formatter"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="50dp"
        />
</LinearLayout>