I am missing the ability to add an image to the ContainedButtonStyle button, which is/was possible i...

# compose

[Roar Gronmo]

I am missing the ability to add an image to the ContainedButtonStyle button, which is/was possible in the XML's <Button style="@style/Widget.MaterialComponents.Button.Icon" app:icon="@drawable/my_edit_pen"/>, or do I need to design my own material IconContainedButton (I'd rather not).

[Louis Pullen-Freilich [G]]

Yeah, there isn't icon support there yet - will be in the future.

[Roar Gronmo]

Oh, thanx.

[Louis Pullen-Freilich [G]]

You don't need to design your own button, you can just use the Button overload that takes children, and just add a Row of an image and text if you want, so at least the rest of it will be correctly styled

[Roar Gronmo]

@Louis Pullen-Freilich [G] I tried what you suggested, it works for now, but it isn't quite what I expected, some problems with correct aligning both in height and in width.

Button(onClick = {},
                                    style = ContainedButtonStyle()
                                ){
                                    Row(mainAxisSize = LayoutSize.Expand
                                    ){
                                        VectorImage(id = R.drawable.ic_baseline_edit_24)
                                        WidthSpacer(width = 16.dp)
                                        Text(
                                            text = "UPDATE",
                                            style = +themeTextStyle { button })
                                    }
                                }

[Roar Gronmo]

@Louis Pullen-Freilich [G] BTW: VectorImage is the same used in the "JetNews" example

[Roar Gronmo]

@Louis Pullen-Freilich [G] Better now when I added crossAxisAlignment = CrossAxisAlignment.Center , but it will be still better with an icon parameter.

[Louis Pullen-Freilich [G]]

Yeah, obviously the styling won't be correct (unless you follow the Material spec yourself and make sure the numbers match up) - but it's the easiest way of doing this for now 🙂 This will be natively supported in the future in some form, so you won't have to worry about manually aligning these things