如何提供内联TextInput格式模板

Question

我有一个Spark TextInput控件，我想在用户输入时自动格式化。格式类似于XX-XX-XXX-XXX，其中每个X都是一个数字。

我创建了一个自定义Formatter，我用它来在其他位置显示这些值，但是我无法获得一个优雅的解决方案来在TextInput控件本身中提供这种自动格式化。

这是我目前的代码。它工作正常，但是当格式化程序插入其中一个连字符时，TextInput的插入点不会前进，因此下一个数字将插入倒数第二个位置。

<fx:Script>
  protected function changeHandler(event:TextOperationEvent):void
  {
    itemID.text = formatter.format(itemID.text);
  }
</fx:Script>

<fx:Declarations>
  <formatters:MyFormatter id="formatter" separator="-" pattern="{[2,2,3,3]}" />
</fx:Declarations>

<s:Form>
  <s:FormItem label="Item ID:">
    <s:TextInput id="itemID" restrict="0-9" change="changeHandler(event)" prompt="ex. xx-xx-xxx-xxx" /> 
  </s:FormItem>
</s:Form>

这是按顺序键入字符1,2,3,4,5,6,7,8,9,0的结果。如您所见，插入点是从末尾开始的三个字符，对应于三个插入的连字符。

有关在这里创建流畅的用户体验的任何建议吗？

Answer 1

如果itemID是基于TextField的类，请使用：

itemID.setSelection(itemID.length, itemID.length);

它会将插入符移动到TF的末尾。