CODEWITHSUNDEEP
c#wpfxaml
bus1hero
bus1hero

Reputation: 309

XAML How to arrange an element after a centered one

I want to create a button that will display some text together with a status icon inside. The text should be centered and the status icon should go right next to the text. Something like this:

Button with a status icon

I didn't find a way how to center only the text and then positioning the icon after the centered text. Right now I am using a Grid solution which centers the text and aligns the icon to the right.

<Button VerticalContentAligment="Stretch" HorizontalContentAligment="Stretch">
    <Grid>
        <TextBlock VerticalAligment="Center" HorizontalAligment="Center"/>
        <Image VerticalAligment="Center" HorizontalAligment="Right"/>
    </Grid>
</Button>

It's not what I want but it's working for the button's size I have at the moment.

I know that this can be accomplished using some binding magic but it seems too simple for this. It will be great if you can point me to a solution without binding magic but I will grateful even for one with it.

Upvotes: 0

Views: 262

Answers (1)

Clemens
Clemens

Reputation: 128013

A Grid with 3 columns should work. When the left and right columns have equal width, the middle one is automatically centered.

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Column="1" VerticalAlignment="Center"/>
    <Image Grid.Column="2" VerticalAlignment="Center" HorizontalAlignment="Left"/>
</Grid>

Upvotes: 1

Related Questions