Question

I am relatively inexperienced with Silverlight UI development, so please forgive me if this question has an obvious answer, but I have been unable to find one here, or "out there".

I simply want to set a button's width to the maximum space available. That is "essentially" the width of it's parent, although margins and such (on both) will come into play.

I have a list of buttons generated dynamically, inside an ItemsControl, arranged vertically, and would like them all to use up the full width available in the parent. I have seen examples that bind the width to that of the parent, but I was hoping for a more succinct solution, as the parent's width is not ideal due to scroll bars, margins and other elements.

Any advice in this regard would be beneficial and appreciated.

Edit: In response to a request to post the XAML, I have done so.

The XAML I had initially (with a hard-coded width):

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Hidden" Height="500" Margin="0">
    <ItemsControl ItemsSource="{Binding SomeOptions}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Margin="0,0,0,1">
                    <Button Content="{Binding OptionKey}" Height="Auto" Width="400" HorizontalContentAlignment="Left" />
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</ScrollViewer>

And now, working (using "Stretch"), thanks to the accepted answer:

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Hidden" Height="500" Margin="0">
    <ItemsControl ItemsSource="{Binding SomeOptions}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Margin="0,0,0,1">
                    <Button Content="{Binding OptionKey}" Height="Auto" HorizontalAlignment="Stretch" HorizontalContentAlignment="Left" />
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</ScrollViewer>
Was it helpful?

Solution

On the button you can set HorizontalAlignment="Stretch", this will stretch the button to the width of the parent.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top