Tutorial Android RatingBar

Di Android, Anda dapat menggunakan " android.widget.RatingBar " untuk menampilkan peringkat komponen bar di ikon bintang. pengguna dapat menyentuh, menyeret atau klik pada bintang-bintang untuk mengatur nilai rating.
Dalam tutorial ini, kami tunjukkan cara menggunakan XML untuk menampilkan rating bar, beberapa TextViews dan tombol. Ketika pengguna mengklik pada bintang rating bar ini, nilai rating yang dipilih akan ditampilkan di textview tersebut. Dan, jika pengguna mengklik tombol, nilai rating yang dipilih akan ditampilkan sebagai pesan (message toast) mengambang.

Contoh Membuat Project Android

1. Pada Android Studio, buatlah project baru.
     => Jika Anda tidak memiliki sebuah project, di layar Welcome klik New Project.
     => Jika Anda telah membuka project, dari menu File, pilih New Project.

    2. Pada Configure your new project, isi kolom berikut seperti di bawah ini.
     => Application name ⇒ RatingBar
     => Company domain ⇒ example.com (Misalnya: com.megadistudio.RatingBar)
     => Project Location memilih lokasi untuk project Anda.

    3. Pada Select the form factors your app will run oncentang untuk Phone and Tablet.
     => Untuk Minimum SDK, pilih API 10: Android 2.3.3 (Gingerbread). klik Next.

    4. Pada Add an activity to Mobile, pilih Blank Activity dan klik Next.
    Next ->

    5. Klik tombol Finish untuk membuat project.
    6. Pilih View Anda sebagai Project, Buka file layout untuk kegiatan utama (activity_main.xml) terletak di bawah App  res ⇒ layout.

    Catatan rating bar mengandung banyak nilai-nilai dikonfigurasi. Dalam hal ini, rating bar mengandung 4 bintang, setiap nilai kenaikan 1,0, sehingga, mengandung minimal 1,0 (1 bintang) dan nilai maksimum 4.0 (4 bintang). Selain itu, membuat 2 star (2.0) yang dipilih secara default.
    activity_main.xml
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout 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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="ratingbar.megadistudio.com.ratingbar.MainActivity"
    android:background="@android:color/holo_green_light">

    <TextView
    android:text="@string/tk"
    android:textSize="50sp"
    android:textStyle="bold"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:id="@+id/textView" />

    <ImageView
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:background="@drawable/tk"
    android:layout_below="@+id/textView"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="10dp"
    android:id="@+id/imageView" />

    <TextView
    android:text="@string/rateMe"
    android:textStyle="bold"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:id="@+id/textView2" />

    <RatingBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/textView2"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_marginTop="12dp"
    android:id="@+id/ratingBar" />

    <Button
    android:text="Submit"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/ratingBar"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_marginTop="13dp"
    android:id="@+id/button" />

    <TextView
    android:text="@string/resutlt"
    android:textStyle="bold"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/button"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_marginTop="18dp"
    android:id="@+id/textView3" />
    </RelativeLayout>

    7.  Buka string.xml terletak di app ⇒ res ⇒ value dan copy kode di bawah ini.

    string.xml
    <resources>
    <string name="app_name">RatingBar</string>
    <string name="tk">Tahu Koding</string>
    <string name="rateMe">Rate Me :</string>
    <string name="resutlt">Result :</string>
    </resources>

    8. Sekarang Buka MainActivity.java terletak di app ⇒ src ⇒ Java dan copy kode di bawah ini.

    MainActivity.java

    package ratingbar.megadistudio.com.ratingbar;

    import android.app.Activity;
    import android.os.Bundle;
    import android.view.View;
    import android.widget.Button;
    import android.widget.RatingBar;
    import android.widget.TextView;
    import android.widget.Toast;

    public class MainActivity extends Activity {

    private Button btn;
    private RatingBar ratingBar;
    private TextView txtRateValue;

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

    ratingBar = (RatingBar) findViewById(R.id.ratingBar);
    txtRateValue = (TextView) findViewById(R.id.textView3);
    btn = (Button) findViewById(R.id.button);

    addListenerOnRatingBar();
    addListenerOnButton();

    }

    public void addListenerOnRatingBar(){

    ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
    @Override
    public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {

    txtRateValue.setText(String.valueOf(rating));

    }
    });

    }

    public void addListenerOnButton(){

    btn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {

    Toast.makeText(MainActivity.this, String.valueOf(ratingBar.getRating()), Toast.LENGTH_SHORT).show();

    }
    });

    }

    }

    Untuk menjalankan aplikasi dari Android Studio , klik Run ikon dari toolbar.


    Iklan Atas Artikel

    Iklan Tengah Artikel 1

    Iklan Tengah Artikel 2

    Iklan Bawah Artikel