How to force element list to fill the windows on a wrappanel?

Question

I try to do a list of columns on a window and I want to have the same result than in a Grid when I use the *.

<ListView ItemsSource="{Binding UcColumns}" 
              HorizontalContentAlignment="Stretch"
              VerticalAlignment="Stretch"                  
              ScrollViewer.VerticalScrollBarVisibility="Disabled"
              ScrollViewer.HorizontalScrollBarVisibility="Disabled">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>                    
                <WrapPanel IsItemsHost="True" Margin="0"                               
                           Orientation="Horizontal" Background="WhiteSmoke"
                           >


                </WrapPanel>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

    </ListView>

The problem is that the Wrappanel content width and height is depending of it proper content but not of the window size.

I hope you can help me.

Thx.

it does stretch to fill the whole listview... what issue are you facing? — Nitin, Sep 19 '13 at 16:36
@nit: I want that the content (a user control which look like a column) be auto aligned horizontaly and auto ajusted to the window horizontaly and verticaly. — Josselin CAUCHOIS, Sep 20 '13 at 08:44
@Omribitan: it is another possibility but I try the WrapPanel first :) — Josselin CAUCHOIS, Sep 20 '13 at 08:45

score 0 · Answer 1 · answered Sep 19 '13 at 18:45

0

Try this:

<WrapPanel IsItemsHost="True" Margin="0" Orientation="Horizontal" Background="WhiteSmoke"
           Width="{Binding ActualWidth,
                RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}, Mode=FindAncestor}}"

Height="{Binding ActualHeight,
                RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}, Mode=FindAncestor}}">

answered Sep 19 '13 at 18:45

Daniel José Dos Santos

61
1
2

It does not work because the WrapPanel is ever well dimensioned. The problem comes from the content element size which is not good. – Josselin CAUCHOIS Sep 20 '13 at 08:31

Nitin · Answer 2 · 2013-09-20T09:17:01.237

I don't know why you want wrappanel here, but if you want your listviewitem content to stretch to the listview width then you can put the ListView.ItemContainerStyle like below:

        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ListView.ItemContainerStyle>

And set the itemtemplate like:

<ListBox.ItemTemplate>
     <DataTemplate>
        <Grid HorizontalAlignment="Stretch">
         <local:MyuserControl HorizontalAlignment="Stretch"/>
        </Grid>
      </DataTemplate>
</ListBox.ItemTemplate>

This will stretch your items

score 0 · Answer 3 · answered Sep 20 '13 at 17:12

Thanks a lot for helping me.

I combinate your answer and with some other search I solve this problem as write under.

<ListView ItemsSource="{Binding UcColumns}" 
              HorizontalContentAlignment="Stretch"
              VerticalAlignment="Stretch"                  
              ScrollViewer.VerticalScrollBarVisibility="Disabled"
              ScrollViewer.HorizontalScrollBarVisibility="Disabled">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ListView.ItemContainerStyle>

        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"></StackPanel>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

        <ListView.ItemTemplate>
            <DataTemplate >
                <uc:UC_Column HorizontalAlignment="Stretch" VerticalAlignment="Stretch"                                      
                                  Width="{Binding ActualWidth,
                                        Converter={cv:DivideConverter},
                                        ConverterParameter=3,
                                        RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}, Mode=FindAncestor}}"
                                  Height="{Binding ActualHeight,
                                        RelativeSource={RelativeSource AncestorType={x:Type ScrollContentPresenter}, Mode=FindAncestor}}"/>

            </DataTemplate>
        </ListView.ItemTemplate>

    </ListView>

One time again : thank you !

How to force element list to fill the windows on a wrappanel?

3 Answers3