这个界面如何布局（帖子里附有图片）

danxuezx 2012-03-31 04:03:34

上面是示意图，具体规则如下：

1 窗口的大小由小Item（上图共有8个小图，小Item间的距离和小Item自身的大小是固定的）决定，这个问题我已经解决了。

2 有几个Item界面上显示几个Item，当大于四个时，多出的自动往现有的上一行排列。

不知道是否说清楚了~~

这个界面应该使用哪些布局控件进行布局呢？

WPF新手，请大家多多指点~~

我目前只能把每个item用DataTemplate表示出来，但外面该用什么控件我搞不定~~

绑定的数据源我准备用List。

...全文

133 12 打赏收藏转发到动态举报

写回复

用AI写文章

12 条回复

切换为时间正序

请发表友善的回复…

发表回复

danxuezx 2012-04-01

打赏
举报

感谢各位指点，目前我采用代码通过canvas来实现的。
WPF刚接触，绑定这块还没有把握~~

帖子先结了，后面抽空我会用listview，WrapPanel，UniformGrid来分别实现。
到时候再另开贴分享。

再次感谢各位的热心指点~~

nonocast 2012-03-31

打赏
举报

你可以参考一下
http://nonocast.cn/?p=2679

不过因为需要ItemSource做Binding，所以采用ListBox做Logical Element，用UniformGrid/WrapPanel来做Visual Element

May that helps.

nonocast 2012-03-31

打赏
举报

一般来说用WrapPanel



<Style x:Key="listboxGalleryStyle" TargetType="{x:Type ListBox}">

<Setter Property="ItemsPanel">

    <Setter.Value>

        <ItemsPanelTemplate>

            <WrapPanel HorizontalAlignment="{Binding HorizontalAlignment}" VerticalAlignment="{Binding VerticalAlignment}" />

        </ItemsPanelTemplate>

    </Setter.Value>

</Setter>

</Style>

控制WrapPanel的MaxWidth是4个Item即可，另外一个选择是UniformGrid
设置Columns=4也行

ohkuy 2012-03-31

打赏
举报

[Quote=引用 8 楼的回复:]

决定用listview，正好学习一下，今天必须搞定~~
[/Quote]
加油，明天来看好消息。。。

danxuezx 2012-03-31

打赏
举报

决定用listview，正好学习一下，今天必须搞定~~

cheng2005 2012-03-31

打赏
举报

如果每个格子大小是一样的。
<ItemsControl Margin="5" ItemsSource="{Binding SymbolIDList,Mode=TwoWay}" >
<ItemsControl.ItemTemplate>
<DataTemplate>

<label/>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="{Binding ColumnCount}" Rows="{Binding RowCount}" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>

你控制好行和列就行

ohkuy 2012-03-31