1

Thanks to a code purchase I made for a the development of a personal project I have in mind for years, I'm learning how the rotation animation and the degrees/angles work in the Roulette Wheel Android Studio based apps.

You can see the design of the app here so I can explain why I need help!

The rotation animation of the wheel is based in the next code (which I hope I can improve it) and is executed by pressing the center image button:

public class MainActivity extends AppCompatActivity{

private static final String[] sectors = {"5","4","3","2","1","6"};
private static final String TAG = "";

Dialog textDialog;
TextView textView;

@BindView(R.id.circle)
ImageView wheel;

@BindView(R.id.Btn)
ImageView playBtn;

// We create a Random instance to make our wheel spin randomly
private static final Random RANDOM = new Random();
private int degree = 0, degreeOld = 0;
// We have 37 sectors on the wheel, we divide 360 by this value to have angle for each sector
// we divide by 2 to have a half sector
private static final float HALF_SECTOR = 360f / 6f / 2f;


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

    textDialog = new Dialog(this);
    textDialog.setContentView(R.layout.textview);
    textView = (TextView) textDialog.findViewById(R.id.textview1);
}

//Note: The Value of the setDuration and the sum with the RANDOM.nextInt must be different.
@OnClick(R.id.Btn)
public void spin(View v){
    playBtn.setClickable(false);
    degreeOld = degree % 360;
    // we calculate random angle for rotation of our wheel
    degree = RANDOM.nextInt(1500) + 3600;
    // rotation effect on the center of the wheel
    RotateAnimation rotateAnim = new RotateAnimation(degreeOld, degree,
            RotateAnimation.RELATIVE_TO_SELF, 0.5f, RotateAnimation.RELATIVE_TO_SELF, 0.5f);
    rotateAnim.setDuration(5000);
    rotateAnim.setFillAfter(true);
    rotateAnim.setInterpolator(new DecelerateInterpolator());
    rotateAnim.setAnimationListener(new Animation.AnimationListener() {
        @Override
        public void onAnimationStart(Animation animation) {
            // we empty the result text view when the animation start
            textView.setText("");
        }

        @Override
        public void onAnimationEnd(Animation animation) {
            // we display the correct sector pointed by the triangle at the end of the rotate animation
            textView.setText(getSector(360 - (degree % 360)));
        }

        @Override
        public void onAnimationRepeat(Animation animation) {

        }
    });

    // we start the animation
    wheel.startAnimation(rotateAnim);
}

private String getSector(int degrees) {
    int i = 0;
    textDialog.getWindow().setBackgroundDrawable(new ColorDrawable(0));
    textDialog.show();
    String text = null;

    do {
        // start and end of each sector on the wheel
        float start = HALF_SECTOR * (i * 2 + 1);
        float end = HALF_SECTOR * (i * 2 + 3);

        Log.d(TAG, "Obtained Degree: " + degrees);
        Log.d(TAG, "Start Degree: " + start);
        Log.d(TAG, "End Degree: " + end);

        if (degrees >= start && degrees < end) {
            // degrees is in [start;end[
            // so text is equals to sectors[i];
            text = sectors[i];
        }

        i++;
        Log.d(TAG, "Tries: " + i);
    } while (text == null  &&  i < sectors.length);

    //If the obtained degree is not between the Start or End Degrees, and the number of tries has reached the length of the array, the last value is established.
    if(i == sectors.length){
        text = sectors[i-1];
    }

    playBtn.setClickable(true);
    Log.d(TAG, "Obtained Value: " + text);
    return text;
}

}

The thing here is that I want to make the wheel more realistic and let the user being able to rotate the wheel with the finger using the OnTouch (ACTION_MOVE), if they do it slowly they will rotate the wheel, but if they move the finger at a certain velocity they could execute the rotation animation based in the velocity, something similar to this app physics: Decision Roulette

Hope the solution to get a simple rotation by touch can be obtained because I've search all over internet and all the animations had been for button and no touch. Thank you.

Lyonic
  • 11
  • 2

0 Answers0