Android CI/CD with GitHub Actions & Compose Typography Guide

Automating Android builds and mastering text styling in Jetpack Compose creates a professional development workflow. Let's combine GitHub Actions CI/CD with advanced text rendering techniques.

Part 1: GitHub Actions CI/CD for Android

Setting Up the Workflow

Create .github/workflows/android-ci.yml:

name: Android CI/CD

on:
  push:
    branches: [ main, develop ]
  pull_request:
    branches: [ main ]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v3

    - name: Set up JDK 17
      uses: actions/setup-java@v3
      with:
        java-version: '17'
        distribution: 'temurin'
        cache: gradle

    - name: Grant execute permission
      run: chmod +x gradlew

    - name: Build with Gradle
      run: ./gradlew build

    - name: Run tests
      run: ./gradlew test

    - name: Build signed AAB
      run: ./gradlew bundleRelease
      env:
        KEYSTORE_PASSWORD: ${{ secrets.KEYSTORE_PASSWORD }}
        KEY_PASSWORD: ${{ secrets.KEY_PASSWORD }}
        KEY_ALIAS: ${{ secrets.KEY_ALIAS }}
        KEYSTORE_FILE: ${{ secrets.KEYSTORE_FILE }}

    - name: Upload AAB artifact
      uses: actions/upload-artifact@v3
      with:
        name: release-bundle
        path: app/build/outputs/bundle/release/app-release.aab

Key Points

• JDK 17: Required for latest Compose and Gradle features
• Gradle Cache: cache: gradle dramatically speeds up builds (30-40% faster)
• Secrets Management: Store passwords and keystore base64 in GitHub Secrets
• AAB Format: Google Play requires Android App Bundles, not APKs

Keystore Setup in Secrets

Encode your keystore as base64:

base64 -w 0 your-key.keystore | xclip

Add to GitHub Secrets and decode in workflow:

- name: Decode and setup keystore
  run: echo "${{ secrets.KEYSTORE_FILE }}" | base64 -d > app/signing/keystore.jks

Part 2: Compose Text Styling & Typography

Material3 Typography System

Define your typography in ui/theme/Type.kt:

val Typography = androidx.compose.material3.Typography(
    displayLarge = TextStyle(
        fontFamily = FontFamily.Default,
        fontWeight = FontWeight.Bold,
        fontSize = 57.sp,
        letterSpacing = (-0.25).sp
    ),
    bodyMedium = TextStyle(
        fontFamily = FontFamily.Default,
        fontWeight = FontWeight.Normal,
        fontSize = 14.sp,
        letterSpacing = 0.25.sp
    ),
    labelSmall = TextStyle(
        fontFamily = FontFamily.Default,
        fontWeight = FontWeight.Medium,
        fontSize = 11.sp,
        letterSpacing = 0.5.sp
    )
)

Custom Fonts

Add fonts to res/font/:

val customFont = FontFamily(
    Font(R.font.inter_regular, FontWeight.Normal),
    Font(R.font.inter_semibold, FontWeight.SemiBold),
    Font(R.font.inter_bold, FontWeight.Bold)
)

val customTypography = Typography(
    bodyMedium = TextStyle(
        fontFamily = customFont,
        fontWeight = FontWeight.Normal,
        fontSize = 14.sp
    )
)

AnnotatedString for Rich Text

Create styled text spans:

val annotatedString = buildAnnotatedString {
    append("Build with ")
    withStyle(style = SpanStyle(
        color = Color.Blue,
        fontWeight = FontWeight.Bold
    )) {
        append("Compose")
    }
    append(". Deploy with ")
    withStyle(style = SpanStyle(
        color = Color.Green,
        fontStyle = FontStyle.Italic
    )) {
        append("GitHub Actions")
    }
    append(".")
}

Text(text = annotatedString)

ClickableText with Link Styling

val text = buildAnnotatedString {
    append("Visit our ")
    pushStringAnnotation(tag = "URL", annotation = "https://myougatheax.gumroad.com")
    withStyle(style = SpanStyle(
        color = Color(0xFF1F88DB),
        textDecoration = TextDecoration.Underline
    )) {
        append("Gumroad store")
    }
    pop()
    append(" for templates.")
}

ClickableText(
    text = text,
    onClick = { offset ->
        text.getStringAnnotations(tag = "URL", start = offset, end = offset)
            .firstOrNull()?.let { annotation ->
                // Open URL
                val intent = Intent(Intent.ACTION_VIEW, Uri.parse(annotation.item))
                context.startActivity(intent)
            }
    }
)

SelectionContainer for Copy-Paste

Make text selectable:

SelectionContainer {
    Column {
        Text("This text is copyable")
        Text("And this code snippet too:")
        Text(
            text = "gradlew bundleRelease",
            fontFamily = FontFamily.Monospace,
            background = Color.LightGray
        )
    }
}

Advanced: Custom Text Layout

Paragraph(
    text = "Complex layout with multiple styles",
    style = TextStyle(
        fontSize = 16.sp,
        lineHeight = 24.sp,
        letterSpacing = 0.5.sp,
        color = Color.Black
    ),
    maxLines = Int.MAX_VALUE,
    overflow = TextOverflow.Ellipsis
)

Integration Tips

1. CI/CD for Text Rendering: Test screenshot rendering in GitHub Actions using Roborazzi
2. Font Size Testing: Verify typography scales correctly on different screen sizes
3. Performance: Cache font resources to prevent re-rendering
4. Accessibility: Always pair text styling with sufficient contrast ratios

Gradle Configuration

Ensure build.gradle includes:

android {
    compileOptions {
        sourceCompatibility = JavaVersion.VERSION_17
        targetCompatibility = JavaVersion.VERSION_17
    }
}

dependencies {
    implementation 'androidx.compose.material3:material3:1.1.0'
}

---

8 Android App Templates with pre-configured CI/CD and Compose styling → Download Now

Master GitHub Actions + beautiful text rendering. Your users will notice.