彩票走势图

VARCHART XGantt系列教程:甘特图提示与技巧 - 如何设计时尚的工具提示

翻译|使用教程|编辑:黄竹雯|2018-10-23 15:21:00.000|阅读 442 次

概述:本文的分步指南向我们的甘特图组件VARCHART XGantt用户展示了如何设计清晰排列的工具提示。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

VARCHART XGantt是一个交互式的甘特图控件,其模块化的设计让您可以创建满足您和您的客户所需求的应用程序(我们领先的甘特图控件VARCHART XGantt可用于.NET,ActiveX和ASP.NET应用程序。)。VARCHART XGantt可以快速、简单地集成到您的应用程序中,帮助您识别性能瓶颈、避免延迟以及高效利用资源,使复杂数据变得更加容易理解。

甘特图以时间轴可视化任务,资源或能力,从而为规划者提供最佳概览。在设计时,应牢记直接显示对规划者至关重要的信息,以便他能够快速识别规划冲突并进行干预。显示太多信息可能会危及清晰度。这就是为什么工具提示(tooltip)是仅在需要时显示重要数据的好方法。甘特图的真实情况也适用于工具提示:必须快速感知信息,这意味着必须以明确排序和排列的方式呈现信息。本分步指南向我们的甘特图组件VARCHART XGantt用户展示了如何设计清晰排列的工具提示。

 

令人困惑的工具提示

 

VARCHART XGantt中包含的工具提示的设计选项受到限制:

  • 列中数据字段名称和内容的排列
  • 根据条件突出显示关键值
  • 显示表示某些状态的符号

易于阅读的工具提示

这就是工具提示看起来像你绕过有限的设计选项,只需很少的编程工作:

一步一步的指导:

首先,在VARCHART XGantt中停用VcToolTipTextSupplying事件:

然后在Visual Studio解决方案中创建一个新的表单TooltipWindow。在含有XGantt形式的构造中,TooltipWindow得到由调用配置SetTooltipWindowAttributes方法。此方法如下所示:

TooltipWindow _ttw;
private void SetTooltipWindowAttributes()
{
   _ttw = new TooltipWindow(vcGantt1);
 
   //Settings for the Tooltip window:
   _ttw.StartPosition = FormStartPosition.Manual;
   _ttw.AutoScaleMode = AutoScaleMode.Font;
   _ttw.AutoSize = true;
   _ttw.AutoSizeMode = AutoSizeMode.GrowAndShrink;
   _ttw.ControlBox = false;
   _ttw.FormBorderStyle = FormBorderStyle.None;
   _ttw.MaximizeBox = false;
   _ttw.MinimizeBox = false;
   _ttw.ShowIcon = false;
   _ttw.ShowInTaskbar = false;
   _ttw.TopMost = true;
}

现在在TooltipWindow上放置一个DataGridView 并将其命名为TTDataGrid。在DataGridView 的“ 编辑列”对话框中创建三列:

在TooltipWindow的构造函数中,调用SetDataGridAttributes方法并通过此方法配置TTDataGrid。该方法如下所示:

