Как сделать пользовательский компонент автозаполнения во Flex? - PullRequest
Новая
       26

Как сделать пользовательский компонент автозаполнения во Flex?

1 голос
/ 30 ноября 2010

Мне нужно сделать компонент автозаполнения в flex, который извлекает результаты автозаполнения из удаленной базы данных, используя веб-сервис. У меня есть веб-сервис и часть запросов. Я уже сделал пользовательские компоненты в сценарии действия, расширив VBox. Однако я не могу понять, как создать всплывающее окно, которое должно отображаться под вводом текста в моем текстовом поле автозаполнения.

В настоящее время я использую что-то вроде 

PopUpManager.addPopUp(popup, parentComponent);

Мой всплывающий класс расширяет VBox и расширяет метод createChildren следующим образом 

protected override function createChildren():void
{
  for (var i:int = 0; i < results.length; i++) {
    var itemC:UIComponent =
        factory.getComponent(results[i]);
    addChild(itemC);
    itemC.addEventListener(MouseEvent.CLICK,
        getClickFunction(i));
}

private function getClickFunction(index:int):Function {
    return function (event:MouseEvent):void
        {
            selectedIndex = index;
        };
}

К сожалению, когда веб-сервис извлекает свои результаты и вызывается addPopUp, ничего не появляется.

В настоящее время метод factory.getComponent выполняет этот код 

public function getComponent(user:Object):UIComponent
{
    var email:Label = new Label();
    email.text = user.email;
    var name:Label = new Label();
    name.text = user.displayName;
    var vbox:VBox = new VBox();
    vbox.addChild(name);
    vbox.addChild(email);
    return vbox;
}

Ответы [ 2 ]

1 голос
/ 30 ноября 2010

Я думаю, вы должны искать кого-то, кто уже реализовал это. Хотя ваша проблема, вероятно, связана с не позиционированием и определением размера компонента перед вызовом addPopup (), даже если мы помогли вам решить, что у вас еще много работы. (Кстати, вызовите super.createChildren в вашем переопределении, иначе произойдет что-то плохое). В любом случае, проверьте это:

http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=1047291

0 голосов
/ 02 декабря 2010

Наконец, я понял, как использовать элемент управления List, и прекратил использовать фабрику для генерации компонентов, вместо этого я использую функцию itemRenderer в элементе управления list.Я также использовал это для замены пользовательского всплывающего класса и добавил функцию позиционирования, которая будет вызываться позже.Комбинируя эти вещи, я смог отобразить раскрывающийся список, как и ожидалось.Похоже, что некоторые компоненты не работают как всплывающие окна.

Независимо от этого рабочий всплывающий код имеет вид

Внутри компонента автозаполнения, который расширяет HBox 

dropDownList = new List();
dropDownList.itemRenderer = itemRenderer;
dropDownList.dataProvider = results;
dropDownList.labelFunction = labelFunction;
dropDownList.rowCount = results.length;
dropDownList.labelFunction = labelFunction==null ?
    defaultLabelFunction : labelFunction;
dropDownList.tabFocusEnabled = false;
dropDownList.owner = this;
PopUpManager.addPopUp(IFlexDisplayObject(dropDownList), DisplayObject(this));
callLater(positionDropDownList);

в компоненте автозаполнения (textInput - мое текстовое поле) 

public function positionDropDownList():void {
    var localPoint:Point = new Point(0, textInput.y);
    var globalPoint:Point = localToGlobal(localPoint);
    dropDownList.x = globalPoint.x;
    var fitsBelow:Boolean = parentApplication.height - globalPoint.y - textInput.height > dropDownList.height;
    var fitsAbove:Boolean = globalPoint.y > dropDownList.height;
    if (fitsBelow || !fitsAbove) {
        dropDownList.y = globalPoint.y + textInput.measuredHeight;
    } else {
        dropDownList.y = globalPoint.y - dropDownList.height;
    }
}

Функция позиции - это код, который я позаимствовал у http://hillelcoren.com/flex-autocomplete/

...