DataGrid與Canvas的遮罩效果(實現圓形邊角)

<mx:Canvas width="25%" height="100%" borderStyle="solid" borderColor="black" shadowDistance="0" cornerRadius="8" dropShadowEnabled="true"> <mx:Canvas id="_mask" width="100%" height="100%" borderStyle="solid" borderColor="black" cornerRadius="8"> </mx:Canvas> <mx:DataGrid id="dataGrid" width="100%" height="100%" editable="true" mask="{_mask}"> <mx:columns> <mx:DataGridColumn headerText="屬性名稱" dataField="attributeName" editable="false"/> <mx:DataGridColumn headerText="屬性值" dataField="value" editable="true"/> </mx:columns> </mx:DataGrid> </mx:Canvas>

 

 

注意：<mx:Canvas>標籤裏面還有個<mx:Canvas>,裏面的<mx:Canvas>就是用於遮罩<mx:DataGrid>的，其實這裏就是運用的層的概念,<mx:Canvas>在<mx:DataGrid>的上層,mask就是遮罩的實現，引用的<mx:Canvas>標籤的ID