private void SetDataGridAttributes()
{
   //General settings for the data grid:
   TTDataGrid.AllowUserToAddRows = false;
   TTDataGrid.AllowUserToDeleteRows = false;
   TTDataGrid.AllowUserToResizeColumns = false;
   TTDataGrid.AllowUserToResizeRows = false;
   TTDataGrid.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.AllCells;
   TTDataGrid.ClipboardCopyMode = DataGridViewClipboardCopyMode.Disable;
   TTDataGrid.ColumnHeadersVisible = false;
   TTDataGrid.ReadOnly = true;
   TTDataGrid.RowHeadersVisible = false;
   TTDataGrid.ScrollBars = ScrollBars.None;
   TTDataGrid.ShowCellToolTips = false;
 
   TTDataGrid.RowTemplate.DefaultCellStyle.BackColor = Color.FromArgb(255, 240, 240, 240);
   TTDataGrid.RowTemplate.DefaultCellStyle.ForeColor = Color.Black;
   TTDataGrid.RowTemplate.DefaultCellStyle.SelectionBackColor = Color.FromArgb(255, 240, 240, 240);
   TTDataGrid.RowTemplate.DefaultCellStyle.SelectionForeColor = Color.Black;
 
   //Column 0:
   DataGridViewImageColumn dgvic = (DataGridViewImageColumn)TTDataGrid.Columns[0];
   dgvic.ImageLayout = DataGridViewImageCellLayout.Zoom;
   dgvic.ReadOnly = true;
   dgvic.Resizable = DataGridViewTriState.True;
   dgvic.DefaultCellStyle.NullValue = null;
   dgvic.DefaultCellStyle.SelectionBackColor = Color.FromArgb(255, 240, 240, 240);
   dgvic.DefaultCellStyle.SelectionForeColor = Color.Black;
 
   //Column 1:
   DataGridViewColumn dgvc = TTDataGrid.Columns[1];
   dgvc.ReadOnly = true;
   dgvc.Resizable = DataGridViewTriState.True;
   dgvc.SortMode = DataGridViewColumnSortMode.NotSortable;
 
   //Column 2:
   dgvc = TTDataGrid.Columns[2];
   dgvc.ReadOnly = true;
   dgvc.Resizable = DataGridViewTriState.True;
   dgvc.SortMode = DataGridViewColumnSortMode.NotSortable;
}

将鼠标移到VARCHART XGantt上会不断触发VcGantt_MouseMove事件。在这种情况下,首先要通过VcGantt.IdentifyObjectAt方法识别鼠标光标当前悬停的对象类型。

如果鼠标光标悬停在节点上(对象类型为vcObjTypeNodeInDiagram),则会启动一个计时器,使TooltipWindow可见。如果鼠标光标远离节点,则TooltipWindow将再次切换为不可见。

这需要通过以下代码行实现:

bool _isVisible = false;
private void TooltipWindow_VisibleChanged(object sender, EventArgs e)
{
   VcNode node = _gantt.GetNodeByID(_nodeID);
   _isVisible = !_isVisible;
 
   if (_isVisible)
   {
      FillDataGrid(node);
      ResizeDataGrid();
   }
   else
      TTDataGrid.Rows.Clear();
}
 
private void FillDataGrid(VcNode node)
{
   object[] rowValues = new object[TTDataGrid.Columns.Count];
 
   //Fill data grid
   for (short i = 0; i < _dtfc.Count; i++)
   {
      rowValues[1] = _dtfc.DataTableFieldByIndex(i).Name + ":";
      rowValues[2] = node.get_DataField(i).ToString();
 
      TTDataGrid.Rows.Add(rowValues);
   }
 
   //Set attributes for cell(s) which match certain criteria
   DataGridViewCellStyle redCellStyle = new DataGridViewCellStyle();
   redCellStyle.ForeColor = Color.Red;
   redCellStyle.SelectionForeColor = Color.Red;
   redCellStyle.Font = new Font("Microsoft Sans Serif", 8, FontStyle.Bold);
   if (Convert.ToInt32(node.get_DataField(4)) >= 10)   // 4: Duration
   {
      TTDataGrid[0, 4].Value = Enhanced_Tooltip.Properties.Resources.Warning;
      TTDataGrid[2, 4].Style = redCellStyle;
   }
}
 
private void ResizeDataGrid()
{
   int dataGridWidth = 0;
   int dataGridHeight = 0;
 
   //Resize width of data grid
   for (int i = 0; i < TTDataGrid.Columns.Count; i++)
      dataGridWidth += TTDataGrid.Columns[i].Width;
   TTDataGrid.Width = dataGridWidth;
 
   //Resize height of data grid
   for (int i = 0; i < TTDataGrid.Rows.Count; i++)
      dataGridHeight += TTDataGrid.Rows[i].Height;
   TTDataGrid.Height = dataGridHeight;
}

在FillDataGrid方法中,VARCHART XGantt的数据定义的所有数据字段都示例性地加载到DataGrid中。此外,所有操作持续时间大于或等于10,都显示为红色,并在DataGrid的第一列中用黄色感叹号表示。当然,所有这些都可以根据需要进行定制。

想要购买 VARCHART XGantt 正版授权,或者获取更多该产品有趣的可视化提示和技巧的朋友可以点击""哦~

标签:甘特图甘特图开发资源优化资源管理

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn


为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP