その他ステータスアイコン

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のダウンロード

ページトップへ

2012/01/14