Are there any components/styles etc to ensure that text isn't clipped like this?

# compose-wear

[John O'Reilly]

Are there any components/styles etc to ensure that text isn't clipped like this?

[John Nichol]

I have a modifier written that does the equivalent of BoxInsetLayout - trying to decide if modifier is the right way to go with it

It just finds the largest square that that fits and pads for you

[John Nichol]

Only makes sense if your composable is full screen - otherwise it would overpad

[John Nichol]

message has been deleted

[John Nichol]

Here is the rough code interested in whether this feels like a good approach

[John Nichol]

FillMaxRectangle.kt

[John Nichol]

with usage something like

@Composable
fun ExampleRoundScreenPadding(appState: SampleAppState) {
  Box(modifier = Modifier.fillMaxSize().fillMaxRectangle()) {
    Text(
      text ="Katherine Megan ...

[Zoltan Demant]

I like it. Way better readability than wrapping your composables in another composable for the same functionality! 👏🏽

[John O'Reilly]

tried it out in this branch and works great! (in PersonDetailsScreen)

https://github.com/joreilly/PeopleInSpace/tree/compose_wear_details_screen

[maciejciemiega]

@John Nichol is this dedicated modifier class (RectangleInsetModifier) created only to pass custom inspectorInfo? 🤔
Otherwise It would behave the same way with just this.padding(inset), right?

[John Nichol]

this.then(padding(all = inset))

but yes

[maciejciemiega]

I don't think then is needed here. We can just use padding() because the receiver in composed { } is an empty Modifier, or be explicit about it: Modifier.padding() (and .padding() already does the then inside of it)

[maciejciemiega]

I think this should do the same, with inspectorInfo also 🙂

Untitled.txt

[yschimke]

Something bugging me about the UI with a BoxInset. Wasted space and hard cutoff on top and side.

[yschimke]

Seems like the optimal use of screen real estate is probably to have initial layout with image (clipped to Shapes.medium?) showing in top 2/3 without getting cutoff, show some text below to invite scrolling, use a vignette at the bottom to avoid hard cutoff, and assume the user will scroll the section they are reading into the middle 1/3 of the screen.

[yschimke]

@John O'Reilly mind if I play around and put a PR up?

[John O'Reilly]

Of course, yeah, no problem

[saryong]

Oh, I like it, @yschimke
https://github.com/joreilly/PeopleInSpace/pull/83