deathrace
deathrace

Reputation: 1073

scrollbar appears wrong on ItemsCotrol of a grid

I have Itemscontrol in the 3rd column of my grid which shows some set of buttons which gets loaded dynamically. I wanted these contents (i.e. buttons) to occupy maximum width of Grid. and when contents exceeds Grid size, it will show vertical scrollbar.

I applied Scrollbar style to ItemsControl as follows :

<Style x:Key="ItemControlStyle" TargetType="{x:Type ItemsControl}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ItemsControl}">
                        <Border>
                            <ScrollViewer HorizontalContentAlignment="Stretch"
                                          CanContentScroll="True"
                                          HorizontalScrollBarVisibility="Disabled"
                                          Uid="ScrollViewer_9"
                                          VerticalScrollBarVisibility="Auto">
                                <ItemsPresenter Margin="{TemplateBinding Padding}"
                                                KeyboardNavigation.DirectionalNavigation="Cycle"
                                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                                Uid="ItemsPresenter_5" />
                            </ScrollViewer>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

I have also applied HorizontalAlignment and VerticalAllignMent as "Stretch" for both ItemsControl as well as its parent i.e. Grid.

Output view I want is( 3rd column of grid) enter image description here

Output I am getting is : enter image description here

Scrollbar should appear after size exceeds How to adjust these contents horizontally to Grid's max width?

Upvotes: 0

Views: 248

Answers (1)

GazTheDestroyer
GazTheDestroyer

Reputation: 21241

Is it just a case of adding HorizontalAlignment=Stretch to ScrollViewer?

ie:

<Style x:Key="ItemControlStyle" TargetType="{x:Type ItemsControl}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ItemsControl}">
                <Border>
                    <ScrollViewer  HorizontalAlignment="Stretch"
                                   HorizontalContentAlignment="Stretch"
                                   CanContentScroll="True"
                                   HorizontalScrollBarVisibility="Disabled"
                                   Uid="ScrollViewer_9"
                                   VerticalScrollBarVisibility="Auto">
                         <ItemsPresenter Margin="{TemplateBinding Padding}"
                                         KeyboardNavigation.DirectionalNavigation="Cycle"
                                         SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                         Uid="ItemsPresenter_5" />
                    </ScrollViewer>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 1

Related Questions