Searching this channel with keyword overlap hdpi looks like

Question

Searching this channel with keyword overlap hdpi looks like I m unable to find similar situtation Any advice for a workaround of smaller devices resolutions actual left image expected right image Do we really needs to use `ConstraintLayout` integration with Jetpack Compose or should we use something like <https google github io accompanist flowlayout |FlowLayout>

miqbaldc · Answer

Using `Modifier weight` for each column item seems not the right choice either

Zach Klippenstein (he/him) [MOD] · Answer

It looks like maybe you just need to use a smaller font size

miqbaldc · Answer

Did we really have to handle different ` sp` amp ` dp` for smaller DPI as stated <https developer android com training multiscreen screensizes compose alternative layouts>

miqbaldc · Answer

gt It looks like maybe you just need to use a smaller font size Agreed Honestly we re looking into automagically solution that didn t requires a lot of changes but looks like still not possible for now

Zach Klippenstein (he/him) [MOD] · Answer

The font should be rendered with the appropriate density on different devices but you didn t provide any examples of what this ui looks like on other devices or what your code looks like so I am speculating very hard wink

miqbaldc · Answer

attached the screenshot here <https kotlinlang slack com files U5HHHHBAM F024EJGQSAH screen shot 2021 06 09 at 9 38 32 pm png|for larger resolution>

miqbaldc · Answer

gt The font should be rendered with the appropriate density on different devices We thought this is handled by default in Compose disappointed

Zach Klippenstein (he/him) [MOD] · Answer

And this works as expected with Android views

miqbaldc · Answer

previously we didn t get the report from our existing user on 480 x 800 hdpi regarding this issue we presume this is works as expected with Android views but lemme try to revert it back with Android views and see how it goes in the emulator pray

miqbaldc · Answer

using AndroidViews also doesn t work as expected disappointed

Adam Powell · Answer

if the user requested text and UI elements to be bigger you ll need to respect that decision Oftentimes UIs like this one are made scrollable to account for these cases

Adam Powell · Answer

users lower the effective density of their devices for accessibility they may not be able to read smaller text or accurately touch smaller UI elements

Adam Powell · Answer

I don t see anything wrong with your actual images you can probably add a `Modifier verticalScroll` to the column that contains all of these form items and be good to go

miqbaldc · Answer

gt you can probably add a `Modifier verticalScroll` to the column that contains all of these form items and be good to go ahh thanks for this tada gt users lower the effective density of their devices for accessibility they may not be able to read smaller text or accurately touch smaller UI elements can t be more agreed with you we thought we need to have a smaller sizes as well for smaller resolutions but `verticalScroll` seems the best choice rocket

miqbaldc · Answer

does this mean `Modifier horizontalScroll` is a way to go as well to have a scrollable horizontal content in the lower resolution or this is a no go for horizontal scroll in UX <https kotlinlang slack com files U5HHHHBAM F024Q47DN3W screen shot 2021 06 09 at 10 20 19 pm png|this for example> the string `syarat dan ketentuan` seems broken

Adam Powell · Answer

I would probably try to avoid horizontal scrolling for similar cases and just let it wrap instead I m afraid I don t speak the language used here and don t have context as to whether this suggestion is appropriate or not but it may be an option to use AnnotatedString to provide styling within the same Text composable such that the checkbox label and text beside it wrap as one body of text

miqbaldc · Answer

Ahh that s a great ideas about `AnnotatedString` and the checkbox label

miqbaldc · Answer

~curious if `AnnotatedString` possible to have a click handler on specific styling ~ found the addStringAnnotation answer from here <https stackoverflow com a 65568479 3763032>