その他ステータスアイコン
iPhoneのステータスバーには、状態を示すいろいろなアイコンが表示されます。
普段いつも目にするものから、一度も見たこともないものまでいろいろ用意されています。
オリジナル画像サイズ詳細
ステータスバーに表示されるアイコンの一番の特徴は、横は幅いっぱいで、縦は十分に余白を取っているところですね。
自作する場合は、このサイズに沿った方が良さそうです。
縦いっぱいに作ると、表示はされますがバランスが崩れます。
横幅をはみ出すと、表示はされても隣のアイコンが消えると思って下さい。
テーマ構成ファイル一覧 & オリジナル画像
テーマ名/UIImages/ | ||
明色背景用: |
ColorOnGrayShadow_Airplane@2x.png 機内モード(32×40) |
|
ColorOnGrayShadow_Alarm@2x.png アラーム(20×40) |
|
|
ColorOnGrayShadow_Bluetooth@2x.png Bluetooth(22×40) |
|
|
ColorOnGrayShadow_BluetoothConnected@2x.png Bluetooth接続時(22×40) |
|
|
ColorOnGrayShadow_CallForward@2x.png (24×40) |
|
|
ColorOnGrayShadow_CARRIER_IPOD@2x.png iPodのキャリア画像(50×40) |
|
|
ColorOnGrayShadow_DataTypeEDGE@2x.png (12×40) |
|
|
ColorOnGrayShadow_DataTypeGPRS@2x.png (14×40) |
|
|
ColorOnGrayShadow_DataTypeiOSHotspot@2x.png (34×40) |
|
|
ColorOnGrayShadow_DataTypeUMTS@2x.png (30×40) |
|
|
ColorOnGrayShadow_HeadsetBatteryBG@2x.png (38×40) |
|
|
ColorOnGrayShadow_HeadsetBatteryFill@2x.png (2×40) |
|
|
ColorOnGrayShadow_HeadsetLowBatteryFill@2x.png (2×40) |
|
|
ColorOnGrayShadow_Location@2x.png 位置情報サービス(26×40) |
|
|
ColorOnGrayShadow_Play@2x.png 再生中(20×40) |
|
|
ColorOnGrayShadow_Plus@2x.png (20×40) |
|
|
ColorOnGrayShadow_RotationLock@2x.png 画面の回転をロック(40×40) |
|
|
ColorOnGrayShadow_TTY@2x.png (22×40) |
|
|
ColorOnGrayShadow_VPN@2x.png (40×40) |
|
|
暗色背景用: |
WhiteOnBlackEtch_Airplane@2x.png 機内モード(32×40) |
|
WhiteOnBlackEtch_AirPlay@2x.png アラーム(32×40) |
|
|
WhiteOnBlackEtch_Alarm@2x.png アラーム(20×40) |
|
|
WhiteOnBlackEtch_Bluetooth@2x.png Bluetooth(22×40) |
|
|
WhiteOnBlackEtch_BluetoothConnected@2x.png Bluetooth接続時(22×40) |
|
|
WhiteOnBlackEtch_CallForward@2x.png (24×40) |
|
|
WhiteOnBlackEtch_CARRIER_IPOD@2x.png iPodのキャリア画像(50×40) |
|
|
WhiteOnBlackEtch_DataTypeEDGE@2x.png (12×40) |
|
|
WhiteOnBlackEtch_DataTypeGPRS@2x.png (14×40) |
|
|
WhiteOnBlackEtch_DataTypeiOSHotspot@2x.png (34×40) |
|
|
WhiteOnBlackEtch_DataTypeUMTS@2x.png (30×40) |
|
|
WhiteOnBlackEtch_HeadsetBatteryBG@2x.png (38×40) |
|
|
WhiteOnBlackEtch_Location@2x.png 位置情報サービス(26×40) |
|
|
WhiteOnBlackEtch_Lock@2x.png ロック中・・・(20×40) |
|
|
WhiteOnBlackEtch_Play@2x.png 再生中(20×40) |
|
|
WhiteOnBlackEtch_Plus@2x.png (20×40) |
|
|
WhiteOnBlackEtch_RotationLock@2x.png 画面の回転をロック(40×40) |
|
|
WhiteOnBlackEtch_TTY@2x.png (22×40) |
|
|
WhiteOnBlackEtch_VPN@2x.png (40×40) |
|
|
通知背景用: |
WhiteOnBlackShadow_Airplane@2x.png 機内モード(36×40) |
|
WhiteOnBlackShadow_AirPlay@2x.png アラーム(36×40) |
|
|
WhiteOnBlackShadow_Alarm@2x.png アラーム(24×40) |
|
|
WhiteOnBlackShadow_Bluetooth@2x.png Bluetooth(26×40) |
|
|
WhiteOnBlackShadow_BluetoothConnected@2x.png Bluetooth接続時(26×40) |
|
|
WhiteOnBlackShadow_CallForward@2x.png (27×40) |
|
|
WhiteOnBlackShadow_CARRIER_IPOD@2x.png iPodのキャリア画像(54×40) |
|
|
WhiteOnBlackShadow_DataTypeEDGE@2x.png (16×40) |
|
|
WhiteOnBlackShadow_DataTypeGPRS@2x.png (18×40) |
|
|
WhiteOnBlackShadow_DataTypeiOSHotspot@2x.png (38×40) |
|
|
WhiteOnBlackShadow_DataTypeUMTS@2x.png (34×40) |
|
|
WhiteOnBlackShadow_HeadsetBatteryBG@2x.png (42×40) |
|
|
WhiteOnBlackShadow_Location@2x.png 位置情報サービス(30×40) |
|
|
WhiteOnBlackShadow_Lock@2x.png ロック中・・・(24×40) |
|
|
WhiteOnBlackShadow_Play@2x.png 再生中(24×40) |
|
|
WhiteOnBlackShadow_Plus@2x.png (24×40) |
|
|
WhiteOnBlackShadow_RotationLock@2x.png 画面の回転をロック(44×40) |
|
|
WhiteOnBlackShadow_TTY@2x.png (26×40) |
|
|
WhiteOnBlackShadow_VPN@2x.png (44×40) |
|
<注意>
通知センター用の画像が、他の画像と比べて、幅がすべて4px広くなっています。
このため、通知センターでのステータスバーの表示が左右にズレます。
<注意>
ここで紹介しているファイル名や画像サイズは、Retinaディスプレイ用です。
iOS4.xの時と違い、iOS5に対応したwinterboardでは「@2xファイル」と「@2xを省いたファイル」をセットで用意する必要がなくなりました。
参考までにこちらをご覧下さい。ーー> artworkファイルについて
遊んでみた
これもアイデアがなく、画像の入れ替えができるかどうかの確認だけになります。
だからと言って、遊び心を忘れてはいけないので、アラームアイコンを目覚まし時計にしました。
随分クラッシックな目覚まし時計ですが、あえてこのデザインで作ってみました。
初めは「3G」を、「3爺」で作ったのですが、嫁さんに却下されました。
でもせっかく作ったので、ダウンロード用には入れておきます。
スクリーンショットです。
やはり、「3爺」は駄作ですね・・・
僅かな数の明色用しかありませんが、今回のテストテーマをこちらで配布しています。
boke_status_iconsのダウンロード
遊んでみた2
ステータスバーに表示されるアイコンなのですが、ロック画面のみで表示されるアイコンです。
ロック画面のステータスバーには時計表示がなく、その場所にこのロックアイコンが表示されます。そのため、このアイコンの横にはかなりの余白が出現します。
という訳で、今回はオーバーサイズで遊んでみます。
中途半端なオーバーサイズでは意味がないので、いきなりMax幅の640pxで試してみましょう。
オリジナル画像を中央に残し、全体の画像幅を640pxにした透過画像を用意しました。
これだけ???
透過画像だからと思って640pxの画像にしたのですが、他の画像を退けてまで自己主張しているんですね。
どうやら、ステータスバーのアイコンは他の画像と重ならないようです。
まぁ、これはこれで良いのかもしれませんね。
boke_status_lockのダウンロード
基本的には、オリジナルを尊重するのですが、ロック中であることを文字で表したものも作ってみました。
特にひねることなく、160pxの画像を用意しました。
こんな感じです。
やはりシンプルなオリジナルが一番ですかね?
boke_status_lock2のダウンロード
現在、2011年7月24日 午後5時
アナログで27時間テレビ観ながら作成しています。
テレビで歴史的な瞬間と言っていたのに、何だか拍子抜けしています・・・
作ってみた
オリジナルデザインをそのままに、カラーバリエーションを増やしてみました。
<注意>
作った画像は、明色用かつRetina用の画像のみです。
そのままwinterboardで適用できるファイル構成にはしていますが、Retinaディスプレイではないデバイスで適用するときは、リサイズして下さい。
boke_blue_statusicons.zipのダウンロード
boke_brown_statusicons.zipのダウンロード
boke_green_statusicons.zipのダウンロード
boke_lightblue_statusicons.zipのダウンロード
boke_orange_statusicons.zipのダウンロード
boke_pink_statusicons.zipのダウンロード
boke_red_statusicons.zipのダウンロード
boke_violet_statusicons.zipのダウンロード