<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" >
<mx:Script>
<![CDATA[
import mx.controls.Alert;
]]>
</mx:Script>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
]]>
</mx:Script>
<mx:Script>
<![CDATA[
import mx.controls.Button;
import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
import mx.collections.ArrayCollection;
[Bindable]
private var dpADG:ArrayCollection = new ArrayCollection([
{Artist:'Pavement', Album:'Slanted and Enchanted', Price:12.99},
{Artist:'Pavement', Album:'Brighten the Corners', Price:13.99},
{Artist:'Saner', Album:'A Child Once', Price:14.99},
{Artist:'Saner', Album:'Helium Wings', Price:12.99},
{Artist:'The Doors', Album:'The Doors', Price:10.99},
{Artist:'The Doors', Album:'Morrison Hotel', Price:12.99},
{Artist:'Grateful Dead', Album:'American Beauty', Price:11.99},
{Artist:'Grateful Dead', Album:'In the Dark', Price:17.99},
{Artist:'Grateful Dead', Album:'Shakedown Street', Price:13.99},
{Artist:'The Doors', Album:'Strange Days', Price:12.99},
{Artist:'The Doors', Album:'The Best of the Doors', Price:10.99}
]);
protected var artistName:String="Saner";
protected var price:Number=13;
// Event handler to set the selected artist's name
// based on the selected Button control.
public function setArtistName(event:Event):void
{
artistName=Button(event.currentTarget).label;
// Refresh row display.
myADG.invalidateList();
}
// Callback function that hightlights in red
// all rows for the selected artist.
public function myStyleFunc(data:Object,
col:AdvancedDataGridColumn):Object
{
if (data["Artist"] == artistName)
return {color:0xFF0000};
// Return null if the Artist name does not match.
return null;
}
public function myColStyleFunc(data:Object,
col:AdvancedDataGridColumn):Object
{
if(data["Price"] <= price)
return {color:0x00FF00};
return null;
}
public function myColStyleFunc2(data:Object,
col:AdvancedDataGridColumn):Object
{
if(data["Artist"]==artistName)
return {color:0xFFFF00};
return null;
}
public function test():void{
Alert.show("test");
}
]]>
</mx:Script>
<mx:AdvancedDataGrid id="myADG" width="100%" height="100%" dataProvider="{dpADG}" >
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Artist" styleFunction="myColStyleFunc2" />
<mx:AdvancedDataGridColumn dataField="Album" />
<mx:AdvancedDataGridColumn dataField="Price" styleFunction="myColStyleFunc"/>
<mx:AdvancedDataGridColumn textAlign="center" headerText="删除">
<mx:itemRenderer>
<mx:Component>
<!-- The second parameter of the Event constructor (true) indicates that the event should "bubble".
This allows us to listen for the deleteRow event on the DataGrid (see init function) -->
<mx:Button icon="@Embed('icon_plus.png')" click="dispatchEvent(new Event('deleteRow', true));" />
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
</mx:columns>
</mx:AdvancedDataGrid>
<mx:HBox>
<mx:Button label="Pavement" click="setArtistName(event);"/>
<mx:Button label="Saner" click="setArtistName(event);"/>
<mx:Button label="The Doors" click="setArtistName(event);"/>
</mx:HBox>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" >
<mx:Script>
<![CDATA[
import mx.controls.Alert;
]]>
</mx:Script>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
]]>
</mx:Script>
<mx:Script>
<![CDATA[
import mx.controls.Button;
import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
import mx.collections.ArrayCollection;
[Bindable]
private var dpADG:ArrayCollection = new ArrayCollection([
{Artist:'Pavement', Album:'Slanted and Enchanted', Price:12.99},
{Artist:'Pavement', Album:'Brighten the Corners', Price:13.99},
{Artist:'Saner', Album:'A Child Once', Price:14.99},
{Artist:'Saner', Album:'Helium Wings', Price:12.99},
{Artist:'The Doors', Album:'The Doors', Price:10.99},
{Artist:'The Doors', Album:'Morrison Hotel', Price:12.99},
{Artist:'Grateful Dead', Album:'American Beauty', Price:11.99},
{Artist:'Grateful Dead', Album:'In the Dark', Price:17.99},
{Artist:'Grateful Dead', Album:'Shakedown Street', Price:13.99},
{Artist:'The Doors', Album:'Strange Days', Price:12.99},
{Artist:'The Doors', Album:'The Best of the Doors', Price:10.99}
]);
protected var artistName:String="Saner";
protected var price:Number=13;
// Event handler to set the selected artist's name
// based on the selected Button control.
public function setArtistName(event:Event):void
{
artistName=Button(event.currentTarget).label;
// Refresh row display.
myADG.invalidateList();
}
// Callback function that hightlights in red
// all rows for the selected artist.
public function myStyleFunc(data:Object,
col:AdvancedDataGridColumn):Object
{
if (data["Artist"] == artistName)
return {color:0xFF0000};
// Return null if the Artist name does not match.
return null;
}
public function myColStyleFunc(data:Object,
col:AdvancedDataGridColumn):Object
{
if(data["Price"] <= price)
return {color:0x00FF00};
return null;
}
public function myColStyleFunc2(data:Object,
col:AdvancedDataGridColumn):Object
{
if(data["Artist"]==artistName)
return {color:0xFFFF00};
return null;
}
public function test():void{
Alert.show("test");
}
]]>
</mx:Script>
<mx:AdvancedDataGrid id="myADG" width="100%" height="100%" dataProvider="{dpADG}" >
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Artist" styleFunction="myColStyleFunc2" />
<mx:AdvancedDataGridColumn dataField="Album" />
<mx:AdvancedDataGridColumn dataField="Price" styleFunction="myColStyleFunc"/>
<mx:AdvancedDataGridColumn textAlign="center" headerText="删除">
<mx:itemRenderer>
<mx:Component>
<!-- The second parameter of the Event constructor (true) indicates that the event should "bubble".
This allows us to listen for the deleteRow event on the DataGrid (see init function) -->
<mx:Button icon="@Embed('icon_plus.png')" click="dispatchEvent(new Event('deleteRow', true));" />
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
</mx:columns>
</mx:AdvancedDataGrid>
<mx:HBox>
<mx:Button label="Pavement" click="setArtistName(event);"/>
<mx:Button label="Saner" click="setArtistName(event);"/>
<mx:Button label="The Doors" click="setArtistName(event);"/>
</mx:HBox>
</mx:Application>
本文介绍了一个使用 Flex 进行开发的例子,展示了如何通过 AdvancedDataGrid 控件展示音乐专辑信息,并利用自定义样式高亮显示特定艺术家的作品及价格。此外,还实现了基于按钮点击设置所选艺术家名称的功能。
226

被折叠的 条评论
为什么被折叠?



