is there any way to align the contents of a button...

# compose-desktop

[Luukas]

is there any way to align the contents of a button to the side?

[orangy]

What do you mean exactly? AFAIR button content is called on a RowScope, so any alignment for rows should work. If not, you can put a box or column inside and do whatever you wish

[Luukas]

So I'm trying to make a few buttons that will use the full width of a column, but the text inside of it it's always centered, tried using alignments or padding and nothing worked

@Composable
fun MenuButton(text: String, goTo: () -> Unit) {
    TextButton(
        onClick = { goTo },
        shape = RectangleShape,
        modifier = Modifier
            .fillMaxWidth()
    ){
        Text(text = text,
            textAlign = TextAlign.Left,
            color = Color.Black)
    }
}

Since the button will repeat itself a bunch of times I made into a Composable element

[Colton Idle]

@Luukas if I'm understanding correctly, you want to remove the padding from a Button in the material package. All material buttons conform to material spec and try their best to prevent you mis-using them. I would just use a base button. It doesn't have any padding.

[Luukas]

Like... a Button() ? @Colton Idle I'm sorry I'm new to kotlin and jetpack ;-;

[Colton Idle]

TextButton is imported from material package no? There should be some other base button to use. Not sure haven't used it.

[Luukas]

I mean, there is button, which is also part of the material package, but sadly I cannot even change the background color on that one

[Luukas]

I got to change the background color, but now it has a shadow...

[Colton Idle]

Is BaseButton a thing?

[Colton Idle]

"I got to change the background color, but now it has a shadow..."
Yeah. You're using a material button. Look for a button not in that package

[Chris Sinco [G]]

You could also just recreate the button with primitive Composables, e.g. Row + Modifier.clickable, to your exact visual liking.

[Chris Sinco [G]]

As mentioned the Button component in Compose is meant to a Material style button out of the box. Though most Buttons in most design systems center align the text. So if you want to create an element that is clickable and has a ripple, and is stylistically different from the out-of-the-box Button, it would be best to create it with Row/Column + clickable modifier.

[Chris Sinco [G]]

Example

[Luukas]

Ooooh that makes so much sense, ty! ❤️

[Colton Idle]

@Chris Sinco [G] is there no such thing as BaseButton? I could have sworn I was listening to some podcast with (@Clara Bayarri?) and she was saying that all of the Base components are there to build upon the second you don't want/need material.

[orangy]

There is no BasicButton (but there is BasicText), button is just a clickable box with a row with content inside. All the rest is just default look and click animations.