Android: Comment faire pour étirer une image à la largeur de l'écran tout en conservant les proportions?

Que j'ai accompli cela avec une vue personnalisée. Ensemble layout_width="fill_parent" et layout_height="wrap_content", et le point à la drawable:

public class Banner extends View {

  private final Drawable logo;

  public Banner(Context context) {
    super(context);
    logo = context.getResources().getDrawable(R.drawable.banner);
    setBackgroundDrawable(logo);
  }

  public Banner(Context context, AttributeSet attrs) {
    super(context, attrs);
    logo = context.getResources().getDrawable(R.drawable.banner);
    setBackgroundDrawable(logo);
  }

  public Banner(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    logo = context.getResources().getDrawable(R.drawable.banner);
    setBackgroundDrawable(logo);
  }

  @Override protected void onMeasure(int widthMeasureSpec,
      int heightMeasureSpec) {
    int width = MeasureSpec.getSize(widthMeasureSpec);
    int height = width * logo.getIntrinsicHeight() / logo.getIntrinsicWidth();
    setMeasuredDimension(width, height);
  }
}

Je viens de lire le code source pour ImageView et il est pratiquement impossible sans l'aide de la sous-classement des solutions dans ce thread. Dans ImageView.onMeasure nous arrivons à ces lignes:

        //Get the max possible width given our constraints
        widthSize = resolveAdjustedSize(w + pleft + pright, mMaxWidth, widthMeasureSpec);

        //Get the max possible height given our constraints
        heightSize = resolveAdjustedSize(h + ptop + pbottom, mMaxHeight, heightMeasureSpec);

Où h et w sont les dimensions de l'image, et p* est le remplissage.

Et puis:

