Android
ImageView

introduzione

Sintassi

• Il metodo setImageResource(int resId) imposta un drawable come contenuto di ImageView .
• Utilizzo: imageView.setImageResource(R.drawable.anyImage)

Parametri

Imposta la risorsa immagine

<ImageView
 android:id="@+id/imgExample"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 ...
 />

imposta un drawable come contenuto di ImageView usando l'attributo XML:

android:src="@drawable/android2"  

imposta un drawable a livello di codice:

 ImageView imgExample = (ImageView) findViewById(R.id.imgExample);
 imgExample.setImageResource(R.drawable.android2);

Imposta alfa

"alpha" è usato per specificare l'opacità di un'immagine.

imposta alpha usando l'attributo XML:

android:alpha="0.5"  

Nota: prende il valore float da 0 (trasparente) a 1 (completamente visibile)

imposta alfa a livello di codice:

imgExample.setAlpha(0.5f);

ImageView ScaleType - Center

L'immagine contenuta in ImageView potrebbe non corrispondere alla dimensione esatta fornita al contenitore. In tal caso, il framework consente di ridimensionare l'immagine in vari modi.

Centro

    <ImageView android:layout_width="20dp"
           android:layout_height="20dp"
           android:src="@mipmap/ic_launcher"
           android:id="@+id/imageView"
           android:scaleType="center"
           android:background="@android:color/holo_orange_light"/>

Questo non ridimensionerà l'immagine e la centrerà all'interno del contenitore (Arancione = contenitore)

Nel caso in cui ImageView sia più piccolo dell'immagine, l'immagine non verrà ridimensionata e sarai in grado di vederne solo una parte

testo forte

ImageView ScaleType - CenterCrop

Ridimensionare l'immagine in modo uniforme (mantenere le proporzioni dell'immagine) in modo che entrambe le dimensioni (larghezza e altezza) dell'immagine siano uguali o maggiori della dimensione corrispondente della vista (meno spaziatura).

Documenti ufficiali

Quando l'immagine corrisponde alle proporzioni del contenitore:

Quando l'immagine è più larga del contenitore, la espande alla dimensione maggiore (in questo caso l'altezza) e regola la larghezza dell'immagine senza modificarne le proporzioni, causandone il ritaglio.

ImageView ScaleType - CenterInside

Ridimensionare l'immagine in modo uniforme (mantenere le proporzioni dell'immagine) in modo che entrambe le dimensioni (larghezza e altezza) dell'immagine siano pari o inferiori alla dimensione corrispondente della vista (meno riempimento).

Documenti ufficiali

Centrerà l'immagine e la ridimensionerà alla dimensione più piccola, se entrambe le dimensioni dei contenitori sono più grandi, funzionerà come il centro.

Ma se una delle dimensioni è piccola, si adatta a quella dimensione.

ImageView ScaleType - FitStart e FitEnd

Ridimensiona l'immagine usando START.

Ridimensiona l'immagine usando FINE.

Documenti ufficiali

FitStart

Questo si adatta alle dimensioni più piccole del contenitore e lo allineerà all'inizio.

<ImageView android:layout_width="200dp"
           android:layout_height="200dp"
           android:src="@mipmap/ic_launcher"
           android:id="@+id/imageView"
           android:scaleType="fitStart"
           android:layout_gravity="center"
           android:background="@android:color/holo_orange_light"/>

FitEnd

Questo si adatta alle dimensioni più piccole del contenitore e lo allineerà alla fine.

<ImageView android:layout_width="200dp"
           android:layout_height="100dp"
           android:src="@mipmap/ic_launcher"
           android:id="@+id/imageView"
           android:scaleType="fitEnd"
           android:layout_gravity="center"
           android:background="@android:color/holo_orange_light"/>

ImageView ScaleType - FitCenter

Ridimensiona l'immagine usando CENTER.

Documenti ufficiali

Questo espande l'immagine per cercare di abbinare il contenitore e lo allineerà al centro, si adatterà alle dimensioni più piccole.

Altezza più grande (adatta alla larghezza)

Stessa larghezza e altezza.

ImageView ScaleType - FitXy

Ridimensiona l'immagine usando FILL.

Documenti ufficiali

