-1

i want to be professional on drawing custom view's in android , But I did not find a place to teach me or a full course that cover this topic .. can you help me with any course that start from scratch and make me professional on drawing on android ? :)

1 Answer 1

0

make custom view is easy you need to do once :

1-create your coustom_view.xml(there l_rating_bar.xml).

2-create your Custom_view.java(there LRatingBar.java) and make your function and property field in this

3-use your custom view every where(MainActivity.java & activity_main.xml) and enjoy it

l_rating_bar.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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/ratingbar"
              android:layout_width="match_parent"
              android:layout_height="match_parent"             android:layoutDirection="ltr"
              android:orientation="horizontal">

    <android.support.constraint.ConstraintLayout
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1">

        <ImageView
          android:id="@+id/star_1"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:scaleType="fitCenter"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1:1"
          app:layout_constraintLeft_toLeftOf="parent"
          app:layout_constraintRight_toRightOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:srcCompat="@drawable/ui_star_empty"/>
    </android.support.constraint.ConstraintLayout>

    <android.support.constraint.ConstraintLayout
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1">

        <ImageView
          android:id="@+id/star_2"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:scaleType="fitCenter"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1:1"
          app:layout_constraintLeft_toLeftOf="parent"
          app:layout_constraintRight_toRightOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:srcCompat="@drawable/ui_star_empty"/>
    </android.support.constraint.ConstraintLayout>

    <android.support.constraint.ConstraintLayout
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1">

        <ImageView
          android:id="@+id/star_3"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:scaleType="fitCenter"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1:1"
          app:layout_constraintLeft_toLeftOf="parent"
          app:layout_constraintRight_toRightOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:srcCompat="@drawable/ui_star_empty"/>
    </android.support.constraint.ConstraintLayout>

    <android.support.constraint.ConstraintLayout
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1">

        <ImageView
          android:id="@+id/star_4"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:scaleType="fitCenter"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1:1"
          app:layout_constraintLeft_toLeftOf="parent"
          app:layout_constraintRight_toRightOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:srcCompat="@drawable/ui_star_empty"/>
    </android.support.constraint.ConstraintLayout>

    <android.support.constraint.ConstraintLayout
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1">

        <ImageView
          android:id="@+id/star_5"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:scaleType="fitCenter"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1:1"
          app:layout_constraintLeft_toLeftOf="parent"
          app:layout_constraintRight_toRightOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:srcCompat="@drawable/ui_star_empty"/>
    </android.support.constraint.ConstraintLayout>

</LinearLayout>

LRatingBar.java:

import android.annotation.TargetApi;
import android.content.Context;
import android.content.res.TypedArray;
import android.os.Build;
import android.support.annotation.StyleableRes;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;

import com.example.moro.test.R;


@TargetApi(Build.VERSION_CODES.HONEYCOMB)//For backward-compability
public class LRatingBar extends LinearLayout {
  @StyleableRes
  int index0 = 0;
  View rootView;
  ViewGroup ratingbar;
  public onChangeRateListener onChangeRateListener;
  ImageView star_1, star_2, star_3, star_4, star_5;
  public int rate = 0;

 public interface onChangeRateListener{
    void onchangeRate(int rate);
  }

