Flex Scheduling Framework

Adobe Labsにスケジュールコンポーネント用のフレームワーク「Flex Scheduling Framework」が公開されています。

簡単ですがサンプルを作成したので掲載します。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="flexlib.scheduling.*" applicationComplete="applicationCompleteHandle()" backgroundGradientColors="[#c0c0c0, #c0c0c0]">

 <mx:Script>
  <![CDATA[

   import mx.collections.ArrayCollection;
   import mx.collections.IList;
   import flexlib.scheduling.scheduleClasses.ColoredScheduleEntry; 
   import flexlib.scheduling.scheduleClasses.SimpleScheduleEntry;

   [Bindable]
   private var start:Date;

   [Bindable]
   private var end:Date;

   [Bindable]
   private var dataProvider:ArrayCollection;

   private function applicationCompleteHandle():void {

    start = new Date(2008, 0, 1, 9, 0, 0);
    end = new Date(2008, 0, 1, 17, 59, 59);

    var entries:ArrayCollection = new ArrayCollection();

    var row1:IList = new ArrayCollection();    
    var entry1:ColoredScheduleEntry = new ColoredScheduleEntry();
    entry1.startDate = new Date(2008, 0, 1, 9, 30, 0);
    entry1.endDate = new Date(2008, 0, 1, 11, 59, 59);
    entry1.label = "会議";
    entry1.backgroundColor = 0x663333;
    row1.addItem(entry1);

    var row2:IList = new ArrayCollection();
    var entry2:ColoredScheduleEntry = new ColoredScheduleEntry();
    entry2.startDate = new Date(2008, 0, 1, 13, 0, 0);
    entry2.endDate = new Date(2008, 0, 1, 15, 59, 59);
    entry2.label = "プログラミング";
    entry2.backgroundColor = 0x336633;

    row2.addItem(entry2);

    entries.addItem(row1);
    entries.addItem(row2);

    dataProvider = entries;
   }

  ]]>
 </mx:Script>

 <mx:VBox x="0" y="0" height="100%" width="100%" verticalGap="0">
  <ns1:Timeline id="timeline" width="800" height="20" startDate="{start}" endDate="{end}"/>
  <ns1:ScheduleViewer id="scheduleViewer" width="800" height="300" startDate="{start}" endDate="{end}" dataProvider="{dataProvider}" entryLayout="flexlib.scheduling.scheduleClasses.layout.SimpleLayout" entryRenderer="flexlib.scheduling.scheduleClasses.renderers.ColoredSolidScheduleEntryRenderer" x="53" y="143"/>
 </mx:VBox>
 
</mx:Application>

下記の画像が実行結果



タイムラインを表示するコンポーネントとスケジュールを表示するコンポーネントは分かれているようです。

タイムラインを表示するには「flexlib.scheduling.Timeline」クラスを使用し、スケジュールを表示するには「flexlib.scheduling.ScheduleViewer」クラスを使用します。

スケジュールをドラッグ&ドロップで移動できるといいのですが、軽くドキュメントを見た限りでは見つかりませんでした。対応しているのでしょうか？