CODEWITHSUNDEEP
c#htmlcss.netwpf
Jonny Piazzi
Jonny Piazzi

Reputation: 3784

Put Images Like Html Float Resource in WPF

In html I can create a div and fill it with images placed in float position:

<div style="width: 560px; height: 560px;">
    <img src="myurl" style="width: 100px; height: 100px; float: left;" />
    <img src="myurl" style="width: 100px; height: 100px; float: left;" />
    <img src="myurl" style="width: 100px; height: 100px; float: left;" />
    ...
</div>

I'm trying to do the same in WPF:

First I tried use StackPanel like this:

<StackPanel>
    <Image Source="myurl" Width="100" Height="100" />
    <Image Source="myurl" Width="100" Height="100" />
    ...
</StackPanel>

Get no success seems this component stack the objects just in one direction.

Next I tried to use ListView:

<ListView Background="#5a5a5a">
    <ListViewItem Width="100" Height="100">
        <Image Source="myurl" Width="100" Height="100" />
    </ListViewItem>
    <ListViewItem Width="100" Height="100">
        <Image Source="myurl" Width="100" Height="100" />
    </ListViewItem>
</ListView>

But all images stay put in the center.

How can I make the same effect of html float using WPF?

Upvotes: 0

Views: 316

Answers (1)

Noam M
Noam M

Reputation: 3164

I think you are looking for WrapPanel class.From MSDN:

Positions child elements in sequential position from left to right, breaking content to the next line at the edge of the containing box. Subsequent ordering happens sequentially from top to bottom or from right to left, depending on the value of the Orientation property.

The wrap panel is similar to the StackPanel but it does not just stack all child elements to one row, it wraps them to new lines if no space is left. The Orientation can be set to Horizontal or Vertical.

The WrapPanel can be used to arrange tabs of a tab control, menu items in a toolbar or items in an Windows Explorer like list. The WrapPanel is often used with items of the same size, but its not a requirement. (Source)

Upvotes: 1

Related Questions