John Lloyd
John Lloyd

Reputation: 347

How to implement auto-Vertical-Scrollbar in a ListView with Datatemplate?

I want to insert this template into a ListView and have the scrollbar apear when I overflow my MaxHeight.

I dont know if it's the ControlTemplate or the DataTemplate or whatever. DataBinding works though.

I would realy appreciate hints and help

<ListView Grid.Row="8" 
          Grid.Column="2" 
          Margin="5,5,5,5" 
          HorizontalContentAlignment="Stretch" 
          MaxHeight="110" 
          ScrollViewer.CanContentScroll="True" 
          ScrollViewer.VerticalScrollBarVisibility="auto" 
          ItemsSource="{Binding Linie_Erholungsweg_Typen, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">

  <ListView.Template>
    <ControlTemplate>
      <Border 
           CornerRadius="4" 
           BorderThickness="1" 
           BorderBrush="#333333" 
           Background="White"
           >
        <ItemsPresenter></ItemsPresenter>
      </Border>
    </ControlTemplate>
  </ListView.Template>

  <ListView.ItemTemplate>
    <DataTemplate>
      <WrapPanel>
        <CheckBox IsChecked="{Binding IsSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
        <TextBlock Text="{Binding Typ}" FontWeight="Bold" />
      </WrapPanel>
    </DataTemplate>
  </ListView.ItemTemplate>
</ListView>

Upvotes: 1

Views: 2058

Answers (3)

R. Cohen
R. Cohen

Reputation: 21

If you have StackPanel wrapping your listView. Like in this example.
It will not work! Just change it to Grid, for example, and than it will work.

    <StackPanel>
         <ListView Grid.Row="1" ItemsSource="{Binding Path=DictationVMs}" ScrollViewer.VerticalScrollBarVisibility="Visible"
                   Focusable="True" SelectedValue="{Binding Path=SelectedDictation,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}">
         <ListView.Template>
                <ControlTemplate>
                    <ScrollViewer>
                        <ItemsPresenter VerticalAlignment="Stretch"></ItemsPresenter>
                    </ScrollViewer>
                </ControlTemplate>
         </ListView.Template>
         <ListView.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Path=DictationModel.Name}" HorizontalAlignment="Center" 
                                   VerticalAlignment="Center" FontSize="24" TextWrapping="Wrap"/>
                </DataTemplate>
         </ListView.ItemTemplate>
   </StackPanel>

Upvotes: 2

Babbillumpa
Babbillumpa

Reputation: 1864

A solution could be adding a ScrollViewer to your ListView Template:

            <ListView.Template>
                <ControlTemplate>
                    <Border CornerRadius="4" BorderThickness="1" BorderBrush="#333333" Background="White">
                        <ScrollViewer>
                            <ItemsPresenter></ItemsPresenter>
                        </ScrollViewer>
                    </Border>
                </ControlTemplate>
            </ListView.Template>

Upvotes: 1

Dark Templar
Dark Templar

Reputation: 1155

You need to add a "ScrollViewer" as a parent of the objects you want to scroll, try this:

<DataTemplate>
  <ScrollViewer>
    <WrapPanel>
      <CheckBox IsChecked="{Binding IsSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
      <TextBlock Text="{Binding Typ}" FontWeight="Bold" />
    </WrapPanel>
  </ScrollViewer>
</DataTemplate>

Upvotes: 0

Related Questions