最近のアクセス：
パネルの画像

画像の使用は、魅力的で使いやすいアプリケーションにするための基本です。Panel オブジェクトで使用する画像にはいくつかのタイプがあります。それぞれに異なる目的があります。
魅力的なだけでなく、Google Play (Android)、Apple Store など、すべてのマーケットで認められるアプリケーションにするために考慮すべき多くの設計リソースがあります。たとえば、ある単一の画像について、iPhone で求められるサイズと iPad でのサイズは異なります。これは、すべてのデバイスおよび形式で起こることです。横長の形式の画像は、縦長の画像とは異なります。
ここでは、このタイプのアプリケーションで使用される画像と、その画像を設計する際に留意する点について記載しています。

画像のタイプ

アプリケーションアイコン

これは、デバイスにインストールされたアプリケーションを識別するための画像です。
例:
イメージ:16639.png

検討事項

  • Apple の場合、透過にしてはいけません。角丸の正方形にデザインされたアイコンがデバイス上に自動的に表示されます。
  • Android では、透過についてはどちらでもかまいません。
GeneXus では、すべてのこれらの画像はナレッジベースの Image オブジェクトにロードされる必要があります。各プラットフォームにどの画像を定義するかは、テーマまたは密度によって異なります。たとえば、 [ Application Icon ] プロパティのすべてのアイコンを含む Image オブジェクトを設定することも、そのオブジェクトのアイコンのみを変更することもできます。
イメージ:32831.png
  iOS デバイス iPhone 6 Plus (@3x) iPhone 6 および iPhone 5 (@2x) iPhone 4s (@2x) iPad および iPad mini (@2x) iPad 2 および iPad mini (@1x)
  アプリアイコン 180x180 120x120 120x120 152x152 76x76
  App Store のアプリアイコン 1024x1024 (*)
  Spotlight 検索結果アイコン 120x120 80x80 80x80 80x80 40x40
  設定アイコン 87x87 58x58 58x58 58x58 29x29
  ツールバーおよびナビゲーション バー アイコン (オプション) 66x66 44x44 44x44 44x44 22x22
(*) GeneXus 15 Upgrade 7 以降では、 [ Apple Application Icon ] プロパティで 1024x1024 解像度の画像を 1 つ指定すると、それより小さいほかの画像が自動的に生成されます。
  Android デバイス ldpi mdpi hdpi xhdpi xxhdpi xxxhdpi
  アプリケーションアイコン 36x36 (120dpi) 48x48 (160dpi) 72x72 (240dpi) 96x96 (320dpi) 144x144 (480dpi) 192x192 (640dpi)

詳細については、「[ Density ] プロパティ」を参照してください。
デバイスごとのオフィシャルガイド:

起動画像

これは、アプリケーションのロード処理中に表示される画像です。
例:
イメージ:16633.png
  iOS デバイス 横長 縦長
  iPhone - iPod 480 x 320 320 x 480
  iPhone Retina 960 x 640 640 x 960
  iPhone 5 Retina 1136 x 640 640 x 1136
  iPhone 6 Retina 1334 x 750 750 x 1334
  iPhone 6 Plus Retina 2208 x1242 1242 x 2208
  iPad 1024 x 768 768 x 1024
  iPad Retina 2048 x 1536 1536 x 2048
  Android デバイス 横長 縦長
  ldpi 320 x 200 200 x 320
  mdpi 480 x 320 320 x 480
  hdpi 800 x 480 480 x 800
  xhdpi 1280 x 720 720 x 1280
  xxhdpi 1600 x 960 960 x 1600
  xxxhdpi 1920 x 1280 1280 x 1920

通知アイコン

これは、アプリケーションが通知を受信した場合にステータスバーに表示される画像です。
例:
イメージ:31383.png
考慮事項
  • Android デバイス (横長および縦長) にのみ適用されます。
  • 完全に白の画像を使用する必要があります (オプションとして透過も使用可能)。背景色は、アプリケーションのテーマクラスの [ Primary Color ] プロパティから取得されます。
  • サイズは 24x24 dp にする必要があります。
  mdpi hdpi xhdpi xxhdpi xxxhdpi
通知アイコン 24 px (枠を除くと 22 ピクセル) 36 px 48 px 72 px 96 px
Roman Nurik による Android Asset Studio ツールが有用かもしれません。

iPad の分割モードの背景画像

