CI/CD with GitHub Actions in Android Kotlin - Mini App: Build & Ship

Build: CI/CD Pipeline Setup

This screen helps you set up a basic Continuous Integration and Continuous Deployment (CI/CD) pipeline for an Android Kotlin app using GitHub Actions. It shows the workflow file structure and explains how to automate build and test on every push.

Target UI

----------------------------------
| CI/CD Pipeline Setup            |
|--------------------------------|
| Workflow File:                 |
| .github/workflows/android.yml |
|                                |
| Steps:                        |
| 1. Checkout code              |
| 2. Set up JDK                |
| 3. Build debug APK            |
| 4. Run unit tests             |
|                                |
| [Save Workflow] [Cancel]      |
----------------------------------

Show a text area with sample GitHub Actions YAML workflow for Android Kotlin

Include buttons: 'Save Workflow' and 'Cancel'

Display step-by-step explanation of the workflow

Use simple UI with clear labels and readable font

Starter Code

Android Kotlin

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

class MainActivity : ComponentActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContent {
      MaterialTheme {
        Surface(modifier = Modifier.padding(16.dp)) {
          // TODO: Add your code here
        }
      }
    }
  }
}

Task 1

Task 2

Task 3

Solution

Android Kotlin

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

class MainActivity : ComponentActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContent {
      MaterialTheme {
        Surface(modifier = Modifier.padding(16.dp)) {
          CiCdSetupScreen()
        }
      }
    }
  }
}

@Composable
fun CiCdSetupScreen() {
  val yamlContent = remember { mutableStateOf(
    "name: Android CI\non: [push]\njobs:\n  build:\n    runs-on: ubuntu-latest\n    steps:\n      - uses: actions/checkout@v3\n      - name: Set up JDK 17\n        uses: actions/setup-java@v3\n        with:\n          distribution: 'temurin'\n          java-version: '17'\n      - name: Build Debug APK\n        run: ./gradlew assembleDebug\n      - name: Run Unit Tests\n        run: ./gradlew test"
  ) }

  Column {
    Text(text = "GitHub Actions Workflow YAML", style = MaterialTheme.typography.titleMedium)
    Spacer(modifier = Modifier.height(8.dp))
    TextField(
      value = yamlContent.value,
      onValueChange = { yamlContent.value = it },
      modifier = Modifier.height(200.dp),
      readOnly = true
    )
    Spacer(modifier = Modifier.height(16.dp))
    Text(text = "Steps Explanation:")
    Text(text = "1. Checkout code: Gets your app code from GitHub.")
    Text(text = "2. Set up JDK 17: Prepares Java environment for building.")
    Text(text = "3. Build Debug APK: Compiles your app into an APK file.")
    Text(text = "4. Run Unit Tests: Runs your app's tests to check for errors.")
    Spacer(modifier = Modifier.height(24.dp))
    Button(onClick = { /* Save workflow action */ }) {
      Text(text = "Save Workflow")
    }
    Spacer(modifier = Modifier.height(8.dp))
    Button(onClick = { /* Cancel action */ }) {
      Text(text = "Cancel")
    }
  }
}

This screen uses Jetpack Compose to create a simple UI showing a GitHub Actions workflow YAML for Android Kotlin CI/CD.

The TextField displays the YAML content in a read-only box so users can see the exact workflow steps.

Below, Text components explain each step in simple words, helping beginners understand the process.

Two buttons let users save or cancel the workflow setup (actions are placeholders here).

The UI uses padding and spacing for clarity and readability.

Final Result

Completed Screen

----------------------------------
| CI/CD Pipeline Setup            |
|--------------------------------|
| GitHub Actions Workflow YAML   |
| ------------------------------ |
| name: Android CI               |
| on: [push]                    |
| jobs:                        |
|   build:                     |
|     runs-on: ubuntu-latest    |
|     steps:                   |
|       - uses: actions/checkout|
|       - name: Set up JDK 17  |
|         uses: actions/setup-java|
|       - name: Build Debug APK |
|         run: ./gradlew assembleDebug|
|       - name: Run Unit Tests  |
|         run: ./gradlew test   |
|                              |
| Steps Explanation:            |
| 1. Checkout code: Gets your app|
| 2. Set up JDK 17: Prepares Java|
| 3. Build Debug APK: Compiles app|
| 4. Run Unit Tests: Checks errors|
|                              |
| [Save Workflow] [Cancel]      |
----------------------------------

User can scroll the YAML text if needed

Tapping 'Save Workflow' would save the workflow file (placeholder)

Tapping 'Cancel' would discard changes and close screen (placeholder)

Stretch Goal

Add a toggle switch to enable or disable automatic deployment after tests pass

💡 Hint

Use a Switch component and update the YAML content dynamically to include a deploy job when enabled