实现一个纵向排列的 ListBox ,并具有操作按钮
需要实现的效果如下:
要想把 ListBox 的内容纵向显示很简单,只需把 ListBox 的内容控件为 WrapPanel 就可以了:
<ListBox.ItemsPanel> <ItemsPanelTemplate> <sltoolkit:WrapPanel /> </ItemsPanelTemplate> </ListBox.ItemsPanel>
在 ListBox 的末项后添加按钮的思路是:添加按钮跟删除按钮都看作是跟普通的 ListItem 一样作为 Item 对象存在,只不过这是2个特殊的 Item:
public bool IsAddButton { get; set; } public bool IsRemoveButton { get; set; }
UI 中根据这2个属性区别于其他的项,并会根据这2个属性控制图片和按钮的显示隐藏:
<Image Source="{Binding ImageUri}" HorizontalAlignment="Left" Height="64" Width="64" Visibility="{Binding IsImage, Converter={StaticResource BoolToVisibilityConverter}}" d:IsHidden="True" /> <Grid Height="64" Width="64" Tap="Grid_Tap_Add" Visibility="{Binding IsAddButton, Converter={StaticResource BoolToVisibilityConverter}}"> <Image Source="/Resources/add.png" /> </Grid> <Grid Height="64" Width="64" Tap="Grid_Tap_Remove" Visibility="{Binding IsRemoveButton, Converter={StaticResource BoolToVisibilityConverter}}"> <Image Source="/Resources/minus.png" /> </Grid>
源代码:demo
作者:backslash112 (美国CS研究生在读/机器人工程师)
出处:http://sirkevin.cnblogs.com
GitHub:https://github.com/backslash112
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
出处:http://sirkevin.cnblogs.com
GitHub:https://github.com/backslash112
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
posted on 2013-10-15 17:29 backslash112 阅读(1376) 评论(0) 编辑 收藏 举报