Hello Everybody I was looking for text curved(arc- upper semicircle ) similar to the link below
http://www.housesign.co.uk/design-a-sign/ <http://www.housesign.co.uk/design-a-sign/> If you select circle shape and the text gets curved along upper semicircle. I could not figure out the concepts to achieve the same.Below is my code implemented partially . Will need your suggestions and idea for additional code. <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute" backgroundColor="#FFFFFF" initialize="init();"> <mx:Script> <![CDATA[ import mx.collections.ArrayCollection; import mx.events.ResizeEvent; [Bindable]public var array1:ArrayCollection=new ArrayCollection([{label:"Select"},{label:"Image1",source:"images/1.png"}\ ,{label:"Image2",source:"images/2.png"},{label:"Image3",source:"images/3\ .png"},{label:"Image4",source:"images/4.png"}]); [Bindable]public var array2:ArrayCollection=new ArrayCollection([{label:"Select"},{label:"Img1",source:"images/shape-1.p\ ng"}]); [Bindable]public var array3:ArrayCollection=new ArrayCollection([{label:"Select"},{label:"100 x 100",width:100,height:100},{label:"200 x 200",width:200,height:200},{label:"300 x 300",width:300,height:300},{label:"400 x 400",width:400,height:400}]); public function closeHandler(event:Event):void { image1.source=ComboBox(event.target).selectedItem.source; } public function closehandler1(event:Event):void { image2.source=ComboBox(event.target).selectedItem.source; } public function closehandler2(event:Event):void { image2.width=combo3.selectedItem.width; image2.height=combo3.selectedItem.height; } public var roundedMask:Sprite; public function init():void { roundedMask = new Sprite(); canvas1.rawChildren.addChild(roundedMask); } public function image_resize(evt:ResizeEvent):void { var w:Number = evt.currentTarget.width; var h:Number = evt.currentTarget.height; var cornerRadius:uint = 60; roundedMask.graphics.clear(); roundedMask.graphics.beginFill(0xFF0000); roundedMask.graphics.drawRoundRect(0,0,w,h,cornerRadius,cornerRadius); roundedMask.graphics.endFill(); image1.mask = roundedMask; } ]]> </mx:Script> <mx:VBox height="400" width="400" x="258.5" y="25" horizontalScrollPolicy="off" verticalScrollPolicy="off"> <mx:Canvas id="canvas1" width="100%" height="100%" cornerRadius="30" borderStyle="solid" borderColor="#050505" horizontalScrollPolicy="off" verticalScrollPolicy="off"> <mx:Image height="100%" width="100%" id="image1" maintainAspectRatio="false" resize="image_resize(event);"/> <mx:Image id="image2" horizontalAlign="center" verticalAlign="middle" width="100%" height="100" horizontalCenter="0" verticalCenter="0"/> <mx:Text id="textoutput" x="131" y="179" text="{textinput.text}" color="#FFFFFF" fontFamily="Times New Roman" fontSize="20" mouseUp="textoutput.stopDrag()" mouseDown="textoutput.startDrag()"/> </mx:Canvas> </mx:VBox> <mx:ComboBox x="36" y="51" id="combo1" dataProvider="{array1}" close="closeHandler(event);" selectedIndex="0"/> <mx:Label x="36" y="25" text="Select Background" id="label1"/> <mx:ComboBox x="36" y="112" id="combo2" dataProvider="{array2}" close="closehandler1(event);"/> <mx:Label x="36" y="86" text="Select Image"/> <mx:ComboBox x="36" y="175" id="combo3" dataProvider="{array3}" close="closehandler2(event);"/> <mx:Label x="36" y="149" text="Select Size"/> <mx:TextInput id="textinput" x="36" y="242" width="125" maxChars="15"/> <mx:Label x="36" y="216" text="Please enter text"/> </mx:Application> Looking for immediate reply. Thanks
