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);
}

我想在Drawer中添加一个图像，它应该覆盖抽屉头的整个区域。我想知道图像（分辨率）的大小应该是多少;适用于各种屏幕分辨率的手机。如何最小化照片尺寸？

此屏幕截图中，标题图片未覆盖抽屉的整个区域

Answer 1

我最近制作了一个应用程序并对几乎所有材料设计方面进行了彻底的研究，所以我想在这里分享我的经验，它可能对你有所帮助。

首先浏览this精彩文章，它将指导您使用随之使用的每个属性和视图设置Nav Drawer。

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

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

我使用宽度为304dp的导航抽屉（大多数情况下你会在谷歌应用上找到它，但他们也在某些应用上使用了320dp，如播放音乐，环聊等）。

除了平板电脑之外，几乎所有设备的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 2

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

Answer 3

标题视图高度的经验法则是

HeaderHeight = NavDrawerWidth * 9/16。

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

Answer 4

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

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);
                        }
                    }
                });
            }
        });

Drawer Header Image的大小应该是多少？

4 个答案: