I have a design that requires a variable width chip. Chip with the slots seems to grab full width, ...

# compose-wear

[yschimke]

I have a design that requires a variable width chip. Chip with the slots seems to grab full width, assuming it's across the whole screen. Is there a particular form I should use to get the CustomChip described here? https://developer.android.com/training/wearables/compose/chips

Or that's not supported by the Wear material components at the moment?

[Kseniia Shumelchyk]

I think it corresponds to CompatChip

[yschimke]

I tried that and it was shorter, but just as wide. It might be some other layout, issue. I'll try to make a clean repro.

[yschimke]

message has been deleted

[yschimke]

And CompactChip

[yschimke]

Even if I blank out the content it's still as wide. So I'm suspecting it is a property of the Chip.

[yschimke]

message has been deleted

[Steve Bower [G]]

Chip and CompactChip have specific heights by default - but the width would be set using Modifier.width(xxx)

[yschimke]

I don't know the width because the Text is variable. Is there no way to use wrapContextWidth() ? Or give it a preferred small size, and have it expand to the content?

[yschimke]

Column(
    modifier = Modifier.fillMaxSize(),
    verticalArrangement = Arrangement.Center,
    horizontalAlignment = Alignment.CenterHorizontally
) {
    Chip(modifier = Modifier.wrapContentWidth(), onClick = { }, label = {
        Text("Chip")
    })
    Spacer(Modifier.padding(5.dp))
    CompactChip(modifier = Modifier.wrapContentWidth(), onClick = { }, label = {
        Text("Compact")
    })
    Spacer(Modifier.padding(5.dp))
    Button(modifier = Modifier.wrapContentWidth(), onClick = { }) {
        Text("Button")
    }
    Spacer(Modifier.padding(5.dp))
    Text(
        modifier = Modifier
            .wrapContentWidth()
            .background(MaterialTheme.colors.surface), text = "Button"
    )
}

[yschimke]

Gives

[yschimke]

I'm probably doing something stupid, so apologies if so. Usually I've been happy with the defaults, but trying to match a design here.

[yschimke]

message has been deleted

[John Nichol]

There is no way of having a variable sized chip fit its contents at the moment - you need to set the Modifier.width() to control chip width which I appreciate is not what you are looking for here. The cause of this issue is that Chips use .paint() to draw the background as it can be 1) a solid color, 2) an image, 3) a gradient - And many Painters are effectively infinitely large and so will consume all of the space offered to them

[John Nichol]

I have a workaround for this which would work for some of the use cases that we have - particular 1) above - will explore getting this into an upcoming release

[yschimke]

Thanks. Not a rush for me. That sounds perfect.

[John Nichol]

We have found a workaround for this while we work on a longer term fix - set .width(intrinsicSize = IntrinsicSize.Max) to override the current .fillMaxWidth() behaviour

[yschimke]

An example https://github.com/google/horologist/pull/140