2010-10-02 7 views
0

J'ai un spark borderContainer qui contient un spark TextInput. J'ai un gestionnaire d'événements mouse_down et mouse_up sur le borderContainer afin de le faire glisser autour de l'écran; tout en faisant glisser je change le curseur. Je voudrais faire en sorte que le textInput se comporte comme un texte "standard", c'est-à-dire en cliquant sur le texte. L'utilisateur ne devrait pas pouvoir faire glisser le composant entier mais simplement interagir avec le texte comme il le ferait normalement. De plus, j'aimerais que le curseur textInput ressemble à un curseur textInput normal.Question de gestion Flex Cursor

Je ne suis pas sûr de bien faire les choses. Mon hypothèse est que j'ai besoin d'arrêter la propagation de mouse_down et mouse_up sur le textInput pour inhiber le comportement de glisser de son parent, et gérer rollOver et rollOut pour que le curseur semble ok. Voir ci-dessous un exemple de mon code (pour le simplifier il n'y a pas borderContainer ou drag - mais le code pour cela serait très simple - juste un peu plus long). Voici donc le problème: si l'on clique sur l'étincelle textInput et qu'on l'exécute ensuite, le curseur se transforme en une combinaison d'un curseur textInput + le curseur standard défini pour borderContainer. Cela ne semble pas se produire sur les composants mx textInput (donc les deux boîtes), mais malheureusement, j'ai besoin d'utiliser des composants spark. Ma conjecture est que je n'appelle pas le cursorManager correctement ou que je n'arrête pas la propagation de mouse_up correctement - il semble qu'il devrait frapper le textInput mais pas propager au borderContainer. J'ai aussi essayé stopPropagation() mais pas de chance.

Aimerait tout conseil/critique constructive.

merci!

f


<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" 
       creationComplete="application1_creationCompleteHandler(event)" 
       mouseDown="application1_mouseDownHandler(event)" 
       mouseUp="application1_mouseUpHandler(event)"> 


<fx:Script> 
    <![CDATA[ 
     import mx.events.FlexEvent; 
     import mx.managers.CursorManager; 
     [Bindable] [Embed(source="../resources/hand.png")] private var _handIcon:Class; 
     [Bindable] [Embed(source="../resources/Fist.png")] private var _fistIcon:Class; 

     private var _cursorID:int; 


     protected function textinput1_rollOutHandler(e:MouseEvent):void 
     { 
      e.stopImmediatePropagation(); 
      CursorManager.removeCursor(_cursorID); 
      _cursorID = CursorManager.setCursor(_handIcon); 
     } 


     protected function textinput1_rollOverHandler(e:MouseEvent):void 
     { 
      e.stopImmediatePropagation(); 
      CursorManager.removeCursor(_cursorID);        
     } 


     protected function application1_creationCompleteHandler(e:FlexEvent):void 
     { 
      _cursorID = CursorManager.setCursor(_handIcon); 
     } 


     private function stopPropagation(event:MouseEvent):void 
     { 
      event.preventDefault(); 
      event.stopImmediatePropagation(); 
     } 

     protected function textinput1_mouseDownHandler(event:MouseEvent):void 
     { 
      stopPropagation(event); 
     } 


     protected function textinput1_mouseUpHandler(event:MouseEvent):void 
     { 
      stopPropagation(event); 
     } 


     protected function application1_mouseDownHandler(event:MouseEvent):void 
     { 
      CursorManager.removeCursor(_cursorID); 
      _cursorID = CursorManager.setCursor(_fistIcon); 
     } 


     protected function application1_mouseUpHandler(event:MouseEvent):void 
     { 
      CursorManager.removeCursor(_cursorID); 
      _cursorID = CursorManager.setCursor(_handIcon); 
     } 

    ]]> 
</fx:Script> 

<s:TextInput x="43" y="30" 
      rollOut="textinput1_rollOutHandler(event)" 
      rollOver="textinput1_rollOverHandler(event)" 
      mouseDown="textinput1_mouseDownHandler(event)" 
      mouseUp="textinput1_mouseUpHandler(event)"/> 
<mx:TextInput x="43" y="70" 
       rollOut="textinput1_rollOutHandler(event)" 
       rollOver="textinput1_rollOverHandler(event)" 
       mouseDown="textinput1_mouseDownHandler(event)" 
       mouseUp="textinput1_mouseUpHandler(event)"/> 

Répondre

0

Vous pouvez simplement ne pas commencer à glisser et ne pas changer le curseur si l'utilisateur clique sur l'entrée:

protected function application1_mouseDownHandler(event:MouseEvent):void 
{ 
    var container:DisplayObjectContainer = event.target as DisplayObjectContainer; 
    if (!container || container == textInput || textInput.contains(container)) 
     return; 

    // start drag and change the cursor 
} 
+0

hein, si simple mais si efficace. Merci Maxim! –

+0

ps - J'en ai utilisé une version légèrement modifiée, mais l'idée d'utiliser le conteneur et d'exécuter les vérifications fonctionne. –

0

moi avons eu un problème similaire mais j'ai plusieurs champs TextInput dans le conteneur. Donc, pour éviter de vérifier chaque d'entre eux je cette version de l'idée:

if (event.target is RichEditableText) return; 

fonctionne parfaitement ...

Salutations, J!