2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Androidでのみ発生するons-carouselのバグ

Last updated at Posted at 2016-08-29

個人的メモ

今作っているアプリのカレンダー部分をAndroidで動作させた際に発見したバグ

※このバグはOnsen UI 2.0.5で解決されました

OnsenUI開発チームには報告済み
https://github.com/OnsenUI/OnsenUI/issues/1565

動作環境

  • OnsenUI 2 RC17
  • AngularJS 1.5.8
  • Android 5.1.1 (6系も確認)

問題

ons-carouselを持つページからinput要素を持つページに遷移した際、input要素にフォーカスしてキーボードを表示させると、前のページのons-carouselのインデックスが0に戻る。Android端末でのみ起こる。

再現方法

  1. ons-carouselを持つページを作る
  2. input要素を持つページを作って遷移させる
  3. 遷移先のinput要素にフォーカスしてキーボードを表示させる

再現用のコードは以下参照
https://codepen.io/puku0x/pen/XKvVoJ

解決方法

幸いにもpostchangeは拾える。
諸事情によりソースは載せられないが、こんな感じで解決した。

  • ページ遷移前にgetActiveIndex()で現在のカルーセルの位置を覚えておく
  • postchangeが発生したらフラグを立てる
  • フラグが立っていたらsetActiveIndex()でカルーセル位置を復元するメソッドをpushPageの引数として渡す
  • 遷移後ページのポップ前に上記のメソッドを呼ぶ

根本的な解決策は今のところ不明 Onsen UI 2.0.5で解決済み

※ 実は後日、iOSでも再現されることが判明した。
※ 2.0.1のマイルストーンに上がったのでリリースを待とう。
https://github.com/OnsenUI/OnsenUI/milestone/15

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?