内联itemRenderer 내의 itemrenderer
12月20th, 2006 — Dreamer 12月20 일, 2006 - 꿈꾸는英文原文：《Inline itemRenderer》 영어 텍스트 : "인라인 itemrenderer"
原文地址：http://weblogs.macromedia.com/pent/archives/2006/12/inline_itemrend.cfm 기존 주소 : http://weblogs.macromedia.com/pent/archives/2006/12/inline_itemrend.cfm
原文作者：Peter Ent 원래 저자 : 피터 피부과
译者：Dreamer。 역자 : 꿈꾸는합니다. 本文未经同意，谢绝转载。 이 종이, 동의를하지 않고, 재판을 거부합니다.
近来我很高兴和我们的一个客户Davita 的Ryan Green一起工作，他同意我公开这一段代码。 최근에 그 중 하나 기쁩니다 녹색에서 고객과 함께 작동 davita의 라이언, 그는 열이 섹션에 코드의 동의합니다. 我喜欢这段代码因为它虽然很简单然而却包含了很多有趣的东西。 때문에 나는 비록이 코드는 아주 간단하지만 많은 흥미로운 것들을 포함합니다. 在这个例子中我对Ryan 的原始代码做了一些更改。 이 예제에서 나는 원래 코드가 만들어 라이언은 일부 내용을 변경합니다.
下载例子源码： 点击这里 다운로드 예제 소스 : 여기를 클릭하십시오
我从别人那里听到过一些问题，他们将按钮或者其他的交互式组件放到DataGrid的一个单元格中并且想知道如何通过按钮来改变DataGrid。 다른 사람으로부터 들었 많은 문제를 어디에, 그들은 버튼이나 다른 대화식 구성 요소를 데이터를 넣는 방법이 세포에있는 버튼을하는 방법을 알고 싶다 데이터로 변경합니다. 一个常见的使用就是删除本行记录。 일반적인 사용이 은행의 기록을 삭제합니다. 这里介绍了一种方法，在一个简单的订单列表中，点击"add to cart"链接会减少库存中货物的数量。 그러나 여기서는이 방법을, 간단한 목록을 명령하고, "을 클릭하십시오 장바구니에 담기"링크가 나타 양을 줄일 수있습니다 물품 재고 있음. 当数量减少到0的时候该链接就会被禁用而且其标签更改为“out of stock”。 이 번호를 0으로 감소 및 해당 레이블을 금지하면 링크로 변경된다 "품절"합니다.
让我们从声明DataGrid开始。 데이터 성명에서 시작합시다. 你将会看到一个内联的itemRenderer，对于此问题来说这是一个优雅的解决方案。 공동 내의 itemrenderer을 볼 수있습니다,이 문제를 해결하려면 이것은 우아한 솔루션을합니다. 你也可以使用一个代码相同的自定义组件作为itemRenderer。 또한 동일한 구성 요소를 사용하는 사용자 정의 코드 itemrenderer합니다.
width="390" height="169"> 너비 = "390"높이 = "169">
<mx:columns>
<mx:DataGridColumn headerText="Product" dataField="product"/> <mx:datagridcolumn headertext="product" datafield="product"/>
<mx:DataGridColumn headerText="Quantity" dataField="quantity"/> <mx:datagridcolumn headertext="quantity" datafield="quantity"/>
<mx:DataGridColumn headerText="Order" dataField="action" > <mx:datagridcolumn headertext="order" datafield="action">
<mx:itemRenderer> <mx:itemrenderer>
<mx:Component> <mx:component>
<mx:LinkButton label="{data.action}" <mx : linkbutton 레이블 = "(data.action)"
enabled="{data.quantity > 0}" 활성화된 = "(data.quantity> 0)"
click="sendEvent()"> 클릭 = "sendevent ()">
<mx:Script> <mx:script>
<![CDATA[ <! [cdata [
private function sendEvent() : void 민간 기능을 sendevent () : 무효
{ (
dispatchEvent( new CustomEvent(data) ); dispatchevent (새로운 customevent (데이터));
} )
]]> ] ">
</mx:Script> </ mx : 스크립트>
</mx:LinkButton> </ mx : linkbutton>
</mx:Component> </ mx : 구성 요소>
</mx:itemRenderer> </ mx : itemrenderer>
</mx:DataGridColumn> </ mx : datagridcolumn>
</mx:columns> </ mx : 컬럼>
</mx:DataGrid> </ mx : 데이터>
效果如图： 그림 검색 결과 :
最后一列的itemRenderer是一个LinkButton。 마지막으로 itemrenderer가 linkbutton 중 하나를합니다. LinkButton的label是相应记录中"action"域的值。 해당 레코드의 라벨은 linkbutton의 "액션"도메인 값합니다. 只有"quantity"域的值大于0的时候LinkButton才是激活的。 전용 "수량"도메인 linkbutton가 활성화하면 값이 0보다 큰합니다. 当点击LinkButton的时候，会调用脚本代码中的sendEvent()方法。 스크립트 코드를 클릭하면된다 linkbutton에서 호출하면 sendevent () 메소드를합니다.
注意：此处的itemRenderer是一个LinkButton，但是你也可以使用一个容器，比如一个Canvas，然后将LinkButton和其他与你的数据相关的组件放进去。 참고 사항 : itemrenderer 여기에 linkbutton지만 사용할 수있습니다 컨테이너와 같은 캔버스 linkbutton 및 기타 데이터 관련하여 그렇다면 구성 요소를합니다.
处理的点击事件方法sendEvent会分派一个ChartEvent（一个自定义事件）。 이 사건의 처리 방법을 클릭하면된다 sendevent chartevent를 할당 (사용자 정의 경우). ChartEvent只针对本行的数据记录。 이 은행의 데이터 레코드에 대해서만 chartevent합니다.
注意：如果你对itemRenderer很陌生，请记住多数Flex组件，包括用来作为itemRenderer的组件都有一个data属性。 참고 사항 : itemrenderer 아주 이상하는 경우, 대부분의 기억이 플렉스 구성 요소를 포함한 데이터 속성을 itemrenderer 구성 요소로 사용합니다. 这个属性是由dataProvider中与itemRenderer所在行相应的记录所设定的。 이 특성은 dataProvider라는 itemrenderer 행에 해당하는 레코드를 설정합니다.
下面是CartEvent类的代码： 다음은 cartevent 분류 코드 :
{ (
static public const ADD_TO_CART:String = "addToChart"; 정적 공공 const add_to_cart : 문자열 = "addtochart";
public function CartEvent(data:Object, bubbles:Boolean=true, cancelable:Boolean=false) 공공 기능을 cartevent (데이터 : 개체, 거품 : 부울 = 사실이라면 취소할 수 : 부울 = 거짓)
{ (
super(ADD_TO_CART, bubbles, cancelable); 슈퍼 (add_to_cart, 방울, 취소);
this.data = data; this.data = 데이터를;
} )
public var data:Object; 공공 변수 데이터 : 개체를;
} )
这里没有多少需要说明的。 참고 번호를 필요가 없다. 事件类型是"addToCart"。 유형의 이벤트는 "addtocart"합니다. 这不是DataGrid分派的事件，那么你将如何监听并使用这个事件呢？ 이것은 할당된 데이터의 경우, 당신이 모니터하고,이 사건을 사용하는 방법에?» 问题的关键在于事件的bubbles属性的值：它默认在CartEvent构造函数中被设定为true。 문제의 최대 중요 사항의 이벤트의 값을 거짓의 재산 거품 : cartevent 구조적인 기능을 기본으로 설정되어 진정한합니다.
由于DataGrid并不正式地支持"addToCart"，所以你不能将它作为一个属性放到<mx:DataGrid>标签中。 로 데이터를 공식적으로 지원하지 않습니다 "addtocart", 당신의 속성을 세울 수 없을 <mx: datagrid> 탭으로합니다. 但是你可以在ActionScript中为它设定一个事件处理器： 그러나 그것 actionscript 이벤트를 설정할 수있습니다 프로세서 :
使用customHander()函数： 의 사용을 customhander () 함수 :
{ (
// the data record is included in the event; it can be modified and / /의 데이터 기록이이 이벤트에 포함되어있습니다; 그것을 수정할 수있습니다,
// put back into the dataProvider where it will be picked up by the / / 기운을 집어 dataProvider라는 어디로가
// DataGrid / / 데이터
event.data.quantity -= 1; event.data.quantity -= 1;
dp.itemUpdated(event.data,"quantity"); dp.itemupdated (event.data, "수량");
if( event.data.quantity <= 0 ) { 만일 (event.data.quantity <= 0) (
event.data.action = "out of stock"; event.data.action = "품절";
dp.itemUpdated(event.data,"action"); dp.itemupdated (event.data, "행동");
} )
} )
当某一行中的LinkButton被点击的时候，将会分派一个CartEvent，该事件将由customHandler()函数处理。 이 라인의 linkbutton를 클릭 cartevent에 할당된다,이 사건은 customhandler () 함수를 처리합니다. 这个函数将更改对应数据记录的"quantity"的值然后dataProvider就被更新了。 이 함수는 해당 데이터 레코드를 변경합니다 "수량"과 dataProvider라는의 값을 업데이 트되었습니다. 当"quantity"的值变成0的时候，"action"域中的文本将会更改为"out of stock"，同时dataProvider也将被更新。 화면에 "수량"의 시간 값은 0, "액션"도메인의 텍스트가 변경됩니다 "품절", dataProvider라는은 또한으로 업데이 트하는 동안 합니다.
一直点击Sprockets产品（看下图）的"add to cart"的链接直到它的数量减为0。 제품가를 클릭 톱니 (하지 않는 한 그들은)의 "장바구니에 담기"의 링크의 수를 0까지 감소합니다. 然后LinkButton的标签就会变成"out of stock"并且被禁用。 다음 레이블을 linkbutton된다 "품절"와이 해제합니다.
注意当数据更新的时候属性的名字也传给了itemUpdated()方法，这样做可以保证只有那个域被更新了。 시선을 끌 수있는 시간을 특성의 데이터를 업데이 트의 이름도 전달 itemupdated () 방식을 보장할 수있습니다 해당 도메인의 유일한 업데이 트되었습니다. 如果dataProvider有排序操作的话，该域不是排序的一部分，更新它不会引发dataProvider自动排序。 dataProvider라는 일종의 작전 경우,이 도메인의 일부가 아닙니다 정렬, 정렬을 자동으로 업데이 트를하지 않습니다 dataProvider라는 리드합니다.
这个例子可以有很多变型。 이 예에서 여러 유사있을 수있습니다. 例如，CartEvent可以传递行的索引而不是数据本身，然后customHandler就可以使用该索引从dataProvider中提取数据。 예를 들어, cartevent 수있습니다보다는 데이터를 전송하는 그 자체의 색인을 누른 다음 customhandler에서 데이터를 추출하는 색인을 사용할 수있습니다 dataProvider라는합니다. 在某些情况下索引可能比数据本身更有价值，或者你也可以同时使用这两个。 어떤 경우에는 데이터를 색인을 그 자체보다 더 귀중한 수있습니다, 또는이 두 가지를 사용할 수있습니다.
那么itemClick呢？ 그래서 itemclick»
现在你可能会想：只通过itemClick就达到上述的目的阿，为何还好那样做？ 이제 생각할 수도 있겠지만 : 상기 목적을 달성 itemclick를 통해서만 아프카 니스탄, 왜 더 나은» 。 합니다. 没错，使用itemClick你可以知道哪一行的哪个域被点击了。 예, itemclick를 사용할 수있습니다 라인을 알고 있던 도메인을 클릭합니다. 然后你就可以更新数据，DataGrid中的显示也会自动更新。 다음 업데이 트하실 수있습니다 데이터, 데이터가 자동으로 업데이 트를 표시합니다.
但是这种方法的优势是：你有一个可交互的单元格——在本例中是一个LinkButton，但是它可以很复杂。 그러나,이 방법의 장점은 : 세포와 상호 작용하실 수있습니다 -이 사건은 linkbutton,하지만 그것은 매우 복잡합니다. 当你需要一个自定义的itemRenderer的时候不妨考虑一下这种方法。 사용자 정의 itemrenderer 시간이 필요할 때이 방법을 고려해야 할 수도있을 것입니다.
本文链接: http://www.zhuoqun.net/html/y2006/373.html 转载请注明出处，谢谢。 이 링크를 : http://www.zhuoqun.net/html/y2006/373.html 재판 참조하시기 바랍니다, 감사합니다.
TrackBack引用地址： http://www.zhuoqun.net/html/y2006/373.html/trackback 사용 트랙백 주소 : http://www.zhuoqun.net/html/y2006/373.html/trackback
谢谢你的文章帮助我解决了一个棘手的问题！ 이 문서를 도와 주셔서 감사합니다 복잡한 문제를 해결하기!