我们在开发一些Winform程序的时候,除了常规的显示普通数据外,有的时候需要显示一些人员肖像或者一些车辆等物体的图片,一般这些内容较小,所以以二进制存储在数据库是一个不错的方案。但由于它们虽然很常用,设计数据库保存的逻辑又会使得整个控件的封装显得麻烦很多。本文介绍的肖像显示保存控件,通过事件的封装处理,让数据的保存不在依赖于数据库存储模块,实现更加通用的特性。
1、肖像显示保存控件的需求
我们在一些程序了里面,可能需要显示一些人员头像,车辆图片,物件图片等,这些图片可以从电脑上选取,也可以拍照,当然最重要的是,方便使用,并能存储到数据库里面,这个就是我们一般的需求了。
1)人员肖像显示效果:
2)车辆图片展示效果
控件的工具条上,提供了编辑图片,保存图片,恢复默认图片,拍照等功能,当然我们希望控件和整个界面一起,实现图片数据的方便加载和保存操作。
2、肖像显示保存控件的设计
前面我们看了一些常用的场景,对我们设计这个通用性的肖像显示保存控件有很好的指导意义,我们只需要把图片显示部分作为一个控件,然后公布一些事件给外部实现,从而实现我们需要的数据加载、数据保存等操作,至于其他的功能,我们可以集成到里面去。
我们设计一个用户自定义控件,上面放一个图片显示框,然后增加一些按钮在上面,并设置好工具栏的图片显示,效果如下所示。
由于我们需要给外部处理数据的绑定(需要从数据库加载)和数据的保存(保存到数据库里面),因此抛出两个委托代理定义。
/// <summary> /// 保存图片的处理代理定义 /// </summary> /// <param name="id">记录ID</param> /// <param name="imageBytes">图片数据</param> /// <param name="imageType">图片类型</param> /// <returns></returns> public delegate bool SavePortraitHandler(string id, byte[] imageBytes, string imageType); /// <summary> /// 绑定图片数据的代理定义 /// </summary> /// <param name="id">记录ID</param> /// <param name="imageType">图片类型</param> /// <returns></returns> public delegate byte[] BindPortraitHandler(string id, string imageType);
然后我们在用户控件里面增加一些属性和事件定义,部分代码如下所示。
/// <summary> /// 图片数据显示和采集控件 /// </summary> public partial class PortraitControl : XtraUserControl { #region 事件及属性定义 /// <summary> /// 保存图片操作的事件 /// </summary> public event SavePortraitHandler OnSavePortrait; /// <summary> /// 绑定图片数据的事件 /// </summary> public event BindPortraitHandler OnBindPortait; /// <summary> /// 记录ID /// </summary> public string ID { get; set; } /// <summary> /// 图片是否被修改过 /// </summary> public bool ImageIsDirty { get; set; }
然后我们需要实现的就是,公布两个公共方法,分别是数据的绑定,绑定到界面控件的操作函数,我们主要注意的是,这里调用了事件OnBindPortait,以实现数据库的解耦,代码如下所示。
/// <summary> /// 绑定图片的操作,触发绑定事件处理 /// </summary> /// <param name="id">记录ID</param> public void BindPicture(string id) { try { this.ID = id; //设置控件的ID值 #region 更新图片显示操作 if (OnBindPortait == null) { MessageDxUtil.ShowTips("控件未指定OnBindPortait事件处理"); return; } byte[] imageBytes = OnBindPortait(id, ImageType); if (imageBytes != null) { this.picPortrait.Image = ImageHelper.ImageFromBytes(imageBytes); } else { ResetDefaultImage(ImageType); } #endregion } catch (Exception ex) { MessageDxUtil.ShowError(ex.Message); LogTextHelper.Error(ex); } }
数据库保存的实现,和上面思路差不多,也是实现事件的处理即可,通过调用事件OnSavePortrait,实现数据库的解耦。
/// <summary> /// 保存图片到服务器 /// </summary> public bool SavePicture(string id) { this.ID = id;//设置控件的ID值 if (string.IsNullOrEmpty(id)) { MessageDxUtil.ShowTips("记录ID未指定,无法保存,请先保存数据!"); return false; } if (OnSavePortrait == null) { MessageDxUtil.ShowTips("控件未指定OnSavePortrait处理事件!"); return false; } if (picPortrait.Image != null) { try { byte[] imageBytes = ImageHelper.ImageToBytes(this.picPortrait.Image); bool sucess = false; if (OnSavePortrait != null) { sucess = OnSavePortrait(this.ID, imageBytes, ImageType); } return sucess; } catch (Exception ex) { MessageDxUtil.ShowError(ex.Message); LogTextHelper.Error(ex); } } return false; }
3、肖像显示保存控件的使用
完成以上控件的设计和处理后,编译后,模块将增加一个用户控件,这样我们就可以在需要的界面模块里面,把这个控件拖动到设计界面里面去了,设计效果和下图类似。
这个时候,肖像显示保存控件就作为一个整体进行使用了。
由于我们设计控件的时候,我们把它和外部数据库存储和加载进行了隔离,因此这里需要进行整合,通过事件进行整合处理。调用代码如下所示。
public partial class FrmEditDriver : BaseEditForm { public FrmEditDriver() { InitializeComponent(); this.portraitControl1.ImageType = "个人肖像"; this.portraitControl1.OnBindPortait += new BindPortraitHandler(portraitControl1_OnBindPortait); this.portraitControl1.OnSavePortrait += new SavePortraitHandler(portraitControl1_OnSavePortrait); }
然后实现其中自动增加的事件函数即可,主要就是调用业务类实现数据的存储和加载处理逻辑,代码如下所示。
bool portraitControl1_OnSavePortrait(string id, byte[] imageBytes, string imageType) { return BLLFactory<Driver>.Instance.UpdateImageBytes(id, imageBytes, imageType); } byte[] portraitControl1_OnBindPortait(string id, string imageType) { return BLLFactory<Driver>.Instance.GetImageBytes(id, imageType); }
在数据的显示函数里面,我们主动调用控件的函数实现界面数据的绑定显示。
/// <summary> /// 数据显示的函数 /// </summary> public override void DisplayData() { InitDictItem();//数据字典加载(公用) if (!string.IsNullOrEmpty(ID)) { #region 显示信息 DriverInfo info = BLLFactory<Driver>.Instance.FindByID(ID); if (info != null) { tempInfo = info;//重新给临时对象赋值,使之指向存在的记录对象 txtHandNo.Text = info.HandNo; txtName.Text = info.Name; txtMobile.Text = info.Mobile; txtDept.Text = info.Dept; txtStartDriveDate.SetDateTime(info.StartDriveDate); txtSex.Text = info.Sex; txtBirthday.SetDateTime(info.Birthday); txtNote.Text = info.Note; } #endregion } else { } //绑定图片 this.portraitControl1.BindPicture(tempInfo.ID); }
而在保存按钮实现数据保存的时候,我们也可以调用控件自身的保存操作函数,实现数据的存储。
/// <summary> /// 新增状态下的数据保存 /// </summary> /// <returns></returns> public override bool SaveAddNew() { DriverInfo info = tempInfo;//必须使用存在的局部变量,因为部分信息可能被附件使用 SetInfo(info); try { #region 新增数据 bool succeed = BLLFactory<Driver>.Instance.Insert(info); if (succeed) { //可添加其他关联操作 this.portraitControl1.SavePicture(tempInfo.ID); return true; } #endregion } catch (Exception ex) { LogTextHelper.Error(ex); MessageDxUtil.ShowError(ex.Message); } return false; }
通过和数据库操作实现解耦,我们可以对这个控件进行更方便的重用,而代码也很简单,这样也就实现了我们统一化、简单化、可复用性的目标了。