Question

So I have a button on a window in a grid column. The button is shown below:

<Button>
    <Border BorderThickness="3" BorderBrush="Red">
        <Grid Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Width}">
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
                <TextBlock Grid.Row="0" Background="LightBlue">bunnies</TextBlock>
            <TextBlock Grid.Row="1" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Width}" Background="LightBlue">bunnies</TextBlock>
        </Grid>
    </Border>
</Button>

What I see is the example in the left most button below, I’d like it to look like 2 below.

EDIT:
If you add a Width=”1000″ to the first TextBlock, you will see the effect I want, except that then the text is not central to the column any more, it’s central to a block 1000 wide. So what I am after is the binding syntax of the actual column width or the actual button width.

I’ve left in some of the things that I’ve tried, changing the Width of a single column definition, binding stuff, all sorts.

Ignore the dodgy editing on the text, I just want the border to reach the edge of the button.
Thanks

Answer 1

Try this:

<Button HorizontalContentAlignment="Stretch">
            <Border BorderThickness="3" BorderBrush="Red">
                <Grid HorizontalAlignment="Stretch">
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" TextAlignment="Center" Background="LightBlue">bunnies</TextBlock>
                    <TextBlock Grid.Row="1" TextAlignment="Center" Background="LightBlue">bunnies</TextBlock>
                </Grid>
            </Border>
        </Button>