How to create a square aspect ratio based on the larger max* dimension

square.kt

/*
 * Copyright 2020 The Android Open Source Project
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import androidx.animation.TweenBuilder
import androidx.compose.Composable
import androidx.compose.getValue
import androidx.compose.setValue
import androidx.compose.state
import androidx.ui.animation.animate
import androidx.ui.core.*
import androidx.ui.foundation.Box
import androidx.ui.foundation.Text
import androidx.ui.foundation.clickable
import androidx.ui.foundation.drawBackground
import androidx.ui.graphics.Color
import androidx.ui.layout.*
import androidx.ui.material.Button
import androidx.ui.material.Divider
import androidx.ui.tooling.preview.Preview
import androidx.ui.unit.Dp
import androidx.ui.unit.dp
import androidx.ui.unit.min
import androidx.ui.unit.px

@Composable
fun Square(content: @Composable() () -> Unit) {
    // WithConstraints can be used inside a composable to inspect the incoming measurement
    // constraints
    WithConstraints(Modifier.drawBackground(Color.Green)) {
        val maxSize = min(maxWidth, maxHeight)
        Box(Modifier.preferredSize(maxSize).drawBackground(Color.Cyan), children = content)
    }
}

val slowAnimation = TweenBuilder<Dp>().also {
    it.duration = 2_000
}

@Composable
fun Container() {
    // an example usage of both of those that animates between horizontal and vertical
    var horizontal by state { false }
    val height = animate(if (horizontal) 150.dp else 300.dp, slowAnimation)
    val width = animate(if (horizontal) 300.dp else 150.dp, slowAnimation)

    Column(Modifier.fillMaxSize().clickable(
        onClick = { horizontal = !horizontal },
        indication = null
    )) {
        Text("Click anywhere to \"rotate\"")
        // showing how to resize inside compose using WithConstraints
        Box(Modifier.preferredHeight(height)
            .preferredWidth(width)
            .drawBackground(Color.Green)) {
            Square {
                Text("Using a composable")
            }
        }
        Divider()
        // The same effect can be created with the aspectRatio modifier
        Box(Modifier.preferredHeight(height)
            .preferredWidth(width)
            .drawBackground(Color.Green)) {
            Text("With modifier", Modifier.aspectRatio(1f)
                .drawBackground(Color.Cyan))
        }
    }

}

@Preview
@Composable
fun _Container() = Container()