Learn to create the game “Spin The Bottle” on Android

What is better that creating some funny games to learn the basics of Android development ? Today, you’re going to discover more on the Android Animation API by creating the game “Spin The Bottle”.

Note that you can discover this tutorial in video on Youtube too :

Spin the bottle is a party game in which several players sit/stand/kneel in a circle. A bottle is placed on the floor in the center of the circle. A player spins the bottle, and must kiss the person to whom the bottle points when it stops spinning.

With our application, it is not necessary any more to have a real bottle, you will just need a smartphone. And it’s great because everyone has always a smartphone on him nowadays.

First step is to find two specific images : one for the floor which will be defined as background of the game and an other for the bottle which will be rotated during the game.

We have chosen to use these both images :

• Floor image for the background

• Bottle image

Now, we need to define the layout of our game “Spin The Bottle”. We have a Relative Layout with the floor image as background and we add a bottle in the center of this layout :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/root"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@drawable/background">

  <ImageView
    android:id="@+id/bottle"
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:src="@drawable/beer_bottle"
    android:layout_centerInParent="true" />

</RelativeLayout>

 

The next step is to write the Java code of the Main Activity. First, we get references for the views. Then, we install a click listener on the main layout of the Main Activity. Thus, the user will just have to touch the screen to spin the bottle and to start the game.

The core of the game is in the spinTheBottle() method. We are going to define a RotateAnimation from start angle to end angle centered on the center of the bottle. The end angle will be defined randomly to simulate really the game “Spin The Bottle”. We should store the last end angle value to restart the bottle in the same position for the next turn of the game.

The Code of the Main Activity will have the following form :

package com.ssaurel.spinthebottle;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.RotateAnimation;
import android.widget.ImageView;
import android.widget.Toast;

import java.util.Random;

public class MainActivity extends AppCompatActivity {

  public static final Random RANDOM = new Random();
  private View main;
  private ImageView bottle;
  private int lastAngle = -1;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    main = findViewById(R.id.root);
    bottle = (ImageView) findViewById(R.id.bottle);

    main.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        spinTheBottle();
      }
    });

    Toast.makeText(this, R.string.touch_to_spin, Toast.LENGTH_SHORT).show();
  }

  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
  }

  @Override
  public boolean onOptionsItemSelected(MenuItem item) {
    switch(item.getItemId()) {
      case R.id.action_spin :
        spinTheBottle();
        break;
      case R.id.action_zero :
        resetTheBottle();
        break;
    }

    return super.onOptionsItemSelected(item);
  }

  private void spinTheBottle() {
    int angle = RANDOM.nextInt(3600 - 360) + 360;
    float pivotX = bottle.getWidth() / 2;
    float pivotY = bottle.getHeight() / 2;

    final Animation animRotate = new RotateAnimation(lastAngle == -1 ? 0 : lastAngle, angle, pivotX, pivotY);
    lastAngle = angle;
    animRotate.setDuration(2500);
    animRotate.setFillAfter(true);

    bottle.startAnimation(animRotate);
  }

  private void resetTheBottle() {
    float pivotX = bottle.getWidth() / 2;
    float pivotY = bottle.getHeight() / 2;

    final Animation animRotate = new RotateAnimation(lastAngle == -1 ? 0 : lastAngle, 0, pivotX, pivotY);
    lastAngle = -1;
    animRotate.setDuration(2000);
    animRotate.setFillAfter(true);

    bottle.startAnimation(animRotate);
  }
}

 

You can run the application and play your game :

 

To go further, you can download the game “Spin The Bottle” created in this tutorial on the Google Play Store : https://play.google.com/store/apps/details?id=com.ssaurel.spinthebottle