A simple Android app - "How fast can you click" game

Looking for some fun I created a very basic Android app that checks how fast you can click. The concept is simple, you have 30 seconds to click as fast as possible. The clicks will register and eventually tell you the overall clicks after the 30 seconds have run out. Once it's done you'll also have an option to refresh the game; giving a possibility to try to do better next time.

Here's a picture from the Android Studio Phone Emulator.



So let's jump straight into building this app.

First of all, we'll have to start a new application within Android Studio. I am giving my application the name "Clicker", and choosing an empty activity with the activity name "Main Clicker". From there on we want to move into the activity_main.xml and create 3 objects. Where 2 of them will be a text object and the last one will be a button. Designing these to suit a modern UI will give us this code. 
    <
TextView
       
android:id="@+id/countView"
       
android:layout_width="240dp"
       
android:layout_height="0dp"
       
android:layout_marginStart="8dp"
       
android:layout_marginLeft="8dp"
       
android:layout_marginTop="78dp"
       
android:layout_marginEnd="8dp"
       
android:layout_marginRight="8dp"
       
android:gravity="center"
        
android:text="@string/hello"
       
android:textSize="86sp"
       
android:textStyle="bold"
       
app:layout_constraintEnd_toEndOf="parent"
       
app:layout_constraintHorizontal_bias="0.503"
       
app:layout_constraintStart_toStartOf="parent"
        
app:layout_constraintTop_toTopOf="parent" />

    <
Button
       
android:id="@+id/btnFrontPage"
       
android:layout_width="0dp"
       
android:layout_height="wrap_content"
       
android:layout_alignParentBottom="true"
       
android:layout_marginTop="8dp"
       
android:width="500dp"
       
android:height="200dp"
       
android:background="#fc3232"
       
android:text="@string/btnFrontPage"
       
android:textColor="#FFF"
       
android:textSize="24sp"
       
android:textStyle="bold"
       
app:layout_constraintBottom_toBottomOf="parent"
       
app:layout_constraintEnd_toEndOf="parent"
       
app:layout_constraintHorizontal_bias="0.0"
       
app:layout_constraintStart_toStartOf="parent"
       
app:layout_constraintTop_toBottomOf="@+id/countView"
       
app:layout_constraintVertical_bias="1.0" />

    <
TextView
       
android:id="@+id/informationText"
       
android:layout_width="wrap_content"
       
android:layout_height="23dp"
       
android:layout_marginTop="24dp"
        
android:text="@string/informationText"
       
android:textSize="18sp"
       
app:layout_constraintEnd_toEndOf="parent"
       
app:layout_constraintStart_toStartOf="parent"
       
app:layout_constraintTop_toBottomOf="@+id/countView" />

Now, for the text we do not want hardcoded strings. So that's why you'll see android:text="@string/some_variable" which refers to strings found under res > values > strings.xml. In this case we will have hello, informationText and btnFrontPage as our variables. Let's move into our strings.xml file and create some text for these.

<resources>
    <string name="app_name">Clicker</string>
    <string name="hello">0</string>
    <string name="btnFrontPage">Click</string>
    <string name="informationText">30 seconds left</string>
</resources>

Now, let's get into the MainActivity.java file and start with the code for our app.

package com.example.test.clicker;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final Button btn = (Button) findViewById(R.id.btnFrontPage);
        final TextView counting = (TextView) findViewById(R.id.countView);
        final TextView information = (TextView) findViewById(R.id.informationText);
    }

    btn.setEnabled(true);
    new CountDownTimer(30*1000, 1000) {
    public void onTick(final long millisUntilFinished) {
        information.setText((millisUntilFinished / 1000) + " seconds left");
        btn.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View view) {

                counting.setText("" + count);
                count++;
                Log.i("btnFrontPage", "Button press registered");

            }
        });
    }
    public void onFinish() {
        information.setText("Amount of clicks within 30 seconds");
        btn.setEnabled(false);
        btn.setVisibility(View.GONE);
    }
  }.start();
}

Without going too much into details, because the code here is fairly simple. I can still point out that some of the things that's happening here in the code are all about setting an instance for the code and connecting the buttons and text with the objects created within activity_main.xml. Another main thing here in the code is the CountDownTimer that keeps track of when a user is able to click or not. In this case, it's differentiating between the onClick- and onFinish function.

Furthermore, in my original code and apk I included the refresh option which is originally from Pixelstech.net. It's really simple to add to the code I've gone through in this blog post, basically copy and paste (Hence why I didn't include it). However, the full code for this project, including the refresh button, can be found at this Repl.it.

Comments

Popular posts from this blog

Vigenère cipher encryption with C++

Minimum Spanning Trees (MST)