Question

我正在尝试添加6张图像作为ImageButtons，但这些图像是垂直拉伸的。见下图：

正如您在上图中所看到的，所有图像按钮都是垂直拉伸的。我把它们放在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>

感谢所有帮助我解决问题的人：）

LinearLayout中的拉伸ImageView

4 个答案: