DMC ステータス画面風ホーム画面を作ってみました。

DMC1のステータス画面ってちょっと配置を工夫すればディティールを崩さずスマホのホーム画面にできるんじゃない？とふと思い立って、実際に作ってみちゃいました。

目標は、デビルメイクライの雰囲気を壊さないようステータス画面を再現しつつ、それでいて出来る限り使い勝手を破綻させないこと！ …結果としては、好きにウィジェット等が置けない分やや利便性や拡張性に欠けるかもしれませんが、一応実用できる範囲内で出来たのではないかと思います。実用しないけど;

Devil May Cry Status HomeScreen

動画ではカクカクして見えますが、実際はもっと滑らかに動きます。

機種	Xperia acro HD SO-03D
Androidバージョン	4.0.4
ホームアプリ	Lightning Launcher
使用したアプリ	・LL – Multiple Wallpaper Plugin(マルチ壁紙) ・LLW Super Screen Switcher(スクリーン遷移) ・Glaeja(ウィジェット作成) ・SwitchPro Widget(各種設定トグルウィジェット)

 

【基本構成】

基本的なスクリーンは、Action画面がデフォルトのホームで、さらにサブ画面としてWeapon、そしてオプション画面の三画面構成です。 Action画面とWeapon画面は、左右のフリックで切り替えられるほか、上部メニューでも切り替える事ができます。オプション画面は”Action”から右フリックか”Weapon”で左フリック。

また、基本の三画面に加えて、アプリドロワー(アプリの一覧画面)とロックスクリーンも独自の壁紙を採用しています。アプリドロワーは上部メニューの”Item”から開きます。 ロックスクリーンはDMCのタイトル画面を、Action画面は実際のステータス画面の”Guns”画面を、Weapon画面は”Devil Arms”画面を、オプション画面はアラストル装備時のオプション画面をそれぞれ模しています。

 

【アプリやウィジェットの起動】

アプリやウィジェットは、Lightning Launcher標準のフォルダ機能を使っています（メニューによっては、フォルダを介さず直接起動するアプリもあり。カメラ・ギャラリー・電話など）。 フォルダの中には好きなアプリやウィジェットを入れる事ができますが、一応上の画像で使っているウィジェットを紹介すると、音楽プレーヤーはPoweramp、天気予報はEye In Skyというアプリです。

また、上部メニューの”Map”をタップすると地図アプリ(Googleマップ)が、”File”をクリックするとファイラー(Solid Explorer)が開くようにしてあります。

 

【オリジナルウィジェット】

メインスクリーンの背景のダンテは、右上の”File”の下あたりにあるⅠⅡⅢボタンで切り替えることができます。 実はこの待ち受け画面は、本体に設定した壁紙ではなく、ディスプレイとピッタリ同じサイズに調整した特大ウィジェットです。 これはGlaejaというウィジェット作成アプリを使用して作成しています。ⅠⅡⅢボタンを押すことでウィジェット変数の数値を切り替え、それを画像のパスに代入して、あたかも壁紙が切り替わっているかのように見せています。

レッドオーブ数・体力ゲージ・DTゲージの部分もGlaejaで作成したウィジェットです。レッドオーブ数は月日時間、体力ゲージは電池残量、DTゲージはメモリ使用率を表しています。 体力ゲージは100%～51%はグリーン、50%～26％はオレンジ、25％以下になると瀕死のレッドに切り替わります(25%以下は枠の色も赤くなります)。こってるでしょ？ｗ

仕組みはそんなに難しくはなくて、体力ゲージは電池残量のパーセンテージをバーのスプライト画像のX座標に(適切な数値に計算・整形しつつ)代入して、数値が減るごとに左にずれていくようにしています。そして、枠の外にはみ出さないようにマスクをかければ、電池が減るごとにバーが短くなっていっているように見えます。バーがグリーンの時でも、その裏でオレンジ・レッドのバーも同時に動いており、ある一定の数値に達した時(この場合50以下)に手前のグリーンバーの透過度を0にし、後ろのオレンジ（とその裏にレッド）が現れるようにしています。このへんは色々やりようがあると思いますが、バーを画像にしなければもっと単純な構造で実現できるはずです。

DTゲージの場合は、ゲージそのものを動かしては文字がずれていってしまうので、上記の方法ではなくマスクに使うレイヤー(画像)自体が左右に動くようにしています。

Glaejaについては、興味のある方は製作者さんのサイトに詳しい説明があるので是非読んでみてください。
→ BANANAWANI MICOM. CULB: [Android] Glaeja (ver.4.x)
私自身は今回作るにあたって必要な範囲を勉強した程度ですので理解していない部分が多いです。

いかがでしたでしょうか？もうちょっとこだわりたかった部分もないことはないですが、実際のゲーム画面の雰囲気になかなか近いものができたんじゃないかな？と思っています。

今回作ったホームスクリーンは常用はしませんがいつでもリストアできるようにバックアップしておくので、 「ここをこうしたらもっと良いんじゃないか」「こんな機能があったら面白そう」などなどありましたらコメント頂けると嬉しいです。
※ウィジェット下さい、やテーマ・画像を配布してください、はご勘弁願いますm(_ _)m

最後におまけ。今回のDMCステータス画面風ホーム画面を作る前に作ったホーム画面です。