Растянутые изображения в LinearLayout

Question

Я пытаюсь добавить 6 изображений в качестве ImageButtons, но эти изображения вертикально растянуты. Смотрите рисунок ниже:

Как вы можете видеть на картинке всех imagebutons вертикально вытянутые. Я поместил их в drawable-xxxhdpi. Разрешение каждого изображения составляет 512x512. Я также попытался поместить их в mipmap-xxxhdpi или xxhdpi, но без разницы. Вот мой код:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:background="#DCDCDC" 
tools:context="MainActivity"> 

<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentTop="true"> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" /> 
</LinearLayout> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_alignParentBottom="true" 
    android:layout_marginBottom="15dp" 
    android:orientation="vertical"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" 
     android:weightSum="3.4"> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 

     <ImageButton 
      android:id="@+id/radio_channel_1" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:background="@drawable/background_radio_channel_one" 
      android:scaleType="fitXY" /> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 

     <ImageButton 
      android:id="@+id/radio_channel_2" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:background="@drawable/background_radio_channel_two" 
      android:scaleType="fitXY" /> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 

     <ImageButton 
      android:id="@+id/radio_channel_3" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:background="@drawable/background_radio_channel_three" 
      android:scaleType="fitXY" /> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 
    </LinearLayout> 


    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginTop="10dp" 
     android:orientation="horizontal" 
     android:weightSum="3.4"> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 

     <ImageButton 
      android:id="@+id/radio_channel_4" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:background="@drawable/background_radio_channel_four" 
      android:scaleType="fitXY" /> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 

     <ImageButton 
      android:id="@+id/radio_channel_5" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:background="@drawable/background_radio_channel_five" 
      android:scaleType="fitXY" /> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 

     <ImageButton 
      android:id="@+id/radio_channel_6" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:background="@drawable/background_radio_channel_six" 
      android:scaleType="fitXY" /> 

     <View 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="0.1" /> 
    </LinearLayout> 
</LinearLayout> 

Любые предложения, чтобы они выглядели нормально не растягивается? Все эти изображения в формате PNG.

Answer 1

Попробуйте создать изображения с поддержкой нескольких экранов, используя приведенную ниже ссылку, которая решает проблему ... https://developer.android.com/training/multiscreen/screendensities.html

Answer 2

Пожалуйста, попробуйте этот обновленный код:

// Исходный код Sample.java

import android.app.Activity; 
import android.os.Bundle; 
import android.widget.GridView; 


public class Sample extends Activity { 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_sample); 
    GridView gridview = (GridView) findViewById(R.id.gridview); 
    gridview.setAdapter(new ImageAdapter(Sample.this)); 
} 
} 

//ImageAdapter.java

import android.content.Context; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.BaseAdapter; 
import android.widget.GridView; 
import android.widget.ImageView; 

public class ImageAdapter extends BaseAdapter { 
    private Context mContext; 

// Constructor 
public ImageAdapter(Context c) { 
    mContext = c; 
} 

public int getCount() { 
    return mThumbIds.length; 
} 

public Object getItem(int position) { 
    return null; 
} 

public long getItemId(int position) { 
    return 0; 
} 

// create a new ImageView for each item referenced by the Adapter 
public View getView(int position, View convertView, ViewGroup parent) { 
    ImageView imageView; 

    if (convertView == null) { 
     imageView = new ImageView(mContext); 
     imageView.setLayoutParams(new GridView.LayoutParams(170, 170)); 

     imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); 

    } else { 
     imageView = (ImageView) convertView; 
    } 
    imageView.setImageResource(mThumbIds[position]); 
    return imageView; 
} 

// Keep all Images in array 
public Integer[] mThumbIds = { 

    R.drawable.ic_radio_2, R.drawable.ic_radio_3, 
    R.drawable.ic_radio_4, R.drawable.ic_radio_5, 
    R.drawable.ic_radio_4, R.drawable.ic_radio_6, 

}; 
} 

Answer 3

Главной преступник является android:scaleType="fitXY"

Изменить его

android:scaleType="centerInside" 



scaleType="fitXY"` means image Stretch to its all corners 
scaleType="centerInside" means place at center of parent 

Я предлагаю вам Удалить все веса для всех макета и просто использовать только Linner макет для всех изображений

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:background="#DCDCDC"> 

<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentTop="true"> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" /> 
</LinearLayout> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_alignParentBottom="true" 
    android:layout_marginBottom="15dp" 
    android:orientation="vertical"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:weightSum="3" 
     android:layout_margin="5dp" 
     android:orientation="horizontal"> 

     <ImageButton 
      android:id="@+id/radio_channel_1" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_margin="10dp" 
      android:background="@drawable/app_icon" 
      android:scaleType="centerInside" /> 


     <ImageButton 
      android:id="@+id/radio_channel_2" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_margin="10dp" 
      android:background="@drawable/app_icon" 
      android:scaleType="centerInside" /> 



     <ImageButton 
      android:id="@+id/radio_channel_3" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_margin="10dp" 
      android:background="@drawable/app_icon" 
      android:scaleType="centerInside" /> 

    </LinearLayout> 


    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_margin="5dp" 
     android:weightSum="3" 
     android:orientation="horizontal"> 


     <ImageButton 
      android:id="@+id/radio_channel_4" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_margin="10dp" 
      android:background="@drawable/app_icon" 
      android:scaleType="centerInside" /> 


     <ImageButton 
      android:id="@+id/radio_channel_5" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_margin="10dp" 
      android:background="@drawable/app_icon" 
      android:scaleType="centerInside" /> 

     <ImageButton 
      android:id="@+id/radio_channel_6" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_margin="10dp" 
      android:background="@drawable/app_icon" 
      android:scaleType="centerInside" /> 

    </LinearLayout> 
</LinearLayout> 

Answer 4

Я решил свою проблему. Вот код

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
tools:context="MainActivity"> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center"> 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      android:src="@mipmap/ic_radio_5_art" /> 
    </LinearLayout> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom" 
      android:orientation="horizontal"> 

      <ImageButton 
       android:id="@+id/radio_channel_1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:adjustViewBounds="true" 
       android:padding="1dp" 
       android:scaleType="fitCenter" 
       android:src="@drawable/background_radio_channel_one" /> 

      <ImageButton 
       android:id="@+id/radio_channel_2" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:adjustViewBounds="true" 
       android:padding="1dp" 
       android:scaleType="fitCenter" 
       android:src="@drawable/background_radio_channel_two" /> 

      <ImageButton 
       android:id="@+id/radio_channel_3" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:adjustViewBounds="true" 
       android:padding="1dp" 
       android:scaleType="fitCenter" 
       android:src="@drawable/background_radio_channel_three" /> 

     </LinearLayout> 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:orientation="horizontal"> 

      <ImageButton 
       android:id="@+id/radio_channel_4" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:adjustViewBounds="true" 
       android:padding="1dp" 
       android:scaleType="fitCenter" 
       android:src="@drawable/background_radio_channel_four" /> 

      <ImageButton 
       android:id="@+id/radio_channel_5" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:adjustViewBounds="true" 
       android:padding="1dp" 
       android:scaleType="fitCenter" 
       android:src="@drawable/background_radio_channel_five" /> 

      <ImageButton 
       android:id="@+id/radio_channel_6" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:adjustViewBounds="true" 
       android:padding="1dp" 
       android:scaleType="fitCenter" 
       android:src="@drawable/background_radio_channel_six" /> 

     </LinearLayout> 

    </LinearLayout> 

Спасибо всем, кто помог мне решить мою проблему :)