コールアウト

メモでも、Safariでサイト閲覧時でも、文字列を選択した時に出現するメニューです。
その時に有効なメニューが表示されます。

オリジナル画像サイズ詳細

コールアウト特有かと思いますが、シャドウ部分のみの画像が存在します。
吹き出し部分を移動させるためでしょうね。

参考にしてください。

テーマ構成ファイル一覧　＆　オリジナル画像

テーマ名/UIImages/
	UICalloutBarArrowBottom@2x.png （48×34）
	UICalloutBarArrowBottomHi@2x.png （48×34）
	UICalloutBarArrowLeft@2x.png （52×76）
	UICalloutBarArrowLeftHi@2x.png （52×76）
	UICalloutBarArrowRight@2x.png （52×76）
	UICalloutBarArrowRightHi@2x.png （52×76）
	UICalloutBarArrowSingleLeft@2x.png （94×76）
	UICalloutBarArrowSingleLeftHi@2x.png （94×76）
	UICalloutBarArrowSingleRight@2x.png （94×76）
	UICalloutBarArrowSingleRightHi@2x.png （94×76）
	UICalloutBarArrowTop@2x.png （48×24）
	UICalloutBarArrowTopHi@2x.png （48×24）
	UICalloutBarBIU@2x.png （60×28）
	UICalloutBarCut@2x.png （4×76）
	UICalloutBarLeft@2x.png （42×76）
	UICalloutBarLeftHi@2x.png （42×76）
	UICalloutBarMiddle@2x.png （2×76）
	UICalloutBarMiddleHi@2x.png （2×76）
	UICalloutBarNextArrow@2x.png （26×28）
	UICalloutBarPreviousArrow@2x.png （26×28）
	UICalloutBarRight@2x.png （42×76）
	UICalloutBarRightHi@2x.png （42×76）
	UICalloutBarShadowLeft@2x.png （22×34）
	UICalloutBarShadowMiddle@2x.png （2×34）
	UICalloutBarShadowRight@2x.png （22×34）
	UICalloutBarSingle@2x.png （46×76）
	UICalloutBarSingleHi@2x.png （46×76）
	UICalloutBarSingleMatte@2x.png （46×76）
	UICalloutBarTextLtoR@2x.png （48×44）
	UICalloutBarTextRtoL@2x.png （48×44）
	UICalloutViewBackground@2x.png （2×114）
	UICalloutViewBottomAnchor@2x.png （82×140）
	UICalloutViewLeftCap@2x.png （34×114）
	UICalloutViewRightCap@2x.png （34×114）
	UICalloutViewTopAnchor@2x.png （82×140）

＜注意＞
ここで紹介しているファイル名や画像サイズは、Retinaディスプレイ用です。
iOS4.xの時と違い、iOS5に対応したwinterboardでは「@2xファイル」と「@2xを省いたファイル」をセットで用意する必要がなくなりました。
参考までにこちらをご覧下さい。ーー＞　artworkファイルについて

ページトップへ

作ってみた

基本色が「黒」のコールアウトですので、オリジナルデザインをそのままに、カラーバリエーションを増やしてみました。
＜注意＞
作った画像は、Retina用の画像のみで、iPhone4からの転載です。
そのままwinterboardで適用できるファイル構成にはしていますが、Retinaディスプレイではないデバイスで適用するときは、リサイズして下さい。
コールアウトタップ時の青色画像は触っていません。

boke_blue_callout.zipのダウンロード