【Custom】KLWPで制作 - なんちゃってL風ホーム画面と、左右で違う動きをするパーツ


とりあえずこの画面はこれでいいや。
次は別なの作ろう。



完成図。
ウィジェットは3種類。

左:WALKMANアイコンとコントローラー部分はZooper、その下のカレンダーはこれ
中:透明のZooperを置いてGoogle Nowと音声検索が起動するようにしています
右:これを設置

あと黄色いボタンは3画面とも透明なZooperを重ねています。タップするとNovaのドロワーが開きます。

左右で違う動き(に見える)パーツ




黄色いボタンのことです。

左のページを引き出した時は動かず、右のページを引き出した時はスライドしてくるように見せてみました。



作成したパーツは4つ。



ボタンアイコンは「Shape」を「Circle」にして、その上にテキスト「┼」を重ねています。
「+(プラス)」だと太さや長さが気に入らなかったので、「┼(罫線、けいせん)」の細い方を使いました。Googleの製品なんかでよく見る気がするんだけど、色を黒にして透過率を若干下げた感じの灰色(#80000000)にしています。




影のほうは「Shape」パーツの「FX」タブ、Shadowコマンドもあったんですがどうにもいい感じにならなかったので、全く同じ大きさで「Circle」を作ってFXを「Radial Gradient」に指定。これは内側から外側に向かって放射状にグラデーションをかけるものです。

で、ボタンパーツよりも上に並べることで背後に隠し、パディングを弄って少しだけボタンより下にずらします。

この組み合わせと全く同じものをもう1つ作っておきます。


2つ目のボタンは「ANIMATION」を追加します。1つ目は追加しないのでスクロールはされません。

アクションは「Scroll」、開始位置を「右側のページ(Screen 3)」とし、スピードを高めておきます。
こうすると中央の画面を表示している時はこのボタンは画面の右側の外に隠されており、右のページを引き出した時にスクロールされてくることになります。

最後にこれら4つのボタンパーツを、右側のページ用のパーツよりも上に配置すれば完成。
前回も書いた通りKLWPで作ったパーツは「下に置いたものが手前に来る」仕様となっているため、その背後に隠せます。
これで右の画面を引き出した時にだけ見えるボタンができます。スピードを高めたのは、他のパーツを追い抜いて表示させるためでもあります。


UIが全てライブ壁紙なので透明のウィジェットやショートカットを重ねるだけで簡単に整合性が取れます。グリッドの制限があって望む位置にショートカットを置きにくいNova Launcherを使っていますが、Zooperなどサイズを可変できるカスタムウィジェットと合わせればなんとかなります。
表示させる必要のあるウィジェット、カレンダーやRSSなどはまずそちらを置き、その幅・高さに合わせて壁紙を構築するようにしています。

そんな感じ。