如何禁用使用内联项渲染器渲染的 Datagrid 中的组件
How to disable a component inside Datagrid which is rendered using inline item renderer
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private var myTimer:Timer;
[Bindable] public var isEnabled:Boolean = true;
public function getDetails():void {
Alert.show("Got it!!");
isEnabled = false;
myTimer = new Timer(5000, 1);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.start();
}
public function timerHandler(event:TimerEvent):void {
isEnabled = true;
}
]]>
</mx:Script>
<mx:ArrayCollection id="myAc">
<mx:source>
<mx:Object version="1.0" telephone="9875454214" />
<mx:Object version="2.0" telephone="8794568784" />
<mx:Object version="3.0" telephone="8796454487" />
</mx:source>
</mx:ArrayCollection>
<mx:HBox>
<mx:DataGrid verticalScrollPolicy="on" focusEnabled="false" name="Version" id="Version" width="100%" height="65" dataProvider="{myAc}" >
<mx:columns >
<mx:DataGridColumn width="150" dataField="version" headerText="Version" />
<mx:DataGridColumn width="70" dataField="telephone" headerText="Telephone" />
<mx:DataGridColumn width="90" paddingLeft="20" headerText="Download">
<mx:itemRenderer>
<mx:Component>
<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails()" enabled = "{outerDocument.isEnabled}" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:HBox>
</mx:Application>
此应用程序被编程为在单击图像时禁用图像,并在 5 秒后启用图像。但它正在禁用整个列。我希望它仅禁用单击的图像。
更改您的 mxml
<!--<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails()" enabled = "{outerDocument.isEnabled}" />-->
<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails(event)" />
这是 AS 代码。
public function getDetails(event: MouseEvent):void {
Alert.show("Got it!!");
//isEnabled = false;
event.target.enabled = false; // Disable clicked Object.
myTimer = new Timer(5000, 1);
//myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, nextfuncWithParams(timerHandler, event.target)); // Pass clicked object.
myTimer.start();
}
public function nextfuncWithParams(nextfunc: Function, params: Object): Function {
return function(event:TimerEvent): void{
nextfunc(event, params);
}
}
public function timerHandler(event: TimerEvent, MouseEventTarget: Object):void {
//isEnabled = true;
MouseEventTarget.enabled = true; // Enable passed object.
}
工作示例:http://wonderfl.net/c/Gv9k
更新
对于使用图像。
public function getDetails(event: MouseEvent):void {
//Alert.show("Got it!!");
//event.target.enabled = false; // event.target was Loader...
var obj: Object = event.target;
while (obj.parent)
{
if (obj is Image)
{
Image(obj).enabled = false;
break;
}
obj = obj.parent;
}
myTimer = new Timer(5000, 1);
//myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, nextfuncWithParams(timerHandler, obj));
myTimer.start();
}
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private var myTimer:Timer;
[Bindable] public var isEnabled:Boolean = true;
public function getDetails():void {
Alert.show("Got it!!");
isEnabled = false;
myTimer = new Timer(5000, 1);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.start();
}
public function timerHandler(event:TimerEvent):void {
isEnabled = true;
}
]]>
</mx:Script>
<mx:ArrayCollection id="myAc">
<mx:source>
<mx:Object version="1.0" telephone="9875454214" />
<mx:Object version="2.0" telephone="8794568784" />
<mx:Object version="3.0" telephone="8796454487" />
</mx:source>
</mx:ArrayCollection>
<mx:HBox>
<mx:DataGrid verticalScrollPolicy="on" focusEnabled="false" name="Version" id="Version" width="100%" height="65" dataProvider="{myAc}" >
<mx:columns >
<mx:DataGridColumn width="150" dataField="version" headerText="Version" />
<mx:DataGridColumn width="70" dataField="telephone" headerText="Telephone" />
<mx:DataGridColumn width="90" paddingLeft="20" headerText="Download">
<mx:itemRenderer>
<mx:Component>
<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails()" enabled = "{outerDocument.isEnabled}" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:HBox>
</mx:Application>
此应用程序被编程为在单击图像时禁用图像,并在 5 秒后启用图像。但它正在禁用整个列。我希望它仅禁用单击的图像。
更改您的 mxml
<!--<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails()" enabled = "{outerDocument.isEnabled}" />-->
<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails(event)" />
这是 AS 代码。
public function getDetails(event: MouseEvent):void {
Alert.show("Got it!!");
//isEnabled = false;
event.target.enabled = false; // Disable clicked Object.
myTimer = new Timer(5000, 1);
//myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, nextfuncWithParams(timerHandler, event.target)); // Pass clicked object.
myTimer.start();
}
public function nextfuncWithParams(nextfunc: Function, params: Object): Function {
return function(event:TimerEvent): void{
nextfunc(event, params);
}
}
public function timerHandler(event: TimerEvent, MouseEventTarget: Object):void {
//isEnabled = true;
MouseEventTarget.enabled = true; // Enable passed object.
}
工作示例:http://wonderfl.net/c/Gv9k
更新 对于使用图像。
public function getDetails(event: MouseEvent):void {
//Alert.show("Got it!!");
//event.target.enabled = false; // event.target was Loader...
var obj: Object = event.target;
while (obj.parent)
{
if (obj is Image)
{
Image(obj).enabled = false;
break;
}
obj = obj.parent;
}
myTimer = new Timer(5000, 1);
//myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, nextfuncWithParams(timerHandler, obj));
myTimer.start();
}