2012-04-16 14 views
0

スパークコンボボックスの各アイテムにツールチップを表示したいとします。私はここで完全なコードスパークコンボボックスの各アイテムにツールチップを追加する方法

package com.zigron.controls.extended.components 

{ 輸入com.zigron.controls.extended.skins.LabelTextInputSkinがあるCOMBOXのために自分のクラスを使用し

。 import com.zigron.controls.extended.skins.comboBoxRegisterationSkin;

import flash.events.KeyboardEvent; 
import flash.ui.Keyboard; 

import mx.collections.ArrayCollection; 
import mx.collections.ICollectionView; 
import mx.collections.IList; 

import spark.components.ComboBox; 
import spark.components.RichEditableText; 
import spark.events.DropDownEvent; 
import spark.events.TextOperationEvent; 

public class LabelComboBox extends ComboBox 
{ 
    /** 
    * By default, the match is from the beginning of the string only. 
    * Set searchFromBeginning to false to search the entire string for a match. 
    */ 
    public var searchFromBeginning:Boolean = false; 
    private var searchRegEx:RegExp; 
    private var _prompt:String 
    private var promptChanged:Boolean; 
    private var _autoWidth:Boolean = true; 

    public function LabelComboBox() 
    { 
     super(); 
     this.setStyle("skinClass", comboBoxRegisterationSkin); 
     addEventListener(DropDownEvent.OPEN, function (event:DropDownEvent):void 
     { 
      if(dropDown) 
      { 
       if(textInput.text.length == 0) 
       { 
        ArrayCollection(dataProvider).filterFunction = null; 
        ArrayCollection(dataProvider).refresh(); 
       } 

       if(autoWidth) 
       { 
        dropDown.width = scroller.horizontalScrollBar.explicitMaxWidth; 
       } 
       else 
       { 

       } 

       if(dropDown.width < 100) 
       { 
        //dropDown.width = dropdownOriginalWidth; 
       } 
      } 
     }); 


     // Listen for key-up events to engage the filter 
     //this.addEventListener(KeyboardEvent.KEY_UP, onKeyUp); 
     this.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler); 
     // Drop open the ComboBox 
     this.openOnInput = true; 


    } 

    public function get autoWidth():Boolean 
    { 
     return _autoWidth; 
    } 

    public function set autoWidth(value:Boolean):void 
    { 
     _autoWidth = value; 
    } 

    override protected function keyDownHandler(event:KeyboardEvent):void 
    { 

     super.keyDownHandler(event); 

     if((event.keyCode == Keyboard.BACKSPACE) || 
      (event.keyCode == Keyboard.DELETE ) ) 
     { 
      if(textInput.selectionAnchorPosition <= 0) 
      { 
       textInput.text = ""; 
       ArrayCollection(this.dataProvider).filterFunction = null; 
       ArrayCollection(this.dataProvider).refresh(); 
       selectedIndex = -1; 
      } 
     } 

     //adjustSelectionAndCaretUponNavigation(event); 

    } 

    override public function set dataProvider(value:IList):void 
    { 
     super.dataProvider = value; 
     if(value is ICollectionView) 
     { 
      (value as ICollectionView).filterFunction = firstOnlyFilter; 
     } 
    } 


    protected function firstOnlyFilter (item:Object):Boolean 
    { 
     var label2 : String; 
     try 
     { 

      if(labelField != "label" && ! (item is String)) 
       label2 = item[ labelField ]; 
      else 
       label2 = item.toString(); 

     } 
     catch(e:Error) 
     { 
      label2 = "Property not found " + labelField; 
     } 

     var len:int  = textInput.selectionAnchorPosition > 0 ? textInput.selectionAnchorPosition:textInput.text.length; 
     var fil:String = textInput.text.substr(0, len); 
     trace("fil, len, pos : ", fil, len, textInput.selectionAnchorPosition); 
     if(label2.toLowerCase().search(fil.toLowerCase()) != -1) 
     { 
      return true; 
     } 

     return false; 
    } 

    override protected function textInput_changeHandler(event:TextOperationEvent):void 
    { 
     super.textInput_changeHandler(event); 

     if(dataProvider is ArrayCollection) 
     { 
      if(textInput.text.length == 0) 
       ArrayCollection(this.dataProvider).filterFunction = null; 

      (dataProvider as ArrayCollection).refresh(); 
     } 
    } 


    public function get prompt():String 
    { 
     return _prompt; 
    } 

    public function set prompt(v:String):void 
    { 
     if (_prompt != v) 
     { 
      _prompt = v; 
     } 

    } 

    override protected function partAdded(partName:String, instance:Object):void 
    { 
     super.partAdded(partName, instance); 
     if( (instance is LabelTextInput) && partName == "textInput") 
     { 
      trace(partName); 

      //var instance = new LabelTextInput(); 
      //(instance as LabelTextInput).prompt = prompt; 
      //(instance as LabelTextInput).setStyle("skinClass", LabelTextInputSkin); 

      LabelTextInput(instance).prompt = prompt; 
     } 

    } 


    /** Each time the user presses a key, filter the ComboBox items to match. */ 
    private function onKeyUp(event:KeyboardEvent):void 
    { 
     var textBox:RichEditableText = RichEditableText (event.target); 
     var searchText:String = event.target.text; 

     // Number or letter entered 
     if (isAlphaChar(event.keyCode)) 
     { 
      // Set up the search expression 
      searchRegEx = new RegExp(textBox.text, 'i'); 

      // Filter the ArrayCollection 
      ArrayCollection(this.dataProvider).filterFunction = filter; 
      ArrayCollection(this.dataProvider).refresh(); 

      // Set the ComboBox's search text 
      //textBox.text = searchText; 

      //Select the current search text 
      textBox.selectRange(searchText.length, searchText.length); 
     } 

     if(searchText.length == 0) 
     { 
      selectedIndex = -1; 
     } 

     if (event.keyCode == Keyboard.ESCAPE) 
     { 
      textBox.text = ""; 
      ArrayCollection(this.dataProvider).filterFunction = null; 
      ArrayCollection(this.dataProvider).refresh(); 
      this.setFocus(); 
     } 
    } 

    /** The ArrayCollection filter function. Each item gets passed into this. */ 
    private function filter(item:Object):Boolean 
    { 

     var found:Boolean = false; 

     // Determine if the search string is contained in the label of each ComboBox item 
     if (searchFromBeginning) { 
      if (item is String) { 
       found = (item.search(searchRegEx) == 0); 
      } else { 
       found = (String(item[ this[ "labelField" ] ]).search(searchRegEx) == 0); 
      } 
     } else { 
      if (item is String) { 
       found = (item.search(searchRegEx) >= 0); 
      } else { 
       found = (String(item[ this[ "labelField" ] ]).search(searchRegEx) >= 0); 
      } 
     } 

     return found; 
    } 

    /** Filter out any non-alphanumeric key strokes */ 
    private function isAlphaChar(keyCode:int):Boolean 
    { 

     var isAlpha:Boolean = false; 

     if (
      (keyCode > 64 && keyCode < 91) 
      || 
      (keyCode > 96 && keyCode < 123) 
      //|| 
      //(keyCode == Keyboard.BACKSPACE) 
      //|| 
      //(keyCode == Keyboard.DELETE) 
     ) { 
      isAlpha = true; 
     } 

     return isAlpha; 
    } 
} 

}

どのように私は、ツールチップのプロパティを設定している私は、このコンボボックスを使用してどこツールチップが表示されていることに機能しません。あなたが基本的に必要なもの

答えて

2

はにするitemRendererを置くことです私は思います。また、ラベルが含まれている独自のカスタムレンダラを作成して、レンダラ

<?xml version="1.0" encoding="utf-8"?> 
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" 
       autoDrawBackground="true"> 

    <s:Label text="{data.label}" width="100%" maxWidth="100" height="25" paddingLeft="5" paddingTop="5" toolTip ="{data.label}"/> 

</s:ItemRenderer> 
+0

内のツールチップを宣言することができます

<s:ComboBox id="cb" dataProvider="{arr}" itemRenderer="mx.controls.Label" width="200" /> 

にラベルを付けるために等しいですMXコンポーネントをSparkコンポーネントのitemRendererとして使用することができないため、最初のアプローチではコンパイラエラーが発生することがあります。 2番目のアプローチは、おそらく行く方法です。 – JeffryHouser

関連する問題