本篇文章主要介绍了用c#来实现一个step控件的方法步骤,具有很好的参考价值。下面跟着小编一起来看下吧
现在很多的javascript控件,非常的不错,其中step就是一个,如下图所示:
那么如何用C#来实现一个step控件呢?
先定义一个StepEntity类来存储步骤条节点的信息:
public class StepEntity { public string Id { get; set; } public string StepName { get; set; } public int StepOrder { get; set; } public eumStepState StepState { get; set; } public string StepDesc { get; set; } public object StepTag { get; set; } //public Image StepCompletedImage { get; set; } //public Image StepDoingImage { get; set; } public StepEntity(string id,string stepname,int steporder,string stepdesc, eumStepState stepstate,object tag) { this.Id = id; this.StepName = stepname; this.StepOrder = steporder; this.StepDesc = stepdesc; this.StepTag = tag; this.StepState = stepstate; } }
登录后复制
定义一个名为StepViewer 的用户控件。
public partial class StepViewer : UserControl { public StepViewer() { InitializeComponent(); this.Height = 68; }}
登录后复制
在StepViewer 的用户控件中定义一个ListDataSource的属性,如下:
private List _dataSourceList = null; [Browsable(true), Category("StepViewer")] public List ListDataSource { get { return _dataSourceList; } set { if (_dataSourceList != value) { _dataSourceList = value; Invalidate(); } } }
登录后复制
在此控件的paint方法中,进行步骤条的绘制:
private void StepViewer_Paint(object sender, PaintEventArgs e) { if(this.ListDataSource!=null) { int CenterY = this.Height / 2; int index = 1; int count = ListDataSource.Count; int lineWidth = 120; int StepNodeWH = 28; //this.Width = 32 * count + lineWidth * (count - 1) + 6+300; //defalut pen & brush e.Graphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality; Brush brush = new SolidBrush(_Gray); Pen p = new Pen(brush, 1f); Brush brushNode = new SolidBrush(_DarkGray); Pen penNode = new Pen(brushNode, 1f); Brush brushNodeCompleted = new SolidBrush(_Blue); Pen penNodeCompleted = new Pen(brushNodeCompleted, 1f); int initX = 6; //string Font nFont = new Font("微软雅黑", 12); Font stepFont = new Font("微软雅黑", 11,FontStyle.Bold); int NodeNameWidth = 0; foreach (var item in ListDataSource) { //round Rectangle rec = new Rectangle(initX, CenterY - StepNodeWH / 2, StepNodeWH, StepNodeWH); if (CurrentStep == item.StepOrder) { if (item.StepState == eumStepState.OutTime) { e.Graphics.DrawEllipse(new Pen(_Red,1f), rec); e.Graphics.FillEllipse(new SolidBrush(_Red), rec); } else { e.Graphics.DrawEllipse(penNodeCompleted, rec); e.Graphics.FillEllipse(brushNodeCompleted, rec); } //白色字体 SizeF fTitle = e.Graphics.MeasureString(index.ToString(), stepFont); Point pTitle = new Point(initX + StepNodeWH / 2 - (int)Math.Round(fTitle.Width) / 2, CenterY - (int)Math.Round(fTitle.Height / 2)); e.Graphics.DrawString(index.ToString(), stepFont, Brushes.White, pTitle); //nodeName SizeF sNode = e.Graphics.MeasureString(item.StepName, nFont); Point pNode = new Point(initX + StepNodeWH, CenterY - (int)Math.Round(sNode.Height / 2) + 2); e.Graphics.DrawString(item.StepName,new Font( nFont,FontStyle.Bold), brushNode, pNode); NodeNameWidth = (int)Math.Round(sNode.Width); if (index控件的使用:
List list = new List(); list.Add(new StepEntity("1", "新开单", 1, "这里是该步骤的描述信息", eumStepState.Completed, null)); list.Add(new StepEntity("2", "主管审批", 2, "这里是该步骤的描述信息", eumStepState.Waiting, null)); list.Add(new StepEntity("3", "总经理审批", 3, "这里是该步骤的描述信息", eumStepState.OutTime, null)); list.Add(new StepEntity("2", "完成", 4, "这里是该步骤的描述信息", eumStepState.Waiting, null)); this.stepViewer1.CurrentStep = 3; this.stepViewer1.ListDataSource = list;登录后复制
同样的,我们可以实现如下的timeline控件。
以上就是C#开发step步骤条控件的代码详解(图)的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2495558.html