65.9K
CodeProject 正在变化。 阅读更多。
Home

DayPilot Scheduler ASP.NET 控件

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.91/5 (50投票s)

2008年12月14日

Apache

4分钟阅读

viewsIcon

314956

downloadIcon

8013

灵活的开源调度控件(资源预订、项目管理、时间线和空闲/忙碌可视化、甘特图)

DayPilot Scheduler for ASP.NET

在线演示

特点

主要功能

  • 简洁的外观
  • Y 轴上的多个资源
  • X 轴上的可自定义时间刻度(每个单元格 = 1 分钟、1 小时、1 天、1 周……)
  • 突出显示工作时间(可自定义颜色)
  • 自动处理并发事件
  • 可自定义事件框(文本、大小、背景色、持续时间条……)
  • 可自定义字体和颜色

数据库连接

  • 支持 DataSource DataSourceID 属性
  • SqlDataSource
  • XmlDataSource
  • DataTable
  • DataSet
  • ArrayList
  • 及其他数据源……

事件处理

  • 自由时间段点击事件(自动 PostBack 或手动 JavaScript 处理)
  • 日历事件点击事件(自动 PostBack 或手动 JavaScript 处理)

许可

  • 开源(Apache 许可证 2.0)

兼容性

  • Internet Explorer 9
  • Internet Explorer 10
  • Internet Explorer 11
  • Edge(最新版本)
  • Firefox(最新版本)
  • Opera(最新版本)
  • Safari(最新版本)
  • Chrome(最新版本)

背景信息

DayPilot Scheduler 重用了在 DayPilot Calendar 控件(类似 Outlook 的日视图和周视图日历/调度器)中引入的事件排列算法

Open-Source Event Calendar for ASP.NET

DayPilot Calendar 检测重叠事件的块,以便正确显示它们。每个事件框的宽度会根据并发事件的数量进行调整

Calendar Overlapping Events

DayPilot Scheduler 使用相同的排列算法,但布局不同

  • 调度器在 X 轴上显示时间。
  • 事件框高度固定。
  • 并发事件通过增加行高来处理,而不是缩小事件框。

Scheduler Overlapping Events

这减少了并发问题:并发事件数量的增加不会降低可读性。

另请参阅

最小设置示例

<DayPilot:DayPilotScheduler 
  ID="DayPilotScheduler1" 
  runat="server" 
  DataSourceID="SqlDataSource1"
  DataStartField="start" 
  DataEndField="end" 
  DataTextField="name" 
  DataValueField="id" 
  DataResourceField="resource" 
  StartDate="2009-01-01"
  CellDuration="60" 
  Days="1" >
    <Resources> 
      <DayPilot:Resource Name="Room A" Value="A" /> 
      <DayPilot:Resource Name="Room B" Value="B" /> 
      <DayPilot:Resource Name="Room C" Value="C" /> 
    </Resources> 
</DayPilot:DayPilotScheduler>  

第一组属性定义了数据绑定

  • DataSourceID
  • DataStartField (开始 DateTime
  • DateEndField (结束 DateTime
  • DataTextField (事件文本)
  • DataValueField (事件 ID)
  • DataResourceField (资源 ID)

DataResourceField 很重要——此列中的值将与资源 ID(Resource.Value)匹配。

第二组定义了时间范围和刻度

  • StartDate (第一个可见日期)
  • Days (可见天数)
  • CellDuration (单元格持续时间,以分钟为单位)

最后,需要定义资源(行)

  • Resource.Name (行名称)
  • Resource.Value (行 ID)

使用示例

日视图调度器

Daily Scheduler Control for ASP.NET

设置

Days="1" 
CellDuration="60"

StartDate 在代码隐藏中手动设置

DayPilotScheduler1.StartDate = DateTime.Today; 

周视图调度器

Weekly Scheduler Control for ASP.NET

设置

Days="7"
CellDuration="1440" 

使用 Week.FirstDayOfWeek 辅助程序计算每周的第一天

DayPilotScheduler1.StartDate = Week.FirstDayOfWeek(DateTime.Today, DayOfWeek.Monday);

月视图调度器

Monthly Scheduler Control for ASP.NET

设置

CellDuration="1440" 

在这种情况下,需要手动设置 Days 属性

DayPilotScheduler1.StartDate = 
    new DateTime(DateTime.Today.Year, DateTime.Today.Month, 1); 
DayPilotScheduler1.Days = 
    DateTime.DaysInMonth(DateTime.Today.Year, DateTime.Today.Month); 

空闲/忙碌可视化

此视图不显示事件名称(DataTextField 绑定到一个空列)。

设置

DurationBarVisible="false"
EventBackColor="#4A71CE" 

时间线可视化

Timeline Control for ASP.NET

timeline 视图中,资源被行标题中的事件替换。每行始终只有一个事件。

设置

DurationBarVisible="false"
EventBackColor="#CA2A50" 

甘特图

Gantt Chart for ASP.NET

DayPilot Scheduler 可以通过一个开关切换到甘特图模式

ViewType="Gantt"

在甘特图模式下,它将在单独的行中显示每个事件。请参阅甘特图教程 [code.daypilot.org] 中的详细说明。

CSS 主题

您可以使用 CssClassPrefix 属性设置 CSS 主题。有几种预制的 CSS 主题可用。您还可以浏览调度器主题库,或使用在线调度器 CSS 主题设计器设计您自己的主题。

白色 CSS 主题

Scheduler White CSS Theme

绿色 CSS 主题

Scheduler Green CSS Theme

透明 CSS 主题

Scheduler Transparent CSS Theme

另请参阅

DayPilot 教程

历史

© . All rights reserved.