Please conduct the following tasks alone. For implementation details you can refer to the lecture slides or the Android developer website. Please do not hesitate to ask me or the tutor if you have any questions. Under "Hint" you can find some help for the task. The "Checklist" specifies what should happen when your implementation is correct.

1 Tasks

1. Create a new Android project in Android Studio
2. Create an Android Virtual Device (AVD)
3. Create a UI with a Text and a Button that counts the clicks
4. Open a second Activity after 5 clicks
5. Run the UI test

1. Create a new Android project in Android Studio

Start Android Studio and use the wizard to create a new Android project. Follow the wizard instructions and fill in the following information:

For your first app choose the "Empty Activity" template (the one with the Jetpack Compose logo), as you do not need the features included with the other templates.

0.1 Project configuration

Fill out the fields as follows:

Name:                           MovieTracker
Package name:                   de.hdmstuttgart.movietracker
Save location:                  the assignment1 folder of your Git repository
Minimum SDK:                    API 26 ("Oreo"; Android 8.0)
Build configuration language:   Kotlin DSL (build.gradle.kts)

• Name is the application name that appears in the app list on the device.
• Package name is the namespace of all your source code. It has to be unique across all apps installed on a device, therefore a reverse domain name is used. The UI tests of all assignments expect exactly this package name.
• Minimum SDK is the oldest Android version your app will run on. The newer the version, the fewer devices can install the app. API 26 still covers almost every device in use.

After clicking on "Finish" the project is generated and Gradle downloads the dependencies (this takes a while the first time).

0.2 Hint

The result of the wizard is also available as reference project in the course repository (assignmentCode/assignment1). If your wizard shows other defaults (e.g. a newer Gradle or Kotlin version) that is fine, the UI test does not depend on it.

2. Create an AVD

Use the Device Manager in Android Studio (right toolbar, phone icon) to create a virtual device.

0.1 Create new virtual device

You should see an empty screen with an "Add a new device..." button. Click this button.

0.2 Choose device template

For the assignments we use the Pixel 8 template (any phone template works).

0.3 Choose Android version

Select the newest stable system image offered by Android Studio (API 35 or newer). The image has to be downloaded first, which takes around 1.5 GB of disk space.

0.4 Confirm setup

Click the finish button.

0.5 Run emulator

After finishing you should see the device in your list. Click the start button to start the emulator.

0.6 Hint

You can set up multiple devices with different templates and run several emulators at the same time. Every emulator takes a lot of RAM of your host computer, so close the ones you do not need.

3. Create a UI with a Text and a Button

Replace the generated Greeting composable in MainActivity.kt with your own @Composable function. It contains a Column with a Text and a Button. Add Modifier.testTag("button") to the Button, this is needed for the UI test later.

The UI should look like in the following screen capture:

Implement the onClick action of the Button: when the button is clicked the text should change to "Clicked X times" where X is the number of clicks.

0.1 Hint

• The number of clicks is state. Compose only redraws the Text when the value is stored in a state object: var counter by remember { mutableIntStateOf(0) }. Use rememberSaveable instead of remember and the value survives a rotation of the device.
• See the lecture "Android Intro", section "Managing State".

4. Open a second Activity after 5 clicks

When the counter reaches 5 clicks, a second Activity should open. It shows a Text with the number of clicks from the main activity: "Clicks: 5".

0.1 Hint

• Create a second class (e.g. ResultActivity) that extends ComponentActivity and calls setContent { ... } like MainActivity.
• Every Activity must be declared in AndroidManifest.xml with an <activity android:name=".ResultActivity" /> element inside <application>, otherwise the app crashes when it tries to start it.
• Start the activity with an explicit Intent and pass the counter as extra. Inside a composable you get the required Context with LocalContext.current:

val context = LocalContext.current
// ... in onClick:
val intent = Intent(context, ResultActivity::class.java)
intent.putExtra("clicks", counter)
context.startActivity(intent)

• In the second activity read the value with intent.getIntExtra("clicks", 0) and pass it to your composable.
• See the lecture "Android Framework Basics", section "Explicit Intent".

0.2 Checklist

• When the button is touched, the text changes correspondingly.
• After the 5th click a second activity opens and shows "Clicks: 5". The value comes from the main activity (it is not hard-coded).

5. Run the UI test

To make sure you have set everything up correctly, run the following Compose UI test in your project. The "Empty Activity" template already contains the required test dependencies in the module build.gradle.kts:

androidTestImplementation(libs.androidx.junit)
androidTestImplementation(platform(libs.androidx.compose.bom))
androidTestImplementation(libs.androidx.ui.test.junit4)
debugImplementation(libs.androidx.ui.test.manifest)

Copy the class on the next slide to the folder app/src/androidTest/java/de/hdmstuttgart/movietracker and name the file Assignment1Test.kt. UI tests run on the emulator, so start it first.

0.1 Hint

• The test finds your UI elements by test tag (onNodeWithTag) and by text (onNodeWithText). The Compose testing cheat sheet lists all finders, actions and assertions.
• From the command line: ./gradlew connectedAndroidTest

0.2 Assignment1Test.kt

package de.hdmstuttgart.movietracker

import androidx.compose.ui.test.assertIsDisplayed
import androidx.compose.ui.test.junit4.createAndroidComposeRule
import androidx.compose.ui.test.onNodeWithTag
import androidx.compose.ui.test.onNodeWithText
import androidx.compose.ui.test.performClick
import org.junit.Rule
import org.junit.Test

class Assignment1Test {

    @get:Rule
    val composeTestRule = createAndroidComposeRule<MainActivity>()

    @Test
    fun myTest() {
        composeTestRule.onNodeWithTag("button").assertIsDisplayed()
        composeTestRule.onNodeWithTag("button").performClick()
        composeTestRule.onNodeWithTag("button").performClick()
        composeTestRule.onNodeWithTag("button").performClick()
        composeTestRule.onNodeWithTag("button").performClick()
        composeTestRule.onNodeWithText("Clicked 4 times").assertIsDisplayed()
        composeTestRule.onNodeWithTag("button").performClick()
        composeTestRule.onNodeWithText("Clicks: 5").assertIsDisplayed()
    }
}

Click on the green double arrow next to class Assignment1Test in Android Studio and select "Run Assignment1Test".

A test run window at the bottom of Android Studio should appear and show you that the test passed.

Submission

• Push the project to the assignment1 folder of your Git repository. The folder structure must be assignment1/app/src/main/....
• Add a .gitignore so that no build output, local.properties or .idea files are committed. Android Studio generates one for you when you create the project.
• For grading, your Assignment1Test.kt is replaced by the version above and executed. Make sure it passes unchanged.