1

私はフレックスに不慣れで、最近、リストからドラッグされているアイテムに基づいて個々のセルまたは複数の（ただし隣接する）セルを強調表示できるようにするためにデータグリッドで作業する必要があるプロジェクトを割り当てました。シナリオはこんな感じです...

FlexSDK4.6を使用しています。私はmxデータグリッドを持っています（いくつかの制限のためにsparkまたは他のバージョンを使用できません）列の行と時間（00〜23時間）としていくつかの日付があります（したがって、合計25列：最初の列は日付を示し、残りは24時間です）。

このようにして、各日付が24列を何時間も実行する行ヘッダーとして機能します。XMLファイルから入力されているリストがあり、リスト内の各項目には日付と時刻の要素が関連付けられています。リストからデータグリッドにアイテムをドラッグすると、一致する日付（ドラッグされるリストアイテムとデータグリッドの日付の列から）と一致する時間（ドラッグされるリストアイテムとデータグリッドの時間の列から）に基づいて、データグリッド内の特定のセルが強調表示されます。 ）。

これまでのところ、ドラッグ入力で行インデックスと列インデックス/インデックスを取得できますが、行-列全体として強調表示されます。たとえば、3行目と4-5列目であることが判明した場合、3行目全体（25列すべて）と4-5列目の下のすべてのセルが強調表示されます。必要なのは、someCell（rowIndex：xx、ColIndex：YY）のような特定の場所に移動し、そのセルのスタイルを変更することです。item-rendererの例がいくつかありますが、セルのデータを使用して、ある値よりも小さいか大きいかを見つけて操作していますが、私の場合は使用できませんでした。

次に、スクロールバーを日付列の2つのボタン（1つは上部に、もう1つは下部に）に置き換えて、日付をスクロールします。それについてのアドバイスもありがたいです。質問/シナリオを明確にしたことを願っています。ご覧いただきありがとうございます。コミュニティからの助けを楽しみにしています。このタスクは緊急リストにあります...助けてください。

4

1 に答える 1

0

あなたの問題を正確に理解できたなら、ここに私の提案があります。

日付と時刻に関する情報をデータグリッドの各セルに与えることができるはずです。IDropInListItemRenderer インターフェイスを実装する ItemRenderer を介して作成できます。ユーザーが XML リストのいずれかの要素を選択すると、特定の時点が定義され、それが ItemRenderer の 1 つと比較されます。

お役に立てば幸いです。

ここに画像の説明を入力

//CellRenderer.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:mx="library://ns.adobe.com/flex/mx" 
     width="100%" height="100%" 
     backgroundColor="{(cellDate == parentDocument.selectedDate &amp;&amp; cellHour == parentDocument.selectedHour) ? 0xfcb9bb : 0xfefceb}" 
     implements="mx.controls.listClasses.IDropInListItemRenderer">

<fx:Script>
    <![CDATA[
        import mx.controls.dataGridClasses.DataGridListData;
        import mx.controls.listClasses.BaseListData;

        private var _listData:BaseListData;

        [Bindable]private var cellDate:String;
        [Bindable]private var cellHour:String;

        override public function set data( value:Object ) : void 
        {
            super.data = value;

            cellDate = data.date;
            cellHour = (listData as DataGridListData).label;
        }

        [Bindable]public function get listData() : BaseListData
        {
            return _listData;
        }
        public function set listData( value:BaseListData ) : void
        {
            _listData = value;
        }
    ]]>
</fx:Script>

</mx:HBox>

//応用

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
            xmlns:mx="library://ns.adobe.com/flex/mx" 
            layout="absolute" 
            minWidth="955" minHeight="600" creationComplete="initApp()" backgroundColor="0xeeeeee">

<fx:Declarations>
    <fx:Model id="cells">
        <dataset>
            <data>
                <date>14.01.2013</date>
                <h00>00:00</h00>
                <h01>01:00</h01>
                <h02>02:00</h02>
                <h03>03:00</h03>
            </data>
            <data>
                <date>15.01.2013</date>
                <h00>00:00</h00>
                <h01>01:00</h01>
                <h02>02:00</h02>
                <h03>03:00</h03>
            </data>
            <data>
                <date>16.01.2013</date>
                <h00>00:00</h00>
                <h01>01:00</h01>
                <h02>02:00</h02>
                <h03>03:00</h03>
            </data>
            <data>
                <date>17.01.2013</date>
                <h00>00:00</h00>
                <h01>01:00</h01>
                <h02>02:00</h02>
                <h03>03:00</h03>
            </data>
        </dataset>
    </fx:Model>
</fx:Declarations>

<fx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;
        import mx.events.DragEvent;
        import mx.events.ListEvent;

        [Bindable]public var selectedDate:String;
        [Bindable]public var selectedHour:String;

        private function initApp():void 
        {
            srclist.dataProvider = new ArrayCollection([
                {activity: 'Reading',       date: '14.01.2013', hour: '01:00'},
                {activity: 'Television',    date: '15.01.2013', hour: '03:00'},
                {activity: 'Movies',        date: '16.01.2013', hour: '02:00'}
            ]);
        }

        protected function onItemRollOver(event:ListEvent):void
        {
            var item:Object = (srclist.dataProvider as ArrayCollection).getItemAt(event.rowIndex);
            selectedDate = item.date;
            selectedHour = item.hour;
        }
    ]]>
</fx:Script>

<mx:HBox x="35" y="28" height="200">

    <mx:VBox width="124" height="100%">
        <mx:Label text="Available Activities"/>
        <mx:List 
            id="srclist" 
            labelField="activity" 
            width="118" height="100%" 
            allowMultipleSelection="false" 
            dragEnabled="true"
            dragMoveEnabled="true" selectionColor="0xffffff"
            itemRollOver="onItemRollOver(event)" itemRollOut="selectedDate = ''; selectedHour = '';"/>
    </mx:VBox>

    <mx:VBox height="100%">
        <mx:Label text="Scheduler"/>

        <mx:DataGrid 

            width="386" height="100%" dataProvider="{cells.data}" 
            alternatingItemColors="[0xffffff]"
            horizontalGridLineColor="0x999999" 
            horizontalGridLines="true"
            verticalGridLineColor="0x999999" 
            sortableColumns="false" 
            resizableColumns="false" selectable="false">

            <mx:columns>
                <mx:DataGridColumn dataField="date" headerText="Data"/>
                <mx:DataGridColumn dataField="h00" headerText="00:00" itemRenderer="com.CellRenderer"/>
                <mx:DataGridColumn dataField="h01" headerText="01:00" itemRenderer="com.CellRenderer"/>
                <mx:DataGridColumn dataField="h02" headerText="02:00" itemRenderer="com.CellRenderer"/>
                <mx:DataGridColumn dataField="h03" headerText="03:00" itemRenderer="com.CellRenderer"/>
            </mx:columns>
        </mx:DataGrid>
    </mx:VBox>

</mx:HBox>

</mx:Application>
于 2013-01-27T13:12:53.583 に答える