Tutorial Nomor Picker Android

Dalam aplikasi Anda, jika Anda perlu memberikan opsi untuk memungkinkan pengguna memilih nomor dari rentang nomor yang telah ditentukan, maka Anda harus menggunakan widget NumberPicker Android. Tergantung pada tema yang diterapkan, pemilih angka ditampilkan dalam gaya yang berbeda.

Dalam tutorial ini, topik yang terkait dengan pemilih angka seperti menggunakan pemilih angka dengan contoh, pemilih nomor pemetik, gaya pemetik nomor, gaya penentu nomor, dan pemetik nomor tercakup.

Contoh Nomor Pilih Android

Contoh di bawah menunjukkan bagaimana Anda dapat menggunakan pemilih angka dalam aplikasi Anda. Anda perlu mengatur rentang untuk pemilih angka dengan menetapkan min dan atribut max di xml atau memanggil setMinValue dan setMaxValue pada objek NumberPicker dalam aktivitas.

Elemen NumberPicker dalam tata letak xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.zoftino.numberpicker.MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android:text="NumberPicker Tutorial"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <NumberPicker
        android:id="@+id/numberPicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView" />
</android.support.constraint.ConstraintLayout>

Alat Pilih Nomor Android

Di bawah layar menunjukkan pemilih angka ketika tema aplikasi diatur ke salah satu tema materi aplikasi ringkas.

Pendengar Nomor Telepon Android

Untuk mendengarkan perubahan nilai saat ini dari NumberPicker, Anda perlu menyediakan implementasi antarmuka NumberPicker.OnValueChangeListener yang memiliki satu metode panggilan balik di ValueChange. Dalam metode ini, Anda bisa mendapatkan pengguna memilih atau nilai saat ini dari pemilih angka.

Anda dapat memanggil metode setOnValueChangedListener pada objek pemilih angka untuk menambahkan pendengar perubahan nilai ke NumberPicker.

 public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.numberpicker);

       NumberPicker np = findViewById(R.id.numberPicker);

       np.setMinValue(2);
       np.setMaxValue(20);

       np.setOnValueChangedListener(onValueChangeListener);
    }

    NumberPicker.OnValueChangeListener onValueChangeListener =
            new  NumberPicker.OnValueChangeListener(){
        @Override
        public void onValueChange(NumberPicker numberPicker, int i, int i1) {
            Toast.makeText(MainActivity.this,
                    "selected number "+numberPicker.getValue(), Toast.LENGTH_SHORT);
        }
    };
}

NumberPicker Formatter

Anda dapat menggunakan pemetik angka untuk mengonversi nilai pemilih angka ke format yang diinginkan, misalnya, Anda dapat menggunakan pemformat angka untuk menampilkan mata uang.

Untuk itu, Anda perlu membuat implementasi antarmuka NumberPicker.Formatter. Antarmuka memiliki metode format yang dipanggil untuk setiap nomor dari kisaran nomor NumberPicker dan nilai yang dikembalikan dari metode ini adalah apa yang terlihat di UI. Anda dapat menambahkan formatter ke NumberPicker dengan memanggil setFormatter pada objek pemilih angka.

NumberPicker.Formatter formatter = new NumberPicker.Formatter(){
    @Override
    public String format(int i) {
        return NumberFormat.getCurrencyInstance(Locale.CANADA).format((long)i).toString();
    }
};
 

Android NumberPicker Material Style

Android memperkenalkan tema materi di tingkat api 21 android. Untuk menggunakan tema materi dan membuat aplikasi Anda berjalan pada versi Android sebelumnya, Anda harus menggunakan tema aplikasi ringkas. Untuk informasi lebih lanjut tentang tema dan gaya android , baca tema android dan tutorial gaya dan untuk gaya materi, baca gaya materi android dan tutorial tema .

Gambar di atas menunjukkan NumberPicker dalam gaya mater. Anda dapat mengkustomisasi pemilihan jenis material untuk mengubah warna pembagi atau latar belakang pilihan seperti yang ditunjukkan di bawah ini. Karena gaya pemetik nomor Widget.Material.NumberPicker tersedia dari tingkat api 21, jika aplikasi Anda harus dijalankan pada versi android sebelumnya, Anda perlu membuat gaya khusus versi menggunakan gaya pemilih .NumberPicker number picker.

<style name="MyAppThemeThree" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="android:numberPickerStyle">@style/MyNumberPickerTheme</item>

</style>
<style name="MyNumberPickerTheme" parent="@android:style/Widget.Material.NumberPicker">
<item name="colorControlNormal ">#33691e</item>
<item name="android:background">#b3e5fc</item>
</style>

Keep Coding ~ 

Share this post