アイコンマスク
iPhoneのアプリを起動させるためにタップするのがアプリアイコンですが、そのアイコンはアプリ内に格納されており、アプリを作る際にアイコンも作らなければなりません。
最初からiPhone用に角丸のアイコンを作っても良いのですが、角張ったアイコンのままアプリをリリースしても、角丸で表示される仕組みをアップルは用意しています。
その仕組みの肝になるのが、このアイコンマスクです。
オリジナル画像サイズ詳細
角丸の半径は、27pxでした。
参考にしてください。
テーマ構成ファイル一覧 & オリジナル画像
テーマ名/Bundles/com.apple.mobileicons.framework/ | |
格納場所:/System/Library/PrivateFrameworks/MobileIcons.framework/ | |
AppIconMask@2x~iphone.png (120×120) |
|
iOS6までは、切り取るだけでなく、影や光沢を付ける画像もありましたが、iOS7のフラットデザインにより、マスク画像のみの単一構成となりました。
<注意>
くれぐれも、大文字と小文字の間違いに気をつけて下さい。
<追記>
バージョン変更などでアイコンが適用されなくなった場合は、「AppInfo」を参考にして、対応して下さい。
遊んでみた
これまでのiOSでは実現せずにiOS7でこそやろうと思っていたアイデアができなくなったため、新たに考えたアイデアが、アップルのiPhoneケースを模したものです。
あまり穴だらけにしても見にくくなってしまうのですが、かと言って少なすぎても「模している」と言えなくなってしまうため、ほどほどの穴数にしました。
穴空き画像によるテスト遊びです。
実際に画像を入れ替えて適用させたスクリーンショットです。
穴の向こうに背景画像が見えています。
このサンプル画像はこちら
ー> boke_applecover.zip
画像ファイルのパスは以下の通りです。
/System/Library/PrivateFrameworks/MobileIcons.framework/
バックアップを取ってからファイルを入れ替えましょう。
サンプルスクリーンショットのようになりましたでしょうか?
この手の変更をする場合、これまでのiOSでもよくあったのですが、キャッシュのおかげで、変更が反映されないことがあります。
そんな時は、キャッシュを削除します。
キャッシュの場所は、以下の通りです。
/var/mobile/Library/Caches/com.apple.IconsCache/
ここにある全ての(キャッシュ)ファイルを削除し、Respringか再起動します。
フォルダーごと削除しても良かったはずです。
再び現れたホーム画面では、変更が反映されていることでしょう。
遊んでみた2
Macを知っている方ならピンと来る方もいるかと思います。
かつてのモデルであるPowerMacG4を模してみました。
フォルダーの背景画像を変更した際に、アイコンも同じデザインにしたらどうかと思ったため、やってみました。
透過画像によるテスト遊びです。
実際に画像を入れ替えて適用させたスクリーンショットです。
リンゴ部分を浮かせるために、全体の透過率を0.8にしてあるので、少し暗くなっていますが、その分リンゴが見やすくなっています。
透過率が設定されていても、ベタ塗りの部分がきちんと表示されていることが分かります。
このサンプル画像はこちら
ー> boke_powermacg4_aim.zip
画像ファイルのパスは以下の通りです。
/System/Library/PrivateFrameworks/MobileIcons.framework/
バックアップを取ってからファイルを入れ替えましょう。
サンプルスクリーンショットのようになりましたでしょうか?
このサンプルも、変更が反映されない場合はキャッシュを削除します。
キャッシュの場所は、以下の通りです。
/var/mobile/Library/Caches/com.apple.IconsCache/
ここにある全ての(キャッシュ)ファイルを削除し、Respringか再起動します。
フォルダーごと削除しても良かったはずです。
再び現れたホーム画面では、変更が反映されていることでしょう。
遊んでみた
以上の標準アプリアイコンを入れ替えてみます。
「iPhone4」では、AKB48のメンバーの画像で遊びました。
「iOS5」では、ちょうど卒業記念ということでSDN48で遊びました。
今回は、前田敦子が抜け、グループ全体での大組閣もあることから、組閣前の画像でいくつか遊んでみようと思います。
数合わせのため、余ったアイコンは2ページ目に移動し、見た目を整えます。
今回は、ステータスバーの色もそれなりに変更してあります。ーーー>ステータスバー
文字の色も雰囲気を合わせるため弄りました。ーーー>Info.plist
サンプルテーマファイルは、画像にリンクを張ってありますので、サンプルを再現したい方はご希望の画像をクリックして下さい。
<注意>
ドック上のアイコンに影がありますが、アイコンマスク関連には手を出しておりませんので、「影が出ても仕方が無い」という認識でお願いします。
タップ時にも、同じ影が出ますのでご了承ください。
なお、画像は2012年10月23日時点に各サイトにあったものを使っております。
AKB48 チームA
1段空いたのでWAD24を表示しています
遊んでみた3
iOS4.xから考えていたことなのですが、やっと形にすることができました。
スクリーンショットを見ると、すべてのアイコンを透過させ、背景を最大限に表示させているかのように見えますが、違います。
アイコンの画像を、それぞれの場所にあたる背景画像と同じにしたのです。
ドックは消しましたが、アイコンシャドウなどは弄っていないので、アイコンの影を見て頂ければ、そこにアイコンがあることが分かるかと思います。
それがどうした?という感じですが、このスクリーンショットにあるアイコンの並び方と同じ並び方で使っている方は、何人くらいいらっしゃるのでしょうか?
ほとんどいないのではないでしょうか。
みなさんはすでにアイコンがシャッフルされた状態で使っているはずなので、このテーマを導入した段階で、もうエヴァパズルがスタートするのです。
このパズルは、その性質上、アイコンを移動させられます。
現在のアイコンの配置は、おそらく慣れた配置でお使いでしょうから、このパズルを試す前に、アイコンの配置情報をバックアップしておきましょう。
アイコンの配置情報ファイルは以下の通りです。
/var/mobile/Library/Springboard/IconState.plist
(/var/mobile/Library/Springboard/IconSupportState.plist)
アイコンを戻す時は、バックアップしたファイルをiPhoneに戻せば良いのですが、Respringを忘れないようにして下さい。
戻らなければ、手動で戻して下さい。
このサンプルを再現したい方はこちら
ー> boke_puzzle_evaのダウンロード
遊んでみた4
上にある「遊んでみた2」の続編です。
ネタとしてちょうど良かったので、遊んでみました。
YouTubeでかなり再生されたらしいですが、本人に再生はあるのでしょうか。
疑惑もかなりあるらしいですね。
このサンプルを再現したい方はこちら
ー> youtube_mmのダウンロード
当サイトの更新状況を、アラートで表示するかどうかの設定をします。
保存する