web-dev-qa-db-ja.com

ナビゲーションドロワーヘッダーの背景画像のサイズ

基本的に、私はジョナサン・リー氏がグーグルの公式リンクのナビゲーションドロワーヘッダーの背景に使用した背景が好きでした http://www.google.com/design/spec/patterns/navigation-drawer.html#navigation-drawer -コンテンツ

だから、それに触発された似たようなものを再現したかったのです。フォトショップでも同様のデザインを作り、背景画像として設定する必要があると思います。しかし、問題は、さまざまな種類のデバイスに一致するように、寸法とピクセルをどのようにする必要があるかということです。

上記のリンクにはアイコンと余白のガイドラインがありますが、その背景について言及されている寸法は見ていません。

誰かが助けることができるアイデアやリンクを持っていますか？

androidgraphicsnavigation-drawermaterial-design
13
abdfahim

幅は：

モバイル：

幅=画面幅-56dp

最大幅：320dp

最大幅は、左側のサイドナビゲーションを使用する場合にのみ適用されます。右側のパネルを使用する場合、パネルは画面の全幅をカバーできます。

http://www.google.com/design/spec/layout/structure.html#structure-side-nav

高さは、必要な画像のアスペクト比によって決まります。

http://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-ratio-keylines

おそらく16：9

5
FunkTheMonk

APKを解凍しました。これが私が見つけたものです-

 mdpi-
幅= 384ピクセル
高さ= 216ピクセル
 hdpi-
幅= 576ピクセル
高さ= 324ピクセル
 xhdpi-
幅= 768ピクセル
高さ= 432ピクセル
 xxhdpi-
幅= 1152ピクセル
高さ= 648ピクセル

画像ソース= Googleのニューススタンドアプリケーション、ツール= Adob​​e photoshop 7.0

25
Angad Singh

アドビのイラストレーターを使用することをお勧めします。UIデザインでうまく機能するからです。ほとんどのモバイルデバイス/タブレットの幅は320pxから最大1080pxの範囲で、新しい電話/タブレットがリリースされるにつれてさらに増加し​​ます。スケーラブルベクターグラフィックスは、UIレイアウトのプロトタイピングに最適です。

チェックアウト： http://www.uxbooth.com/articles/considerations-for-mobile-design-part-2-dimensions/

2
KpTheConstructor