1 Reply Latest reply on Jun 6, 2007 2:22 PM by robs72

    Creating complex canvasProxy

    robs72
      Hi,
      I've got a simple set up based on the drap and drop help examples. One main canvas forming the majority of the stage. Within that I have a small canvas that contains an image and a label:

      <mx:Canvas id="myCanvas" width="100" height="100"
      x="100"
      y="200"
      mouseDown="doIconClick(event);">
      <mx:Image id="img" height="60}" width="80" source="assets/thumb.jpg" scaleContent="true" horizontalCenter="0"/>
      <mx:Label id="thumb_label" text="The Label" fontWeight="bold" width="100%" textAlign="center" fontSize="10" y="70" horizontalCenter="0"/>
      </mx:Canvas>

      in the doIconClick() function I have the standard canvasProxy code from the help file (tweaked for colour):

      var canvasProxy:Canvas = new Canvas();
      canvasProxy.width=getScaleSize(100);
      canvasProxy.height=getScaleSize(100);
      canvasProxy.setStyle('backgroundColor', '#ff0000');
      DragManager.doDrag(dragInitiator, ds, event, canvasProxy);

      That just creates a semi-transparent red square that you see when you start to drag the canvas around. What I obviously want is to fake things so that it looks like you're dragging the image and label, like you see if you were to drag the same thing out of a horizontal list for example. I have a feeling I should be adding a child somehow to the canvasProxy object for the image and label element, but I'm pretty clueless on how to go about that if it's even the right approach, or even if this is at all possible!

      Thanks for any help,
      Rob.
        • 1. Creating complex canvasProxy
          robs72 Level 1
          addChild it is then!


          var canvasProxy:Canvas = new Canvas();
          canvasProxy.width=100;
          canvasProxy.height=100;
          canvasProxy.horizontalScrollPolicy='off';
          canvasProxy.verticalScrollPolicy='off';

          var imageProxy:Image = new Image();
          imageProxy.source = 'thumbnail.jpg;;
          imageProxy.height=60;
          imageProxy.width=80;
          imageProxy.scaleContent=true;
          imageProxy.setStyle('horizontalCenter','0');
          canvasProxy.addChild(imageProxy);

          var labelProxy:Label = new Label();
          labelProxy.text = 'The Label';
          labelProxy.y = 70;
          labelProxy.setStyle('fontWeight', 'bold');
          labelProxy.setStyle('horizontalCenter','0');
          labelProxy.setStyle('textAlign','center');
          labelProxy.setStyle('fontSize', '10' );
          canvasProxy.addChild(labelProxy);