ナビゲーションスタイルが分割モードの iPad で実行するアプリケーションの場合のみです。アプリケーションのロード中に右側に表示されます。
使用例:
イメージ:16634.png
考慮事項
  • iPad (横長および縦長) にのみ適用されます。さまざまな形式用に、異なるサイズの画像を作成する必要があります。
    サイズ (ピクセル)
  iPad 横長 703 x 704
  iPad 縦長 768 x 960
  iPad Retina 横長 1406 x 1408
  iPad Retina 縦長 1536 x 1920

タブアイコン

このアイコンは、 [ Control ] プロパティの値が Tabs の場合、メインの Menu オブジェクトのアイテムで使用されます。
例:
イメージ:16635.png

考慮事項

  • 拡張子は *.png で、透過 (アルファチャネルが 1 以外) である必要があります。
    タブを選択すると、未選択のタブでの表示と異なり、透過の表示が自動的に有効になります。
    1x 2x 3x
  iOS
 25x25 最小
48x32 最大
 50x50 最小
96x64 最大
 75x75 最小
144x96 最大
  Android
 48x48 (hdpi)
 -
 -
  • iOS フレームワークがアクションおよびタブ用の標準アイコンとして提供する画像があります。
    詳しくは、こちらを参照してください。

マーケット用アイコン

これは、マーケット (Google Play (Android)、Apple App Store (iOS)) でアプリケーションを表す画像です。
見つかると、リストおよび詳細に表示されます。
この画像は GeneXus で設定されません。代わりに、各マーケットへのアプリケーションのアップロード時にロードされます。
使用例:
イメージ:16636.png
各ストアにアップロードする必要がある、必須の画像があります。
場合によっては、ほかの必須でない画像があります (たとえば、アプリケーションがハイライトセクションに表示される場合に表示する Android のプロモーション画像)。
また、通常は必須のスクリーンショット画像もあります。
Android の検討事項 - play.google.com

メニューオプション用の画像

Menu オブジェクトの各オブション (アイテム) に関連付けられた画像です。各メニューオプションの [ Image ] プロパティで設定されます。

考慮事項

  • 実行時に、これらの画像は iPhone および iPad では 86 x 86 サイズに、Android では 96 x 96 に調整されます。そのため、使用される画像が小さい場合、前述のサイズに調整するために "拡大" されます。

iPhone/iPad Retina について

iPhone 4、第 3 世代 iPad、およびそれ以降のモデルには、「Retina ディスプレイ」と呼ばれるディスプレイが備わっており、同じ画面サイズでより高い解像度を提供します。Retina ディスプレイの解像度は、以前のモデルのディスプレイと比較して 2 倍の幅と高さです。iPhone の場合、解像度は 320 x 480 なのに対して、iPhone Retina では、解像度は 640 x 960 です (2 倍の幅と 2 倍の高さ)。iPad は以前のモデルでは 768 x 1024 で、Retina iPad モデルでは 1536 x 2048 です。
GeneXus は、使用するすべての画像をコピーして、デバイスに最適なものを検索します。Retina ディスプレイのデバイスでは、同じ名前で接尾語 "_2x" の画像を検索します。見つかった場合、それが使用されます。見つからなかった場合、元の画像が使用され、画面と同じスペースに合うように拡大縮小 (回転) されます。

Android について

次の表は、サイズと密度の観点から Android アプリケーションの画像を作成する設計者に役立つ場合があります。
MDPI をベースラインとして使用し、さまざまなサイズと密度に対応するように画像を拡大または縮小することを強くお勧めします。
  MDPI
(ベースライン)		 HDPI XHDPI XXHDPI XXXHDPI
倍率 1 x 1.5 x 2 x 3 x 4 x
DPI 160 dpi 240 dpi 320 dpi 480 dpi 640 dpi
アプリケーションのランチャーアイコン 48 px 72 px 96 px 144 px 192 px
アクション バー アイコン 32 px (枠を除くと 24 ピクセル) 48 px 64 px 96 px 128 px
小さいアイコン/コンテキストアイコン 16 px (枠を除くと 12 ピクセル) 24 px 32 px 48 px 64 px
通知アイコン 24 px (枠を除くと 22 ピクセル) 36 px 48 px 72 px 96 px

オンライン上の無料のリソース

アプリケーションアイコンやメニューオプション用などの画像は、Glyphish、IconFinder、および MaterialIcons で入手できます。

正しい設定を使用して小さなアイコンをすばやく簡単に生成するには、Android Asset Studio が便利です。

動画

イメージ:20668.png Prototyping features and Deployment of applications for Smart Devices



サブページ
Created: 17/05/30 23:04 by Admin Last update: 22/04/05 18:18 by Admin
カテゴリ
Powered by GXwiki 3.0