How to work with different screen configurations i...
# compose
k
How to work with different screen configurations in compose? Like I've to support landscape mode on a 7-inch tablet as well as a portrait mode on regular 5-6 inch mobile phones. How should I
@Preview
for these configurations?
a
@Device, probably
k
So you mean we need to handle those cases using if-else in our code or is there any solution like we used to write multiple xml files for different screen configurations and the one gets shown accordingly
j
Are you wondering about how to generally handle different screen sizes? Or how to preview them?
k
Both
j

https://youtu.be/exjL2kGPngI

❤️ 1
j
Got it. Yeah, to handle different screen sizes, there is a super useful widget called
WithConstraints
that allows you to get information about how much space is available, and decide which children you want to compose based on this information. This allows you to build responsive layouts that adjust themselves (use
if
or
when
statements, etc) and what they display based on the amount of available space. A quick Google search brought up some a 3rd-party blog post, which I haven't read yet, but at first glance looks like a decent place to start: https://jorgecastillo.dev/jetpack-compose-withconstraints
👍 4
j
I think this video explains what you want
👍 2
k
Thanks!