Dans Flex, comment placer une image dans un canevas sans déborder?

Question

J'ai une image imbriquée dans un canevas.

<mx:Canvas> 
<mx:Image source="@Embed(source='assets/library.swf', symbol='Waves')" /> 
</mx:Canvas> 

Je souhaite que l'image ne dépasse pas les limites de Canvas. Mais lorsque j'ai défini width et height sur le canevas, mon image disparaît. Toile ne semble pas non plus respecter horizontalScrollPolicy.

Cela semble assez facile, mais comme la documentation officielle de Flex est en panne pour l'instant, j'ai pensé que je me tournerais vers SO.

Answer 1

votre canevas doit avoir une largeur et une hauteur et vous pouvez utiliser les propriétés autoscale/maintainaspectratio pour que l'image se comporte correctement.

<mx:Canvas width="500" height="250" 
     verticalScrollPolicy="off" horizontalScrollPolicy="off" 
     backgroundColor="#000000"> 

     <mx :Image id="theimage" 
      maintainAspectRatio="true" 
    scaleContent="true" 
      width="500" height="250" 
      source="your image" /> 
</mx:Canvas> 

vous pouvez également consulter cette post si vous souhaitez centrer l'image. c'est un peu plus compliqué que ça ne le devrait.

Answer 2

Le problème était de ma faute. J'ai défini le point de référence du dessin sur la hauteur de la scène et défini la hauteur du canevas comme étant la hauteur du clip sans marque.

En fin de compte, tordant le point de référence en Flash et en utilisant le code suivant résolu le problème:

<mx:Canvas width="100%" height="200" horizontalScrollPolicy="off" verticalScrollPolicy="off"> 
<mx:Image source="@Embed(source='assets/library.swf', symbol='Waves')" /> 
</mx:Canvas> 

réponse de TheBrain est correcte en règle générale, cependant.