#431 – Binding a Control’s Width to Its Height

Since you can bind a property of a control to a different property on that same control, you could bind a control’s width to its height to force the control to  always be square.

In the example below, the Button control’s width changes as the container is resized, since its HorizontalAlignment is set to Stretch.  The Height of the Button is then bound to the ActualWidth property, so that the height always matches the width.

    <StackPanel>
        <Button HorizontalAlignment="Stretch"
                Height="{Binding Path=ActualWidth, RelativeSource={RelativeSource Self}}"
                Content="Height set to Width"
                Margin="5" Padding="5"/>
    </StackPanel>