  public LRatingBar(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context, attrs);
  }

  public void onChangeRate(onChangeRateListener value){
    this.onChangeRateListener=value;
  }
  private void init(Context context, AttributeSet attrs) {
    inflate(context, R.layout.l_rating_bar, this);

    int[] sets = {R.attr.rate};
    TypedArray typedArray = context.obtainStyledAttributes(attrs, sets);
    int rate = typedArray.getInt(R.styleable.LRatingBar_rate,index0);
    typedArray.recycle();

    initComponents();
    setRate(rate);
  }

  private void initComponents() {

    ratingbar= findViewById(R.id.ratingbar);
    star_1= findViewById(R.id.star_1);
    star_2= findViewById(R.id.star_2);
    star_3= findViewById(R.id.star_3);
    star_4= findViewById(R.id.star_4);
    star_5= findViewById(R.id.star_5);


  }

  public void clickable(boolean i){
    if (i){
     star_1.setOnClickListener(new OnClickListener() {
       @Override
       public void onClick(View view) {
         emptyAllStar();
        setRate(1);
        onChangeRateListener.onchangeRate(getRate());
       }
     });
     star_2.setOnClickListener(new OnClickListener() {
       @Override
       public void onClick(View view) {
         emptyAllStar();
        setRate(2);
         onChangeRateListener.onchangeRate(getRate());
       }
     });
     star_3.setOnClickListener(new OnClickListener() {
       @Override
       public void onClick(View view) {
         emptyAllStar();
        setRate(3);
         onChangeRateListener.onchangeRate(getRate());
       }
     });
     star_4.setOnClickListener(new OnClickListener() {
       @Override
       public void onClick(View view) {
         emptyAllStar();
        setRate(4);
         onChangeRateListener.onchangeRate(getRate());
       }
     });
     star_5.setOnClickListener(new OnClickListener() {
       @Override
       public void onClick(View view) {
         emptyAllStar();
        setRate(5);
         onChangeRateListener.onchangeRate(getRate());
       }
     });

    }else {

    }
  }



  public int getRate() {
    return rate;
  }

  public void setRate(int value) {
    rate=value;
    switch (rate){
      case 1:
        star_1.setImageResource(R.drawable.ui_star_filled);
        break;
      case 2:
        star_1.setImageResource(R.drawable.ui_star_filled);
        star_2.setImageResource(R.drawable.ui_star_filled);
        break;
      case 3:
        star_1.setImageResource(R.drawable.ui_star_filled);
        star_2.setImageResource(R.drawable.ui_star_filled);
        star_3.setImageResource(R.drawable.ui_star_filled);
        break;
      case 4:
        star_1.setImageResource(R.drawable.ui_star_filled);
        star_2.setImageResource(R.drawable.ui_star_filled);
        star_3.setImageResource(R.drawable.ui_star_filled);
        star_4.setImageResource(R.drawable.ui_star_filled);
        break;
      case 5:
        star_1.setImageResource(R.drawable.ui_star_filled);
        star_2.setImageResource(R.drawable.ui_star_filled);
        star_3.setImageResource(R.drawable.ui_star_filled);
        star_4.setImageResource(R.drawable.ui_star_filled);
        star_5.setImageResource(R.drawable.ui_star_filled);
        break;
    }
 }

  private void emptyAllStar(){
    star_1.setImageResource(R.drawable.ui_star_empty);
    star_2.setImageResource(R.drawable.ui_star_empty);
    star_3.setImageResource(R.drawable.ui_star_empty);
    star_4.setImageResource(R.drawable.ui_star_empty);
    star_5.setImageResource(R.drawable.ui_star_empty);
  }

}

activity_main.xml:

   <your.package.name.LRatingBar
                  android:id="@+id/ratingBar"
                  android:layout_width="0dp"
                  android:layout_height="match_parent"
                  android:layout_marginRight="10dp"
                  android:layout_weight="1"/>

MainActivity.java:

LRatingBar  ratingBar = (LRatingBar)findViewById(R.id.ratingBar);
    ratingBar .setRate(value_item_section_review.rate);
    ratingBar .clickable(true);
    ratingBar .onChangeRate(new LRatingBar.onChangeRateListener() {
      @Override
      public void onchangeRate(int rate) {
      }
    });
2
  • my problem not on making a custom view ! i want a full course to learn drawing on android .. i want to learn and be professional and understand all this staff. May 24, 2019 at 3:26
  • the best way to learn drawing on android and etc. is developer.android.com - i suggest it because it's best reference and easy for use May 24, 2019 at 8:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.