<ImageView android:layout_width="100dp"
           android:layout_height="200dp"
           android:src="@mipmap/ic_launcher"
           android:id="@+id/imageView"
           android:scaleType="fitXY"
           android:layout_gravity="center"
           android:background="@android:color/holo_orange_light"/>

Imposta il tipo di scala

Controlla come ridimensionare o spostare l'immagine in modo che corrisponda alla dimensione di ImageView .

Attributo XML:

android:scaleType="..."

Illustrerò diversi tipi di scala con un ImageView quadrato che ha uno sfondo nero e vogliamo visualizzare un disegnatore rettangolare con sfondo bianco in ImageView .

 <ImageView
  android:id="@+id/imgExample"
  android:layout_width="200dp"
  android:layout_height="200dp"
  android:background="#000" 
  android:src="@drawable/android2"
  android:scaleType="..."/>

scaleType deve essere uno dei seguenti valori:

1. center : center l'immagine nella vista, ma non esegue ridimensionamenti.

2. centerCrop : centerCrop l'immagine in modo uniforme (mantiene le proporzioni dell'immagine) in modo che entrambe le dimensioni (larghezza e altezza) dell'immagine siano uguali o maggiori della dimensione corrispondente della vista (meno riempimento). L'immagine è quindi centrata nella vista.

3. centerInside : centerInside l'immagine in modo uniforme (mantiene le proporzioni dell'immagine) in modo che entrambe le dimensioni (larghezza e altezza) dell'immagine siano uguali o inferiori alla dimensione corrispondente della vista (meno riempimento). L'immagine è quindi centrata nella vista.

4. matrix : scala usando la matrice immagine durante il disegno.

5. fitXY : fitXY l'immagine usando FILL .

6. fitStart : fitStart l'immagine usando START .

7. fitCenter : fitCenter l'immagine usando CENTER .

8. fitEnd : fitEnd l'immagine usando END .

Imposta la tinta

Imposta un colore per l'immagine. Per impostazione predefinita, la tinta si fonderà usando la modalità SRC_ATOP .

imposta la tinta usando l'attributo XML:

android:tint="#009c38"

Nota: deve essere un valore di colore, sotto forma di "#rgb" , "#argb" , "#rrggbb" o "#aarrggbb" .

imposta la tinta programmaticamente:

imgExample.setColorFilter(Color.argb(255, 0, 156, 38));

e puoi cancellare questo filtro colore:

imgExample.clearColorFilter();

Esempio:

MLRoundedImageView.java

Copia e incolla seguendo la lezione nel tuo pacchetto:

public class MLRoundedImageView extends ImageView {

    public MLRoundedImageView(Context context) {
        super(context);
    }

    public MLRoundedImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MLRoundedImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void onDraw(Canvas canvas) {

        Drawable drawable = getDrawable();

        if (drawable == null) {
            return;
        }

        if (getWidth() == 0 || getHeight() == 0) {
            return;
        }
        Bitmap b = ((BitmapDrawable) drawable).getBitmap();
        Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);

        int w = getWidth(), h = getHeight();

        Bitmap roundBitmap = getCroppedBitmap(bitmap, w);
        canvas.drawBitmap(roundBitmap, 0, 0, null);

    }

    public static Bitmap getCroppedBitmap(Bitmap bmp, int radius) {
        Bitmap sbmp;
        
        if (bmp.getWidth() != radius || bmp.getHeight() != radius) {
            float smallest = Math.min(bmp.getWidth(), bmp.getHeight());
            float factor = smallest / radius;
            sbmp = Bitmap.createScaledBitmap(bmp, (int)(bmp.getWidth() / factor), (int)(bmp.getHeight() / factor), false);
        } else {
            sbmp = bmp;
        }
        
        Bitmap output = Bitmap.createBitmap(radius, radius,
                Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        final int color = 0xffa19774;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, radius, radius);

        paint.setAntiAlias(true);
        paint.setFilterBitmap(true);
        paint.setDither(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(Color.parseColor("#BAB399"));
        canvas.drawCircle(radius / 2 + 0.7f,
                radius / 2 + 0.7f, radius / 2 + 0.1f, paint);
        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(sbmp, rect, rect, paint);

        return output;
    }
}

Utilizzare questa classe in XML con il nome del pacchetto invece di ImageView

<com.androidbuts.example.MLRoundedImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher" />