2017-08-12 194 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"  />