抽屉 Header 图片的尺寸应该是多少？

Question

 public DrawerProfile(Context context) {
        super(context);
        HeaderImageView = new ImageView(context);
        HeaderImageView.setVisibility(VISIBLE);
        HeaderImageView.setScaleType(ImageView.ScaleType.CENTER);
        HeaderImageView.setImageResource(R.mipmap.drawer_background_image);
        addView(HeaderImageView);
}

我想在抽屉中添加一张图片，它应该覆盖抽屉的整个区域header。我想知道图像（分辨率）的大小应该是多少；这将适用于具有各种屏幕分辨率的每个 phone。如何将照片的尺寸缩小？

在此屏幕截图中，header 图像未覆盖抽屉的整个区域

Answer 1

鉴于 HeaderImageView 设置为匹配抽屉的宽度和高度，只需将 ScaleType 设置为 FIT_CENTER 然后您的图像将缩放以填充整个抽屉。

Answer 2

header 视图高度的经验法则是

HeaderHeight = NavDrawerWidth * 9/16。

所以基本上它在 140 到 169dp 之间。

在不同的屏幕上使用不同的尺寸文件以获得最佳效果

hdpi - 高度 = 170dp xhdpi - 高度 = 180dp

Answer 3

我最近做了一个应用程序，并且对几乎每个Material设计方面都进行了深入研究，所以我想在这里分享我的经验，它可能会对你有所帮助。

第 1 篇阅读 this 精彩文章，它将指导您设置导航抽屉以及每个属性和使用它的视图。

抽屉图像应该或通常是导航抽屉宽度的 16/9。 ( HeaderHeight = NavDrawerWidth * 9/16 )

我使用了一张 576x324 像素的图像（非常干净漂亮的图片，将近 27KB）并将其放在 drawable-nodpi 中以避免自动缩放和内存问题。

我使用宽度为 304dp 的导航抽屉（大多数情况下，您会在 google 应用程序上找到它，但他们也在某些应用程序上使用了 320dp，例如 Play Music、Hangouts 等）。

对于除平板电脑之外的几乎所有设备，HeaderImage 的高度可能保持不变。

对于 sw-480dp-xxxhdpi 之前的设备，使用抽屉宽度 304dp 和页眉高度 170dp。

对于以上设备 sw-600dp，至少使用抽屉宽度 400dp 和页眉图像高度 225dp。

这是我的drawer_header.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/navDrawer_header_height"
    android:background="@drawable/img_navdrawer_header"
    android:gravity="bottom"
    android:orientation="vertical"
    android:padding="16dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark" >    
</LinearLayout>

这就是我在里面使用它的方式NavigationView

  <android.support.design.widget.NavigationView
    android:id="@+id/navigation_view"
    android:layout_width="@dimen/nav_drawer_width"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:headerLayout="@layout/drawer_header"
    app:menu="@menu/drawer" />

现在是设定界限的时候了，/res/values/dimens/

<dimen name="nav_drawer_width">304dp</dimen>
<dimen name="navDrawer_header_height">170dp</dimen>

对于平板电脑：/res/values-sw600dp/、/res/values/sw-720dp

<dimen name="nav_drawer_width">400dp</dimen>
<dimen name="navDrawer_header_height">225dp</dimen>

希望这对某人有所帮助。

Answer 4

使用下面的代码将图像加载到导航抽屉中的相对或线性布局中 Header

RelativeLayout imgNavHeaderBg = navHeader.findViewById(R.id.headerRelativelayout);

imgNavHeaderBg.post(new Runnable(){
            public void run(){
                Glide.with("Your Class".this).load("URL").asBitmap().into(new SimpleTarget<Bitmap>(imgNavHeaderBg.getMeasuredWidth(), imgNavHeaderBg.getMeasuredHeight()) {
                    @Override
                    public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
                        Drawable drawable = new BitmapDrawable(getResources(), resource);
                        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                            imgNavHeaderBg.setBackground(drawable);
                        }
                    }
                });
            }
        });

Answer 5

我将这个库用于维度

https://github.com/intuit/sdp

并将header高亮显示为@dimen/_180sdp。

所以 180 dp 是 header

的大小

看起来很完美！

抽屉 Header 图片的尺寸应该是多少？

what should be the size of Drawer Header Image?

android

android-layout

image-size

navigation-drawer

drawerlayout