Question

粘贴到ColorPicker文本字段时，颜色值有时会被截断。

例如，如果我粘贴#0000FF，则显示文本字段#0000F。

如果我关闭颜色选择器，然后再打开并再次粘贴，则会显示#0000FF。

我开始尝试修复它，然后我在SwatchPanel类的textInput更改处理程序中找到了此代码：

private function textInput_changeHandler(event:Event):void
{
    // Handle events from hex TextField.
    var color:String = ITextInput(event.target).text;
    if (color.charAt(0) == "#")
    {
        textInput.maxChars = 7;
        color = "0x"+color.substring(1);
    }
    else if (color.substring(0,2) == "0x")
    {
        textInput.maxChars = 8;
    }
    else
    {
        textInput.maxChars = 6;
        color = "0x"+color;
    }

    highlight.visible = false;
    isOverGrid = false;
    selectedColor = Number(color);

    dispatchEvent(new Event("change"));   
}

看起来RichEditableText在更改事件有机会更新maxChars值之前截断该值。来自RichEditableText：

if (maxChars != 0)
{
    var length1:int = text.length - delLen;
    var length2:int = textToInsert.length;
    // it is truncated from "#0000FF" to "#0000F" here
    if (length1 + length2 > maxChars)
        textToInsert = textToInsert.substr(0, maxChars - length1);
}

因此，在SwatchPanel中看起来像更改事件，textInput_changeHandler为时已晚，无法将maxChars属性更改为不截断粘贴值。有没有关于如何解决这个问题的建议？

完整示例代码：

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

<mx:ColorPicker id="colorPicker" 
                horizontalCenter="0"
                verticalCenter="0"
                paste="trace('pasted')" 
                valueCommit="colorPicker_valueCommitHandler(event)" 
       creationComplete="colorpicker1_creationCompleteHandler(event)"/>


    <fx:Script>
        <![CDATA[
protected function colorpicker1_creationCompleteHandler(event:FlexEvent):void {
    var textinput:ITextInput;

    if (colorPicker.dropdown==null) {
        var swatch:SwatchPanel = colorPicker.getDropdown();
        textinput = swatch.textInput;
    }
    else {
        textinput = colorPicker.getDropdown().textInput;
    }

    IEventDispatcher(textinput).addEventListener("paste", pasteincolorpicker);

    IEventDispatcher(textinput).addEventListener("change", pasteincolorpicker);
    IEventDispatcher(textinput).addEventListener("changing", pasteincolorpicker);
    IEventDispatcher(textinput).addEventListener("valueCommit", pasteincolorpicker);
}
private function pasteincolorpicker(event:Event):void
{
    trace("event.type: " + event.type);
    if (event.type=="changing") {
        event.currentTarget.maxChars = 7;
    }
    var text:String = "";
    if (event is TextOperationEvent) {
        text = TextOperationEvent(event).operation.textFlow.getText();
    }
    trace("pasting: " + text);
}


protected function colorPicker_valueCommitHandler(event:FlexEvent):void
{
    trace("value commit: ");    
}

]]>
</fx:Script>
</s:WindowedApplication>

Answer 1

在Flex项目中的mx组件中使用FTE时似乎会发生这种情况。下面是一个扩展的ColorPicker，可以解决这个问题。当没有检查mx组件中的FTE（在一个项目上测试）时，这似乎不起作用。

use namespace mx_internal;

public class ColorPicker extends mx.controls.ColorPicker
{
    public function ColorPicker()
    {
        super();
    }


    override protected function createChildren():void
    {
        super.createChildren();

        var swatch:SwatchPanel = getDropdown();
        if (!swatch.textInput.hasEventListener(FlexEvent.CHANGING)) {
            swatch.textInput.addEventListener(FlexEvent.CHANGING, changingEventHandler);
        }
    }

    protected function changingEventHandler(event:Event):void
    {
        // set it to max characters of 8
        // allow room for "123456", "#234567", "0x345678" before paste truncates it
        // change event handler in SwatchPanel will set it back to 8, 7 or 6 max chars
        if (event is TextOperationEvent) {
            dropdown.textInput.maxChars = 8;
            //text = TextOperationEvent(event).operation.textFlow.getText();
            //trace("changing to: " + text);
        }
    }
}

ColorPicker文本输入字段会截断粘贴时的值

1 个答案: