底部工具栏与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解决问题:)。它使用底部导航。