Compose – Aspect Ratio Reference

What?

Jetpack Compose Modifier.aspectRatio does not let you choose the reference.

Goal. Choose the reference to compute the ratio based on:

• parent width
• parent height
• min(parent width, parent height)
• max(parent width, parent height)

How to integrate?

Step 1. In project root build.gradle or build.gradle.kts, add:

allprojects {
    repositories {
        maven { url 'https://jitpack.io' } // Groovy: build.gradle
        maven(url = "https://jitpack.io") // Kotlin: build.gradle.kts
    }
}

Step 2. Add the dependency in app build.gradle or build.gradle.kts:

dependencies {
    implementation("com.github.Mercandj:compose-aspect-ratio-reference:1.00.01")
}

How to use it?

Box(modifier = Modifier.width(300.dp).height(200.dp)) { // Parent
    Surface( // Child
        color = Color.Red,
        modifier = Modifier
            .aspectRatioReference(
                aspectRatioWidth = 1f,
                aspectRatioHeight = 1f,
                aspectRatioReference = AspectRatioReference.MIN
            )
            .align(Alignment.Center)
    ) {}
}

About

How to give me free support to help me maintain this lib:

• Put a star ⭐️ this git project 🙏
• Clap 👏 on Medium 🙏

Preview

GitHub

View Github