看板界面的实现
主要内容可以见DEMO http://files.cnblogs.com/xiaxc889/KanBan.zip
在系统中有时通过以下界面可以直观的展示信息给用户:
以上图形有几点比较重要：
1， 一个面板显示一组属性（例如物料显示物料编号、物料规格），但要把最主要的属性通过颜色单独处分出来。
2， 通过颜色来区分重要性，例如（红色表示缺物料、黄色表示后面还需要物料等）。
实现起来主要考虑一下几点：
1， 每个面板做成一个用户控件（UserControl）;
2， 用一个WrapPannel加载用户控件；
3， 根据属性值设置用户控件的背景；
DEMO中主要说到以下内容：
1， 实体类PartInfo.cs
2， 看板控件KanBanUserControl.xaml
3， 主界面MainWindow.xaml
详细介绍：
1， 实体类PartInfo.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace KanBan
{
public enum KanBanColor
{
Red,
Yellow,
Green
}
public class PartInfo
{
/// <summary>
/// 物料编号
/// </summary>
public string PartNO { get; set; }
/// <summary>
/// 物料编号
/// </summary>
public string Description { get; set; }
/// <summary>
/// 需求数量
/// </summary>
public int Demand { get; set; }
/// <summary>
/// 已存在数量
/// </summary>
public int Exist { get; set; }
/// <summary>
/// 缺乏数量
/// </summary>
public int Lack { get; set; }
/// <summary>
/// 货位编号
/// </summary>
public string Location { get; set; }
/// <summary>
/// 颜色标识
/// </summary>
public KanBanColor ColorTag { get; set; }
}
}
3， 看板控件XAML文件见DEMO,代码部分注意显示和处理颜色的函数；
4， 主界面XAML文件注意ScrollViewer 是用来滚动的。
<ScrollViewer x:Name="scrList" VerticalScrollBarVisibility="Auto">
<WrapPanel Name="mainpanel" Height="{Binding ElementName=scrList, Path=Height, Mode=OneWay}" />
</ScrollViewer>
主界面加载数据主要是用以下函数处理的，在实际中这个可能从数据库读取
private void LoadData()
{
List<PartInfo> partInfos = new List<PartInfo>();
PartInfo model = new PartInfo();
model.PartNO = "000001";
model.Description= "扬声器 0.5W 8Ω 15×11×3.5 弹片";
model.Demand = 100;
model.Exist = 20;
model.Lack = 80;
model.ColorTag = KanBanColor.Red;
model.Location = "A0101";
partInfos.Add(model);
model = new PartInfo();
model.PartNO = "000002";
model.Description = "受话器 10mW 32Ω 弹片";
model.Demand = 100;
model.Exist = 50;
model.Lack = 50;
model.ColorTag = KanBanColor.Yellow;
model.Location = "A0102";
partInfos.Add(model);
model = new PartInfo();
model.PartNO = "000003";
model.Description = "摄像头 IMX105PQH5 800万";
model.Demand = 100;
model.Exist = 100;
model.Lack = 0;
model.ColorTag = KanBanColor.Green;
model.Location = "A0103";
partInfos.Add(model);
//显示看板
foreach (var p in partInfos)
{
PartInfo tmpModel = (PartInfo)p;
KanBanUserControl tempKanBan = new KanBanUserControl();
tempKanBan.ShowMaterialRequirment(tmpModel);
this.mainpanel.Children.Add(tempKanBan);
}
}
看板界面的实现效果：