Android Image Dialog/Popup del mismo tamaño que la imagen y sin borde

transparent

Question

Por el momento estoy trabajando en un buscador de archivos. Todo funciona bien con una excepción: si el usuario hace clic en una imagen (jpg, png, bmp, ...), quiero que la imagen se muestre en un cuadro de diálogo o en una ventana emergente que tenga el mismo tamaño que la imagen, de modo que no hay fronteras en absoluto. Los archivos de imagen se encuentran en la tarjeta sd.

Esto es lo que tengo hasta ahora:

BitmapDrawable bitmap = new BitmapDrawable(context.getResources(), TARGET_PATH);

AlertDialog.Builder imageDialog = new AlertDialog.Builder(context);
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

View layout = inflater.inflate(R.layout.thumbnail, null);
ImageView image = (ImageView) layout.findViewById(R.id.thumbnail_IMAGEVIEW);
image.setImageDrawable(bitmap);
imageDialog.setView(layout);
imageDialog.create();
imageDialog.show();

El archivo XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/thumbnail_IMAGEVIEW"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:contentDescription="@string/icon_DESCRIPTION" />

</RelativeLayout>

Aquí está el resultado:

Hay bordes feos en los bordes de las imágenes; no quiero que se muestren. Intenté muchas cosas y ejemplos enumerados en google, etc. - nada funcionó aún.

La mejor opción será hacer que el diálogo / la vista detrás de la imagen sea del mismo tamaño que la imagen. Otra forma podría ser establecer el fondo detrás de la imagen transparente.

¿Cómo logro alguna solución? Me encantaría hacer que el fondo sea del mismo tamaño que la imagen, por lo que no queda nada "invisible", pero también estaré bien con la opción transparente.

Solución:

// Get screen size
Display display = context.getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
int screenWidth = size.x;
int screenHeight = size.y;

// Get target image size
Bitmap bitmap = BitmapFactory.decodeFile(TARGET);
int bitmapHeight = bitmap.getHeight();
int bitmapWidth = bitmap.getWidth();

// Scale the image down to fit perfectly into the screen
// The value (250 in this case) must be adjusted for phone/tables displays
while(bitmapHeight > (screenHeight - 250) || bitmapWidth > (screenWidth - 250)) {
    bitmapHeight = bitmapHeight / 2;
    bitmapWidth = bitmapWidth / 2;
}

// Create resized bitmap image
BitmapDrawable resizedBitmap = new BitmapDrawable(context.getResources(), Bitmap.createScaledBitmap(bitmap, bitmapWidth, bitmapHeight, false));

// Create dialog
Dialog dialog = new Dialog(context);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.thumbnail);

ImageView image = (ImageView) dialog.findViewById(R.id.imageview);

// !!! Do here setBackground() instead of setImageDrawable() !!! //
image.setBackground(resizedBitmap);

// Without this line there is a very small border around the image (1px)
// In my opinion it looks much better without it, so the choice is up to you.
dialog.getWindow().setBackgroundDrawable(null);

// Show the dialog
dialog.show();

Archivo XML:

<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/imageview"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

</ImageView>

Salida final:

Answer 1

Use FrameLayout como padre en lugar de RelativeLayout y configurado en wrap_content y 0 margins.

Tratar:

<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:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:background="@color/background">

<FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/frameLayout"
        android:background="#b2ff7c">

    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/imageView"
            android:src="@drawable/ic_launcher"/>
</FrameLayout>

</RelativeLayout>

El resultado debe ser un fondo del mismo tamaño que ImageView.

Si esto funciona Intenta modificar esto en un tema personalizado:

    <style name="Widget.ImageWell">
    <item name="android:background">@android:drawable/panel_picture_frame_background</item>
    </style>

Answer 2

Cambia tu ImageView de esto:

<ImageView
        android:id="@+id/thumbnail_IMAGEVIEW"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:contentDescription="@string/icon_DESCRIPTION" />

A esto:

<ImageView
        android:id="@+id/thumbnail_IMAGEVIEW"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:adjustViewBounds="true" <!-- Here is the thing -->
        android:contentDescription="@string/icon_DESCRIPTION" />

Espero que esto ayude.

Answer 3

puede crear un cuadro de diálogo personalizado para mostrar imágenes, hacer un diseño para inflar en la vista de configuración de cuadros de diálogo, tomar un diseño lineal con ancho y alto ajustar el contenido y la vista de imagen con la propiedad de escala fitxy.

Answer 4

¿Has intentado configurar setType en ImageView?

<ImageView ... android:scaleType="fitXY" ... />

Answer 5

Agregue el código de una sola línea en la inicialización de su vista de imagen a su actividad y esto resolverá su problema.

image.setScaleType(ImageView.ScaleType.FIT_XY);