(一) //新建项目名称: IcoListBox
(二) //主界面 MainWindow.xaml 代码 :
<Window x:Class="IcoListBox.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525"
DataContext="MainViewModel">
<Window.Resources>
<DataTemplate x:Key="ListBoxTemplate">
<Grid Margin="0" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" ></ColumnDefinition>
<ColumnDefinition Width="auto" ></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Source="{Binding Pic}" Width="50" Height="50"/>
<TextBlock Text="{Binding Name}" Width="auto" Height="auto" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</DataTemplate>
</Window.Resources>
<Grid>
<ListBox Name="AppListBox" ItemTemplate="{DynamicResource ListBoxTemplate}" Background ="Transparent"
ItemsSource="{Binding MyModel}" ScrollViewer.CanContentScroll="True" Margin="0,0,30,62">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel IsItemsHost="True"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
</Grid>
</Window>
(三) //MainWindow.xaml.cs 代码:
using IcoListBox;
using System.Collections.Generic;
using System.Threading.Tasks;
namespace IcoListBox
{
public class MainViewModel
{
private List<MainModel> myModel;
public List<MainModel> MyModel
{
get { return myModel; }
set { myModel = value; }
//set
//{
// myModel = value;
// RaisePropertyChanged(() => MyModel);
//}
}
public MainViewModel()
{
//模拟数据
List<MainModel> MList = new List<MainModel>();
for (int i = 1; i < 3; i++)
{
MList.Add(new MainModel { Name = "红外", Pic = @"Skin\Ico\hw.png" });
MList.Add(new MainModel { Name = "视频", Pic = @"Skin\Ico\sp.png" });
MList.Add(new MainModel { Name = "漏水", Pic = @"Skin\Ico\ls.png" });
}
MyModel = MList;
//MList.Add(new MainModel { Name = "红外", Pic = @"Skin\Ico\hw.png" });
//MList.Add(new MainModel { Name = "漏水", Pic = @"Skin\Ico\ls.png" });
//MList.Add(new MainModel { Name = "视频", Pic = @"Skin\Ico\sp.png" });
//MyModel = MList;
}
}
}
(四)//MainViewModel.cs 代码
using IcoListBox;
using System.Collections.Generic;
using System.Threading.Tasks;
namespace IcoListBox
{
public class MainViewModel
{
private List<MainModel> myModel;
public List<MainModel> MyModel
{
get { return myModel; }
set { myModel = value; }
//set
//{
// myModel = value;
// RaisePropertyChanged(() => MyModel);
//}
}
public MainViewModel()
{
//模拟数据
List<MainModel> MList = new List<MainModel>();
for (int i = 1; i < 3; i++)
{
MList.Add(new MainModel { Name = "红外", Pic = @"Skin\Ico\hw.png" });
MList.Add(new MainModel { Name = "视频", Pic = @"Skin\Ico\sp.png" });
MList.Add(new MainModel { Name = "漏水", Pic = @"Skin\Ico\ls.png" });
}
MyModel = MList;
//MList.Add(new MainModel { Name = "红外", Pic = @"Skin\Ico\hw.png" });
//MList.Add(new MainModel { Name = "漏水", Pic = @"Skin\Ico\ls.png" });
//MList.Add(new MainModel { Name = "视频", Pic = @"Skin\Ico\sp.png" });
//MyModel = MList;
}
}
}
(五)//MainModel.cs 代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
namespace IcoListBox
{
public class MainModel
{
public string Name { get; set; }
public string Pic { get; set; }
}
}
(六)//图片请自行添加到项目