底部工具欄與3圖像

Question

我有一個底部佈局與三個圖像。我希望他們平等分配。爲此，我使用layout_weight xml屬性。但他們的視覺表現是可怕的。

中的圖像尺寸爲32×32。

而對於這個特殊的工具欄我的佈局代碼：

<?xml version="1.0" encoding="utf-8"?> 

<android.support.v7.widget.Toolbar  
xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:id="@+id/toolbar_bottom" 
xmlns:appo="http://schemas.android.com/apk/res-auto" 
android:minHeight="50dp" 
android:background="#ffff8c0e" 
appo:theme="@style/ToolbarTheme" 
android:minWidth="50dp" 
android:elevation="10dp" 
> 
<LinearLayout 
    android:id="@+id/toolbarmenucontainer" 
    android:layout_width="match_parent" 
    android:weightSum="3" 
    android:layout_height="match_parent" 
    android:orientation="horizontal" > 

    <ImageView 
     android:layout_width="0dp" 
     android:id="@+id/camera_image" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:clickable="true" 

     android:scaleType="fitXY" 
     android:src="@drawable/camera_icon" 
     /> 

    <ImageView 
     android:id="@+id/news_image" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 

     android:clickable="true" 
     android:scaleType="fitXY" 
     android:layout_weight = "1" 
     android:src="@drawable/new_icon" 
     android:layout_alignParentTop="true" 
     android:layout_centerHorizontal="true" /> 
    <ImageView 
     android:id="@+id/facebook_image" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 

     android:clickable="true" 
     android:scaleType="fitXY" 
     android:src="@drawable/facebooc_image" 
     /> 
</LinearLayout> 

我怎樣才能讓他們好看嗎？ 謝謝，

西奧

Answer 1

包裝ImageView在另一個佈局說RelativeLayout。

也就是說做這樣的事情。

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:appo="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/toolbar_bottom" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="#ffff8c0e" 
    android:elevation="10dp" 
    android:minHeight="50dp" 
    android:minWidth="50dp" 
    appo:theme="@style/ToolbarTheme" > 

    <LinearLayout 
     xmlns:android="http://schemas.android.com/apk/res/android" 
     android:id="@+id/toolbarmenucontainer" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <RelativeLayout 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" > 

      <ImageView 
       android:id="@+id/camera_image" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_centerInParent="true" 
       android:clickable="true" 
       android:scaleType="fitXY" 
       android:src="@drawable/camera_icon" /> 
     </RelativeLayout> 

     <RelativeLayout 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" > 

      <ImageView 
       android:id="@+id/news_image" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentTop="true" 
       android:layout_centerInParent="true" 
       android:clickable="true" 
       android:scaleType="fitXY" 
       android:src="@drawable/new_icon" /> 
     </RelativeLayout> 

     <RelativeLayout 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" > 

      <ImageView 
       android:id="@+id/facebook_image" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_centerInParent="true" 
       android:clickable="true" 
       android:scaleType="fitXY" 
       android:src="@drawable/facebooc_image" /> 
     </RelativeLayout> 
    </LinearLayout> 
</android.support.v7.widget.Toolbar> 

希望這會有所幫助。

Answer 2

從您的代碼中刪除android:scaleType="fitXY"。因爲它所做的只是將位圖縮放到ImageView的大小。

請參閱此。

<LinearLayout 
     android:id="@+id/toolbarmenucontainer" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="horizontal" 
     android:weightSum="3"> 

     <ImageView 
      android:id="@+id/camera_image" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:clickable="true" 
      android:src="@mipmap/ic_launcher" /> 

     <ImageView 
      android:id="@+id/news_image" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:clickable="true" 
      android:src="@mipmap/ic_launcher" /> 

     <ImageView 
      android:id="@+id/facebook_image" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:clickable="true" 
      android:src="@mipmap/ic_launcher" /> 
    </LinearLayout> 

Answer 3

只需使用RelativeLayout的是這樣的：

<RelativeLayout android:layout_width="match_parent" 
android:layout_height="match_parent"> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:id="@+id/camera_image" 
     android:layout_height="wrap_content" 
     android:clickable="true" 
     android:src="@drawable/camera_icon" 
     android:scaleType="fitXY" 
     /> 

    <ImageView 
     android:id="@+id/news_image" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:clickable="true" 
     android:src="@drawable/new_icon" 
     android:scaleType="fitXY"/> 
    <ImageView 
     android:id="@+id/facebook_image" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:layout_alignParentRight="true" 
     android:clickable="true" 
     android:scaleType="fitXY" 
     android:src="@drawable/facebooc_image"/></RelativeLayout> 

Answer 4

設置你imageview的規模型，只要你想，有不同的選擇

android:scaleType="fitXY" 

或 center，centerCrop，centerInside，fitCenter etc

Answer 5

有這個不錯的library解決問題:)。它使用底部導航。