private int resolveAdjustedSize(int desiredSize, int maxSize,
                               int measureSpec) {
    ...
    switch (specMode) {
        case MeasureSpec.UNSPECIFIED:
            /* Parent says we can be as big as we want. Just don't be larger
               than max size imposed on ourselves.
            */
            result = Math.min(desiredSize, maxSize);

Donc si vous avez un layout_height="wrap_content" il sera mis en widthSize = w + pleft + pright, ou en d'autres termes, la largeur maximale est égale à la largeur de l'image.

Cela signifie que , sauf si vous définissez une taille exacte, les images ne sont JAMAIS élargie. Je considère que cela est un bug, mais bonne chance pour Google de prendre l'avis ou le fixer. Edit: Manger mes propres mots, j'ai soumis un rapport de bogue et ils disent qu'il a été corrigé dans une future version!

Une autre solution

Voici un autre sous-classé solution de contournement, mais vous devrait (en théorie, je n'ai pas vraiment testé beaucoup!) être en mesure de l'utiliser partout où vous ImageView. Pour l'utiliser ensemble layout_width="match_parent", et layout_height="wrap_content". Il est beaucoup plus générale que la solution retenue aussi. E. g. vous pouvez le faire adapter à la hauteur ainsi que l'ajustement à la largeur.

import android.content.Context;
import android.util.AttributeSet;
import android.widget.ImageView;
//This works around the issue described here: http://stackoverflow.com/a/12675430/265521
public class StretchyImageView extends ImageView
{
public StretchyImageView(Context context)
{
super(context);
}
public StretchyImageView(Context context, AttributeSet attrs)
{
super(context, attrs);
}
public StretchyImageView(Context context, AttributeSet attrs, int defStyle)
{
super(context, attrs, defStyle);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
//Call super() so that resolveUri() is called.
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//If there's no drawable we can just use the result from super.
if (getDrawable() == null)
return;
final int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);
final int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);
int w = getDrawable().getIntrinsicWidth();
int h = getDrawable().getIntrinsicHeight();
if (w <= 0)
w = 1;
if (h <= 0)
h = 1;
//Desired aspect ratio of the view's contents (not including padding)
float desiredAspect = (float) w / (float) h;
//We are allowed to change the view's width
boolean resizeWidth = widthSpecMode != MeasureSpec.EXACTLY;
//We are allowed to change the view's height
boolean resizeHeight = heightSpecMode != MeasureSpec.EXACTLY;
int pleft = getPaddingLeft();
int pright = getPaddingRight();
int ptop = getPaddingTop();
int pbottom = getPaddingBottom();
//Get the sizes that ImageView decided on.
int widthSize = getMeasuredWidth();
int heightSize = getMeasuredHeight();
if (resizeWidth && !resizeHeight)
{
//Resize the width to the height, maintaining aspect ratio.
int newWidth = (int) (desiredAspect * (heightSize - ptop - pbottom)) + pleft + pright;
setMeasuredDimension(newWidth, heightSize);
}
else if (resizeHeight && !resizeWidth)
{
int newHeight = (int) ((widthSize - pleft - pright) / desiredAspect) + ptop + pbottom;
setMeasuredDimension(widthSize, newHeight);
}
}
}

J'ai été aux prises avec ce problème sous une forme ou une autre depuis des lustres, merci, merci, Merci.... 🙂

Je voulais juste faire remarquer que vous pouvez obtenir une solution généralisable à partir de ce que Bob Lee se fait par simple extension de la Vue et de l'impérieuse onMeasure. De cette façon, vous pouvez l'utiliser avec n'importe quel drawable vous voulez, et il ne cassera pas si il n'y a pas d'image:

    public class CardImageView extends View {
public CardImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public CardImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CardImageView(Context context) {
super(context);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
Drawable bg = getBackground();
if (bg != null) {
int width = MeasureSpec.getSize(widthMeasureSpec);
int height = width * bg.getIntrinsicHeight() / bg.getIntrinsicWidth();
setMeasuredDimension(width,height);
}
else {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
}

J'ai réussi à atteindre cet objectif en utilisant ce code XML seulement. Cela pourrait être le cas que eclipse ne rend pas la hauteur pour montrer l'expansion de l'ajustement; cependant, lorsque vous exécutez ce code sur un appareil, il rend correctement et fournit le résultat souhaité. (eh bien, au moins pour moi)

<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:src="@drawable/whatever" />
</FrameLayout>

Tout le monde est en train de faire ce programmily j'ai donc pensé que cette réponse serait parfaitement ici. Ce code a fonctionné pour mon dans le xml. Im ne PAS penser à la ratio encore, mais je voulais placer cette réponse si cela peut aider quelqu'un.

android:adjustViewBounds="true"

Acclamations..

Sa simple question de réglage adjustViewBounds="true" et scaleType="fitCenter" dans le fichier XML pour l'ImageView!

<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/image"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
/>

Remarque: layout_width est fixé à match_parent

ScaleType.CENTER_CROP faire ce que vous souhaitez: étirement de toute la largeur, et l'échelle de la hauteur en conséquence. si à l'échelle de la hauteur dépasse les limites de l'écran, l'image sera rognée.

Vous pouvez utiliser mon StretchableImageView préservant l'aspect ratio (en largeur ou en hauteur) en fonction de la largeur et de la hauteur de drawable:

import android.content.Context;
import android.util.AttributeSet;
import android.widget.ImageView;
public class StretchableImageView extends ImageView{
public StretchableImageView(Context context) {
super(context);
}
public StretchableImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public StretchableImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
if(getDrawable()!=null){
if(getDrawable().getIntrinsicWidth()>=getDrawable().getIntrinsicHeight()){
int width = MeasureSpec.getSize(widthMeasureSpec);
int height = width * getDrawable().getIntrinsicHeight()
/ getDrawable().getIntrinsicWidth();
setMeasuredDimension(width, height);
}else{
int height = MeasureSpec.getSize(heightMeasureSpec);
int width = height * getDrawable().getIntrinsicWidth()
/ getDrawable().getIntrinsicHeight();
setMeasuredDimension(width, height);
}
}
}
}

Ce travail bien que par mon exigence

<ImageView
android:id="@+id/imgIssue"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitXY"/>