Spin Wheel System in Android Studio
Make a awasome spin wheel in android studio.Do you have little bit knowladge about programming?Then you can create this type spin wheel method.
Spin Wheel System in Android Studio
Step 01. Add this in your setting.gradle file
repositories {
google()
mavenCentral()
jcenter()
maven { url "https://jitpack.io" }
}
Step 02.Add this in your root directory build.gradle file
buildFeatures {
viewBinding = true
}
//Sweet Alert Dialog
implementation 'com.github.f0ris.sweetalert:library:1.6.2'
Step 03.Add this in your Activity Xml Code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
android:background="@drawable/bg_img"
tools:context=".Spinner.SpinnerActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="@dimen/_25sdp"
android:layout_height="@dimen/_25sdp"
android:layout_marginStart="@dimen/_10sdp"
android:layout_marginTop="@dimen/_10sdp"
android:src="@drawable/back_arrow"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="@dimen/_35sdp"
android:layout_marginTop="@dimen/_10sdp"
android:layout_marginEnd="@dimen/_10sdp"
app:cardCornerRadius="@dimen/_7sdp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/blue"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:id="@+id/coinTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/_20sdp"
android:layout_marginEnd="@dimen/_20sdp"
android:fontFamily="@font/russoone_regular"
android:text="0"
android:textColor="@color/white"
android:textSize="@dimen/_15ssp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<ImageView
android:id="@+id/imageView4"
android:layout_width="@dimen/_200sdp"
android:layout_height="@dimen/_100sdp"
android:layout_marginTop="16dp"
android:scaleType="centerCrop"
android:src="@drawable/spin_and_win_text2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/imageView" />
<ImageView
android:layout_width="@dimen/_220sdp"
android:layout_height="@dimen/_220sdp"
android:src="@drawable/stand"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="@+id/wheelCircle"
app:layout_constraintHorizontal_bias="0.496"
app:layout_constraintStart_toStartOf="@+id/wheelCircle"
app:layout_constraintTop_toBottomOf="@+id/imageView4"
app:layout_constraintVertical_bias="0.90999997" />
<ImageView
android:id="@+id/wheelCircle"
android:layout_width="@dimen/_220sdp"
android:layout_height="@dimen/_220sdp"
android:src="@drawable/circle"
app:layout_constraintBottom_toBottomOf="@id/wheelBorder"
app:layout_constraintEnd_toEndOf="@+id/wheelBorder"
app:layout_constraintStart_toStartOf="@+id/wheelBorder"
app:layout_constraintTop_toTopOf="@+id/wheelBorder" />
<ImageView
android:id="@+id/wheelBorder"
android:layout_width="@dimen/_220sdp"
android:layout_height="@dimen/_220sdp"
android:src="@drawable/circle_border"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/imageView"
app:layout_constraintVertical_bias="0.36" />
<androidx.appcompat.widget.AppCompatButton
android:id="@+id/spinBtn"
android:layout_width="@dimen/_120sdp"
android:layout_height="@dimen/_35sdp"
android:background="@drawable/button_shape1"
android:fontFamily="@font/roboto"
android:text="SPIN"
android:textColor="@color/white"
android:textSize="@dimen/_17ssp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/wheelCircle"
app:layout_constraintVertical_bias="0.592" />
</androidx.constraintlayout.widget.ConstraintLayout>
Step 04.Add this in your Activity Java code
public class SpinnerActivity extends AppCompatActivity {
ActivitySpinnerBinding binding;
private static final String[] sectors = {"0", "10", "50", "0", "20", "0", "30", "50", "10", "30", "15", "20"};
private static final int[] sectorsDegrees = new int[sectors.length];
private static final Random random = new Random();
private int degree = 0;
private boolean isSpinning = false;
FirebaseFirestore db;
FirebaseUser user;
private MediaPlayer mediaPlayer;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivitySpinnerBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
db = FirebaseFirestore.getInstance();
user = FirebaseAuth.getInstance().getCurrentUser();
mediaPlayer = MediaPlayer.create(this, R.raw.wheel_sound);
db.collection("users").document(user.getUid()).addSnapshotListener(new EventListener<DocumentSnapshot>() {
@Override
public void onEvent(@Nullable DocumentSnapshot documentSnapshot, @Nullable FirebaseFirestoreException error) {
String coin = documentSnapshot.getString("currentCoin");
binding.coinTxt.setText(coin);
}
});
getDegreeForSectors();
binding.spinBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (!isSpinning) {
spin();
isSpinning = true;
}
}
});
}
private void startMediaPlayer() {
if (mediaPlayer != null && !mediaPlayer.isPlaying()) {
mediaPlayer.start();
}
}
private void stopMediaPlayer() {
if (mediaPlayer != null && mediaPlayer.isPlaying()) {
mediaPlayer.pause();
mediaPlayer.seekTo(0); // Reset to the beginning
}
}
@Override
protected void onDestroy() {
super.onDestroy();
if (mediaPlayer != null) {
mediaPlayer.release();
mediaPlayer = null;
}
}
private void spin() {
degree = random.nextInt(sectors.length - 1);
RotateAnimation rotateAnimation = new RotateAnimation(0, (360 * sectors.length) + sectorsDegrees[degree],
RotateAnimation.RELATIVE_TO_SELF, 0.5f, RotateAnimation.RELATIVE_TO_SELF, 0.5f);
rotateAnimation.setDuration(3500);
rotateAnimation.setFillAfter(true);
rotateAnimation.setInterpolator(new DecelerateInterpolator());
rotateAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
startMediaPlayer();
}
@Override
public void onAnimationEnd(Animation animation) {
stopMediaPlayer();
db.collection("users").document(user.getUid()).get().addOnSuccessListener(new OnSuccessListener<DocumentSnapshot>() {
@Override
public void onSuccess(DocumentSnapshot documentSnapshot) {
int currentCoin = Integer.parseInt(documentSnapshot.getString("currentCoin"));
int coins = Integer.parseInt(sectors[sectors.length - (degree + 1)]);
int newCoins = currentCoin + coins;
Map<String, Object> map = new HashMap<>();
map.put("currentCoin", String.valueOf(newCoins));
db.collection("users").document(user.getUid()).update(map)
.addOnCompleteListener(new OnCompleteListener<Void>() {
@Override
public void onComplete(@NonNull Task<Void> task) {
if (task.isSuccessful()) {
SweetAlertDialog sweetAlertDialog = new SweetAlertDialog(SpinnerActivity.this,SweetAlertDialog.SUCCESS_TYPE);
sweetAlertDialog.setTitleText("Success!!");
sweetAlertDialog.setContentText("You've got " + sectors[sectors.length - (degree + 1)] + " Points");
sweetAlertDialog.show();
}
}
});
}
});
isSpinning = false;
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
binding.wheelCircle.startAnimation(rotateAnimation);
}
private void getDegreeForSectors() {
int sectorDegree = 360 / sectors.length;
for (int i = 0; i < sectors.length; i++) {
sectorsDegrees[i] = (i + 1) * sectorDegree;
}
}
}
What's Your Reaction?
