Flex 2 技巧 - 圓角容器遮罩

<!---------------------------mxml------------------------------------->
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="service.send()" >
<mx:Script >
    <![CDATA[
        import mx.rpc.events.ResultEvent;
        private function process_result(event:ResultEvent):void
        {
        var xml:XML=XML(event.result);
        datagrid.dataProvider=xml.children();
        }
    ]]>
</mx:Script>

<mx:HTTPService id="service" useProxy="false" url="user.xml" resultFormat="xml" result="process_result(event)">    
</mx:HTTPService>
<mx:Canvas x="96" y="61" width="235" height="200" borderStyle="solid" cornerRadius="{num.value}" backgroundColor="#0" id="can2" cacheAsBitmap="true">
        </mx:Canvas>
<mx:Canvas x="412" y="61" width="248" height="200" borderStyle="solid" cornerRadius="{num.value}" backgroundColor="#0" id="can4" cacheAsBitmap="true">
        </mx:Canvas>
    <mx:Canvas x="96" y="61" width="235"  height="202" id="can1" mask="{can2}" cacheAsBitmap="true">
        <mx:Button x="-18" y="-15" label="Button" height="63" width="80" color="#ABC8E4" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#6C9ECD, #6C9ECD, #6C9ECD, #6C9ECD]"/>
        <mx:Button x="169" y="-15" label="Button" height="63" width="80" color="#D1E0E3" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#9BAEB4, #9BAEB4, #9BAEB4, #9BAEB4]"/>
        <mx:Button x="-18" y="155" label="Button" height="63" width="80" color="#D6DFE1" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#81BDDF, #81BDDF, #81BDDF, #81BDDF]"/>
        <mx:Button x="169" y="155" label="Button" height="63" width="80" color="#CEEEF5" cornerRadius="7" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#B3C8DE, #B3C8DE, #B3C8DE, #B3C8DE]"/>        
    </mx:Canvas>
    <mx:NumericStepper x="141" y="10" id="num" value="0" minimum="0" maximum="120" enabled="true" cornerRadius="10" backgroundColor="#0F0404" backgroundAlpha="0.68" fontSize="12" fontWeight="bold" textAlign="center" color="#D9EDF1"/>
    <mx:Canvas x="412" y="61" width="248" height="200" mask="{can4}"  cacheAsBitmap="true" id="can3">
        <mx:DataGrid x="0" y="0" id="datagrid" enabled="true" fontWeight="bold" textAlign="center" fontSize="12" color="#3F6FB1" borderThickness="0" borderColor="#EAEDEF" themeColor="#C2CBCC" alpha="0.31" alternatingItemColors="[#F7F7F7, #F0EDED]" width="248" height="200">
            <mx:columns>
                <mx:DataGridColumn headerText="ID" dataField="ID"/>
                <mx:DataGridColumn headerText="姓名" dataField="Name"/>
                <mx:DataGridColumn headerText="电话" dataField="Tel"/>
            </mx:columns>
        </mx:DataGrid>
    </mx:Canvas>

</mx:Application>

<!--------------------------------------------- 设置注意-----------------------------------------------------------------
cacheAsBitmap="true" 
borderStyle="solid"
mask="{can4}"  遮罩层
--------------------------------------------------------------------------------------------------------------->

<!-------------------------------user.xml-------------------------------->
<?xml version="1.0" encoding="utf-8"?>
<users>
<user>
<ID>213001</ID>
<Name>NAME1</Name>
<Tel>132********</Tel>
</user>
<user>
<ID>213002</ID>
<Name>NAME2</Name>
<Tel>134********</Tel>
</user>
<user>
<ID>213003</ID>
<Name>NAME3</Name>
<Tel>158********</Tel>
</user>
<user>
<ID>213004</ID>
<Name>NAME4</Name>
<Tel>131********</Tel>
</user>
<user>
<ID>213005</ID>
<Name>NAME5</Name>
<Tel>132********</Tel>
</user>
</users>