Flex 绘制倒三角

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:s="spark.components.*"
                layout="vertical"
                verticalAlign="middle"
                backgroundColor="0x00ff1e" creationComplete="creationCompleteHandler(event)">
    <mx:VBox width="200" height="60" verticalAlign="middle">
        <mx:HBox width="100%" height="35" backgroundColor="0xff0000" cornerRadius="5"/>
        <mx:HBox width="100%" height="100%" paddingLeft="25" paddingTop="5">
            <mx:HBox width="5" height="10" backgroundColor="0xffffff" id="borderContainer"  backgroundAlpha="0" horizontalAlign="center" verticalAlign="middle"/>
        </mx:HBox>
    </mx:VBox>
    <mx:Script><![CDATA[
        import mx.core.UIComponent;
        import mx.events.FlexEvent;
        private function creationCompleteHandler(event:FlexEvent):void {
            var ui:UIComponent = new UIComponent();
            var sp:Sprite = new Sprite();
            sp.graphics.lineStyle(1, 0xff0000);
            //填充颜色
            sp.graphics.beginFill(0xff00000);
            /*
             * 划线 lineTo（x,y）
             */
            sp.graphics.lineTo(-12, 10);
            sp.graphics.lineTo(12, 10);
            sp.graphics.endFill();
            ui.addChild(sp);
            //将画好的三角形旋转90 形成倒三角
            var point:Point = new Point(( borderContainer.width / 2),  ( borderContainer.height / 2));
            var matrix1:Matrix = borderContainer.transform.matrix;
            point = matrix1.transformPoint(point);//将图片内部的点转换成父容器坐标的点
            matrix1.tx -= point.x;
            matrix1.ty -= point.y;
            matrix1.rotate(90*(Math.PI/90));
            matrix1.tx += point.x;
            matrix1.ty += point.y;
            borderContainer.transform.matrix = matrix1; //旋转后获取旋转对象的中心点
            borderContainer.addElement(ui);
        }
        ]]></mx:Script>
</mx:Application>

转载于:https://my.oschina.net/wxh1989/blog/718849