Sencha Touch: labelWrapをセットするとスクロールできない場合の対処方法
フォームのフィールドに labelWrap: true
をセットしたところ、フォームをスクロールしても元に戻ってしまい、下のフィールドに入力できないという事象が発生しました。
調べてみると、Androidのみで発生し、iPhoneやChrome (Mac)では発生しませんでした。
(Androidは4.1.1と4.2.2で確認。)
なので、実装方法の問題というよりも、Sencha TouchやCordovaのAndroid実装の問題か、Androidの標準ブラウザの問題ではないかと予想しています。
対処方法(暫定)
しばらく悩んだのですが、とりえあず、空のラベルを追加することで解決できることがわかりました。
フォームの入力フィールドの最後に以下のようなラベルを追加します。
xtype: 'label' html: ' ' # 全角スペース height: '1px'
html
の値は半角スペース(
)以外の通常の文字でも問題ないようですが、文字が表示されないよう、文字色を背景色に一緒にする必要があります。
思いっきり対症療法的な方法ですが、ひとまずこれでスクロールできるようになりました。
もっと良い方法があれば教えてください。
環境
Sencha Touch 2.3.1
Cordova 3.4.1
Android 4.1.1, 4.2.2
HTML5モバイルアプリケーションフレームワーク Sencha Touchパーフェクトガイド (アスキー書籍)
- 出版社/メーカー: KADOKAWA / アスキー・メディアワークス
- 発売日: 2014/06/23
- メディア: Kindle版
- この商品を含むブログを見る