2017-08-12 195 views
-2

我尝试创建一个Navigation Drawer。我想在Navigation Drawer的标题中使用我的图片。导航抽屉标题图片

当我使用我的jpg图像并打开Navigation Drawer时,它打开得非常慢并且工作不正常。我也希望我的图像应该像在Gmail应用程序中一样显示为圆形。我已将我的jpeg图像放在500kb大小的drawable文件夹中。

可以做些什么来解决这个问题?

header.xml

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="190dp"> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerInParent="true" 
     android:id="@+id/headerImage" 
     android:scaleType="centerCrop" 
     android:src="@drawable/avina"/> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/headerImage" 
     android:id="@+id/headertext" 
     android:text="Avinash" 
     android:textSize="20sp"/> 
</RelativeLayout> 

回答

1

创建header_layout。您可以使用此库来创建圆形图像。

compile 'de.hdodenhof:circleimageview:2.1.0' 

现在你的布局结构是这样:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="304dp" 
android:layout_height="172dp" 
android:orientation="vertical"> 

<de.hdodenhof.circleimageview.CircleImageView 
    android:id="@+id/circularImageId" 
    android:layout_width="64dp" 
    android:layout_height="64dp" 
    android:layout_marginStart="16dp" 
    android:layout_marginTop="40dp" 
    android:src="@drawable/taplejung_nepal" /> 

<TextView 
    android:id="@+id/loginTextId" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginBottom="16dp" 
    android:layout_marginStart="16dp" 
    android:layout_marginTop="20dp" 
    android:fontFamily="sans-serif" 
    android:text="@string/log_in" 
    android:textColor="@color/colorWhite" 
    android:textSize="14sp" 
    android:textStyle="bold" /> 
</LinearLayout> 

您可以inflate此布局。我假设你的抽屉布局文件中有NavigationView

NavigationView navigationView = (NavigationView) findViewById(R.id.navigationViewId); 

View headerView = navigationView.inflateHeaderView(R.layout.nav_header); 
CircleImageView drawerHeaderImage = (CircleImageView) headerView.findViewById(R.id.circularImageId); 
TextView user = (TextView) headerView.findViewById(R.id.loginTextId); 
+1

这对我来说..thankyou工作 –

0

您的图片大小应该是非常小的,像120 x 120 px是绰绰有余作为NavDrawer头图像。 并使其循环按照以下步骤

添加以下命令build.gradle依赖

compile 'com.mikhaellopez:circularimageview:3.0.2' 

构建Application和添加的CircularImageView代替ImageView

<com.mikhaellopez.circularimageview.CircularImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerInParent="true" 
     android:id="@+id/headerImage" 
     android:scaleType="centerCrop" 
     android:src="@drawable/avina" 
     app:civ_border_color="#EEEEEE" 
     app:civ_border_width="4dp" 
     app:civ_shadow="true" 
     app:civ_shadow_radius="10" 
     app:civ_shadow_color="#8BC34A"/> 
+0

它示值误差E:\ AndroidProject \阿维纳什\程序\ SRC \主\水库\布局\ header.xml 错误:(6)错误解析XML:绑定前缀 –

0

在你的gradle中使用下面的库;

“编译 'de.hdodenhof:circleimageview:1.3.0'

然后加载您的ImageView在XML中;

<de.hdodenhof.circleimageview.CircleImageView 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/profile_image" 
    android:layout_width="120dp" 
    android:layout_height="120dp" 
    android:layout_centerHorizontal="true" 
    android:layout_centerVertical="true" 
    android:src="@drawable/your_picture"  />