Monthly Archives: 11月 2015

You are browsing the site archives by month.

Onsen UI ons-carouselで困ったこと(2)

環境はこちら

前回はこちら

01|2|
となってしまっているのをどうするか

まぁ普通に考えると
setActiveCarouselItemIndex(1)
だったので試してみる

0|1|2
にはなったが、見え方が行って戻ってみたいな感じになっている

さー困った

いい方法ないかとonsenui.jsの中見たら・・・
setActiveCarouselItemIndex(index,options)となっている

options・・・?笑
よく見るとanimationとかも書いてある
えーつまり
http://ja.onsen.io/reference/ons-carousel.html
で紹介されていないパラメータがあるということ!

setActiveCarouselItemIndex(1,{animation:”none”})
とすると上手くいった

がしかし
setActiveCarouselItemIndexでanimationを消しても移動しているとみなされるため、
postchange()イベントが発生してしまっている

なのでsetActiveCarouselItemIndex(1,{animation:”none”})
の前にpostchange()イベントをオフして実行後に再度オンにするといったことをすると
予想通りの動きになった

ちなみに逆方向の場合は
追加はinsertBefore(画像A,hoge.firstChile)
削除はremoveChild(hoge.lastChild)
に変えるだけ

グダグダとメモ書き

Onsen UI ons-carouselで困ったこと(1)

環境はこちら

・画像をカルーセルに表示して次の画像、前の画像にスライドして移動する
という画面を作っていた

当初はテスト的に作っていたこともあって全ての画像をカルーセルに乗せて表示してたので、
まぁ画面遷移の際に準備でかなりの処理が走ってしまい、非常に遅い

という訳で、今表示している画像、次の画像、前の画像
この3つのみ用意することにした
画像サイズが割と大きいので画面上は常に3枚しか表示しない

やるべきことは
1.移動された時に移動された方向の奥に(先頭か最後)に新しく画像を追加する
2.移動された時に移動された方向とは反対の奥(先頭か最後)の画像を削除する

たったこれだけである
だがしかし、かなり手間取ったので要点だけメモする

今回用意するのは3枚だけなので
ons-carousel-item要素のインデックスというのは
0,1,2の3つの数字しか使わない
また、基本的に1が表示されていることになる
0|1|2
|(パイプ)が画面幅だと思っていただいて・・・笑

初期表示
インデックスは
0,1,2
である

右にスライド、1⇒2の方向に移動させたとする
postchange()で変更のイベントが発生する

この中でまず、新しく追加する画像Aを作成し、カルーセルに追加する(appendChild())
インデックスは
0,1,2,3
である

常に3枚なので
1枚消す必要がある
1⇒2の方向に移動したので0を消す(removeChild(hoge.firstChild))

インデックスは
1,2,3
である

カルーセルはここで更新する(refresh())
更新するとインデックスが
0,1,2
に戻る

ここで問題が発生する
中身まで見ていないのでここは予想だが、
カルーセルを移動した際に、
setActiveCarouselItemIndex(2)
のようなことをしているのだろう
今回新しく追加した画像が表示されているではないか!
01|2|
↑こんな状態

さぁどうする!
2に続く

月曜日と目覚ましと、時々cordova

ある月曜日ふと目を覚ますと9時30分(始業は10時からで9時50分から掃除)
やっば!

準備して、ご飯食べずに出たら50分ちょうどに着いた(セーフ!)

とまぁ月曜日弱い(というか休みの次の日?)
なぜか死んだように寝てるので起こされても認識してない笑

目覚ましかけろよ!って話なんだけど
目覚まし好きじゃないんだよなー

なぜか?
例えば8時半に目覚ましかけたとする
・休みの日にまで鳴るのはいじっかしい
・かといって毎日設定するのもめんどくさい

そして1番嫌いな理由
・たまたま起きててそれなのに鳴るのが嫌い

これ!
起きてるのに鳴って消すってのなんか嫌い笑

ということで、cordovaを使って自分用目覚まし作ろうと思ってる
仕様は
・曜日単位で鳴る日を設定出来る
・月のこの日とこの日と・・・って鳴る日を設定出来る(土曜出社の時とか祝日とか対応出来るからね!)
・スマホ使ってたら鳴らないようにする

もうあるし!って可能性もあるけどまぁそこはいいや
最後のがどうやったら出来るか、まだ分かってないけど
とりあえず作ってみようとしてる
鳴る瞬間に使っているかどうかってのはタイミング悪いと鳴っちゃうし
5分以内に使ってたらとかだと目は開けたけどめっちゃ眠くてスマホ使いながら寝る
とか時々あるから鳴って欲しいのに鳴らないってこともある
加速度センサーとか使う?
さーどうしようか
意見あればどんどん教えてください!

地獄少女&ガールズパンツァー

久しぶりに稼動してきたー!
出てからずっと打ちたかった地獄少女(パチスロ)が空いていたので着席!
3000円で当たったものの400枚ほど出したものの、全部ノマレ追加投資!

2000円(計5000円)で当たり・・・
20151116095828

ここまで伸びた\(^o^)/
ボーナス全然引けなかったけど、タイミングがよかったのか最高残り600Gとかなったおかげ!
スロブロガーでもないので、全然写真撮ってないのは気にしない!
この後追って当たってを繰り返し、最終的に交換したのは3500枚くらい

時間的にまだ余裕あったのでガールズパンツァーを打った(こちらも初打ち)
何かよー分からんまま7000円で1000枚出たのでOK笑
割と面白かったのでちょっと調べてまた打とうかな

地獄少女はもういいや笑
出る気がしない笑
評判見てる限り駆け抜け余裕だし純増詐欺だし・・・

結局12000投資の94400返しだったのでトータル82400勝ち!
パチ貯金が徐々に貯まって行くのはいいね!笑
タイヤとか買うから無くなるけど・・・
さー何に使おうかな!

OnsenUI ons-carouselとステータスバー

環境はこちら

自分のiPhone6 ios9.1で動作確認していると
A,B,Cというページが存在していて
A⇒Bに遷移するとなぜかBに配置してある画像の位置がおかしい
B⇒Cに遷移してpopPageする(Cを消す)とBに配置してある画像が正しい位置に表示されている

なんだこれは!

背景色つけて試してみると、なぜかons-toolbarにdivが重なっている(divが上に上がっている)ため、
画像がずれて表示されていることが判明
divの中身はons-crouselがあってその中にons-crousel-itemがあってpがあってimgがあってという状況

divのtopの値を取得するとA⇒Bの時点では42px、B⇒C⇒Bの時点では62pxと出た
20pxずれとる!

まず、Javascriptで何か変なことしていないか確認してみるということでjavascriptを読み込まないようにしたが、特に変わらず
こうなるとhtmlで悪さをしているに違いないので、ons-toolbarとdiv(背景色とサイズだけ指定)だけ配置して確認してみた
するとなぜかきれいに配置された(重なってない)
ということは消した中に犯人がいる!

1つずつ戻してみた
まぁタイトルにもあるように犯人はons-carouselなんだけど

ripple上では問題なく表示されていた(rippleはios6)ので
予想だけどずれた20pxはステータスバーと関わりがあるのではなかろうか…
詳しい原因はよく分かっていないが、Javascriptで動的にons-carouselを追加するように変更したら正しく配置された!
でも他の画面ではons-carousel使ってないのに同じ現象が・・・

動的に作ればOKなんだろうけど・・・
誰かもっといい解決方法教えてー!