Skip to content

Latest commit

 

History

History
68 lines (49 loc) · 2.46 KB

readme.md

File metadata and controls

68 lines (49 loc) · 2.46 KB

Cards

medium

Compose - Aspect Ratio Reference

What?

Jetpack Compose Modifier.aspectRatio does not let you choose the dimens used to compute the ratio.

Goal. Be able to choose the reference of 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.04")
}

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_PARENT_WIDTH_PARENT_HEIGHT
            )
            .align(Alignment.Center)
    ) {}
}

Preview

preview

About

How to support:

  • Star ⭐️ this git project 🙏
  • Clap 👏 on Medium 🙏

Goku Genkidama