CODEWITHSUNDEEP
c#wpf
Whistler
Whistler

Reputation: 97

WPF ListBoxItem does not stretch to the maximum width in wrappanel

I am trying to make a Listbox that it contains custom control and it could wrap automic.My listbox xaml code like below.I need to three items in each row and stretch to maximum width.It will be wrap to next row if items more than three. I need my custom control stretch on in Horizontal not both all side. How can I do that?

<ScrollViewer HorizontalScrollBarVisibility="Disabled">
            <ListBox>
                <ListBox.Template>
                    <ControlTemplate TargetType="{x:Type ListBox}">
                        <WrapPanel Orientation="Horizontal" IsItemsHost="True" />
                    </ControlTemplate>
                </ListBox.Template>

                <ListBoxItem>
                    <controls:TransducerItem  Margin="5,10"/>
                </ListBoxItem>

                <ListBoxItem>
                    <controls:TransducerItem  Margin="5,10"/>
                </ListBoxItem>


                <ListBoxItem>
                    <controls:TransducerItem  Margin="5,10"/>
                </ListBoxItem>

                <ListBoxItem>
                    <controls:TransducerItem Margin="5,10" />
                </ListBoxItem>

                <ListBoxItem>
                    <controls:TransducerItem  Width="200" Margin="5,10" />
                </ListBoxItem>
            </ListBox>

Upvotes: 0

Views: 331

Answers (1)

Clemens
Clemens

Reputation: 128061

Use a UniformGrid with three columns as ItemsPanel:

<ListBox>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="3" VerticalAlignment="Top"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    ...
</ListBox>

You might also use your TransducerItem control in the ItemTemplate of the ListBox

<ListBox.ItemTemplate>
    <DataTemplate>
        <controls:TransducerItem  Margin="5,10"/>  
    </DataTemplate>
</ListBox.ItemTemplate>

and then bind the ListBox's ItemsSource property to a collection of data items that hold each TransducerItem's data:

<ListBox ItemsSource="{Binding TranducerData}">
    ...
</ListBox>

Take a look at the Data Templating Overview article on MSDN.

Upvotes: 1

Related Questions