Flex Mobile textInput 滚动文本滞后

Posted 2023-04-18

【中文标题】Flex Mobile textInput 滚动文本滞后

【英文标题】：Flex Mobile textInput in scroller text lag

【发布时间】：2012-03-09 06:30:27

【问题描述】：

在我的 flex 移动应用程序中，输入到 textInput 容器的文本中出现了奇怪的延迟。当我在 textInput 中输入一些文本然后向任何方向滚动时，就会出现问题。整个屏幕和所有对象似乎都在移动，除了 textInput 中的文本。

当我选择 textInput 开始输入时，这成为一个非常大的问题，软键盘出现并移动输入，然后将光标和输入的文本放在屏幕上的其他位置。它看起来很糟糕。

这是一般性能问题吗？有关如何修复的任何建议？

代码是基本的：

 <s:Scroller x="0" y="0"   verticalScrollPolicy="on" >
      <s:Group> 
         <s:TextArea softKeyboardType="number" id="ti1" y="145"                        fontSize="36" fontWeight="bold" horizontalCenter="0" text=" "/>
      </s:Group>
    </s:Scroller>

【参考方案1】：

经过几个小时的谷歌搜索，我自己找到了答案。在textinput语句中，需要添加skinClass="spark.skins.mobile.TextInputSkin"

如果看起来像这样。

<s:Scroller x="0" y="0"   verticalScrollPolicy="on" >
    <s:Group>   
    <s:TextInput skinClass="spark.skins.mobile.TextInputSkin"/>     
    </s:Group>
    </s:Scroller>

当您实际运行应用程序时，这将防止文本“飞出”文本输入框。我确实看到有人提到当你这样做时软键盘将不起作用，但我似乎对此没有任何问题，所以也许已经解决了。希望这对其他人和我一样有用。

【讨论】：

谢谢。这个解决方案效果很好。我的风格有一些问题：我在表单中使用没有边框的 TextInput，然后 formItem 的标签与我的文本底部不对齐。所以我不得不将 paddingBottom 设置为 -10，这导致文本的下半部分被截断。因此，我没有将 paddingBottom 设置为 -10，而是将其设置为 -5，并将 paddingTop 设置为 10。这解决了我的问题。原因是移动皮肤计算measuredHeight为measuredHeight = paddingTop + textHeight + paddingBottom。

【参考方案2】：

要覆盖所有 TextInputs，请使用 CSS。

s|TextInput

skinClass: ClassReference("spark.skins.mobile.TextInputSkin");

【讨论】：

两个答案都是正确的，虽然这是我在全局 CSS 中使用的答案。

【参考方案3】：

现在 softKeyboardType="SoftKeyboardType.NUMBER" 不再起作用了。

有什么想法吗？

对于移动应用程序，您必须使用 StageTextInputSkin 和 StageTextAreaSkin：

<s:TextInput restrict="0-9" maxChars="3"
             skinClass="spark.skins.mobile.StageTextInputSkin"
             softKeyboardType="SoftKeyboardType.NUMBER"/>

<s:TextArea restrict="0-9" maxChars="3"
            skinClass="spark.skins.mobile.StageTextAreaSkin"/>

【参考方案4】：

此问题已在 Apache Flex SDK 版本 4.12.0 中得到修复

参考这个链接 Apache FLEX JIRA

如果您使用的是旧版 SDK，请查看此组件 ExtendedStageTextInput

希望这可能对某人有所帮助....