https://kotlinlang.org logo
Channels
Powered by
#compose
Title
# compose
l

loloof64

11/25/2020, 7:50 PM
Hi ! Is there a way to get available size somewhere in the Composable tree ? (See the comment) Because in a Composable I made, I could not rely on a Modifier, I really needed to get the size as a parameter.
Copy code
@Composable
fun GameScreen(topLevelNavController: NavController) {
    GameScreenTheme {
        Scaffold(
            topBar = {
                TopAppBar(
                    title = {
                        Text(
                            stringResource(id = R.string.game_page),
                        )
                    },
                    navigationIcon = {
                        IconButton(onClick = {
                            topLevelNavController.popBackStack()
                        }) {
                            Icon(Icons.Filled.ArrowBack)
                        }
                    }
                )
            },
        ) {
            // Is there a way to get available width and height ?
        }
    }
}
b

Bradleycorn

11/25/2020, 7:53 PM
for the whole screen, or just the width and height of the composable?
a

Adam Powell

11/25/2020, 7:57 PM
There are a few ways to go about this depending on use case. What would you like to do with this information?
More specifically, the 
WithConstraints
composable defers composition of its contents until layout time when the sizing constraints are available, and you can compose different UI depending on the size. This is a bit expensive, but it's often the right way to do certain kinds of responsive UIs.
👍 2
l

loloof64

11/25/2020, 8:05 PM
@Bradleycorn Just for the nested composable, where I put the comment 😃
@Adam Powell In fact I would like to give the same size to both width and height. But i want it to be the minimum of the available size.
I'll try WithConstraints. In fact, I just need to compute it on device rotation.
a

Adam Powell

11/25/2020, 8:07 PM
you want to give the same size to both width and height? You might be looking for 
Modifier.aspectRatio(1f)
then
👍 1
WithConstraints
is way overkill for that 🙂
👍 1
l

loloof64

11/25/2020, 8:09 PM
Thank you. So I'll try with aspectRatio of 1. and fill size 😃
a

Adam Powell

11/25/2020, 8:10 PM
try just the aspectRatio first
l

loloof64

11/25/2020, 8:10 PM
ok
It does not work. I think because I must set a size to my Composable manually (I could not do other way) :
Copy code
{
            Column(
                modifier = Modifier.fillMaxSize().aspectRatio(1f)
            ) {
                StaticChessBoard(size = 300.dp)
            }

        }
The StaticChessBoard had to be, for technical reasons, to be given a size manually. Because I had to compute the font size based on the board size.
I managed using `WithConstraints`:
Copy code
Column(
                modifier = Modifier.fillMaxSize().aspectRatio(1f)
            ) {
                WithConstraints {
                    val availableWidth = with(DensityAmbient.current) {constraints.maxWidth.toDp()}
                    val availableHeight = with(DensityAmbient.current) {constraints.maxHeight.toDp()}
                    
                    val minSize = if (availableWidth < availableHeight) availableWidth else availableHeight
                    
                    StaticChessBoard(size = minSize)
                }
            }
a

Andrey Kulikov

11/25/2020, 8:29 PM
you can also just use properties like maxWidth from the WithConstraintsScope instead of calculating availableWidth/availableHeight manually
👍 1
➕ 1
a

Adam Powell

11/25/2020, 8:30 PM
that, and I would probably push the use of 
WithConstraints
down into the part of your code where you need to do font sizing rather than forcing 
StaticChessBoard
to accept a size as a parameter
👍 1
which would then let you use the standard 
Modifier.aspectRatio
for calling 
StaticChessBoard
👍 1
l

loloof64

11/25/2020, 8:37 PM
Yes, you're right. I'm gonna use WithConstraints only for the font computation directly inside the ChessBoard.
a

Adam Powell

11/25/2020, 8:39 PM
Try to avoid using more than one WithConstraints if you can
👍 1
l

loloof64

11/25/2020, 8:41 PM
Yes, I'll restrict its usage at maximum 😃
3 Views
Powered by