web-dev-qa-db-fra.com

Android Boîte de dialogue / fenêtre d'image

Est-il possible d'avoir juste une fenêtre/popup d'image dans une application Android? C'est similaire à une surcharge de la vue normale d'un AlertDialog pour qu'il ne contienne qu'une image et rien d'autre.

SOLUTION: J'ai pu trouver une réponse grâce à l'aide de @ blessenm. Masquer une activité comme un dialogue semble être le moyen idéal. Voici le code que j'ai utilisé. Cette activité de style boîte de dialogue peut être invoquée selon les besoins par l'application de la même manière qu'une nouvelle activité serait démarrée

ImageDialog.Java

public class ImageDialog extends Activity {

    private ImageView mDialog;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.your_dialog_layout);



        mDialog = (ImageView)findViewById(R.id.your_image);
        mDialog.setClickable(true);


        //finish the activity (dismiss the image dialog) if the user clicks 
        //anywhere on the image
        mDialog.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View v) {
            finish();
        }
        });

    }
}

your_dialog_layout.xml

<?xml version="1.0" encoding="UTF-8"?>
<FrameLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/image_dialog_root" 
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:background="@Android:color/transparent"
    Android:gravity = "center">

    <ImageView
        Android:id="@+id/your_image"  
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:src = "@drawable/your_image_drawable"/>

</FrameLayout>

Il est essentiel que vous définissiez le style suivant pour que l'activité y parvienne:

styles.xml

  <style name="myDialogTheme" parent="@Android:style/Theme.Dialog">
    <item name="Android:windowNoTitle">true</item>
    <item name="Android:windowFrame">@null</item>
    <item name="Android:background">@Android:color/transparent</item>
    <item name="Android:windowBackground">@Android:color/transparent</item>
    <item name="Android:windowIsFloating">true</item>
    <item name="Android:backgroundDimEnabled">false</item>
    <item name="Android:windowContentOverlay">@null</item>
   </style>

La dernière étape consiste à déclarer ce style pour l'activité dans le manifeste comme suit: 

 <activity Android:name=".ImageDialog" Android:theme="@style/myDialogTheme" />
androiddialogandroid-imageviewandroid-alertdialog
47
Abhijit

Si vous voulez simplement utiliser une boîte de dialogue normale, quelque chose comme ça devrait fonctionner

Dialog settingsDialog = new Dialog(this);
settingsDialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
settingsDialog.setContentView(getLayoutInflater().inflate(R.layout.image_layout
        , null));
settingsDialog.show();

image_layout.xml

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="wrap_content" Android:layout_height="wrap_content"
    Android:orientation="vertical">
    <ImageView Android:layout_width="wrap_content" 
        Android:layout_height="wrap_content" Android:src="YOUR IMAGE"/>
    <Button Android:layout_width="wrap_content" Android:layout_height="wrap_content"
        Android:text="OK" Android:onClick="dismissListener"/>
</LinearLayout>
41
blessenm

Pas de xml:

public void showImage() {
    Dialog builder = new Dialog(this);
    builder.requestWindowFeature(Window.FEATURE_NO_TITLE);
    builder.getWindow().setBackgroundDrawable(
        new ColorDrawable(Android.graphics.Color.TRANSPARENT));
    builder.setOnDismissListener(new DialogInterface.OnDismissListener() {
        @Override
        public void onDismiss(DialogInterface dialogInterface) {
            //nothing;
        }
    });

    ImageView imageView = new ImageView(this);
    imageView.setImageURI(imageUri);
    builder.addContentView(imageView, new RelativeLayout.LayoutParams(
            ViewGroup.LayoutParams.MATCH_PARENT, 
            ViewGroup.LayoutParams.MATCH_PARENT));
    builder.show();
}
58
Oded Breiner

La manière la plus flexible et recommandée est d'utiliser DialogFragment. Si vous souhaitez prendre en charge les versions antérieures à 3.0, vous pouvez utiliser la bibliothèque de compatibilité

1
jperera

Sans utiliser la boîte de dialogue, vous pouvez utiliser cette bibliothèque pour faire apparaître une image très facilement.

https://github.com/chathuralakmal/AndroidImagePopup

1
Im Batman

Il y a plusieurs façons de procéder. Mais, si vous souhaitez que votre image semble flotter au-dessus de votre activité existante, vous souhaiterez peut-être utiliser une activité avec Android: theme = "@ style/Theme.Transparent" défini dans le manifeste. Ensuite, concevez votre mise en page de manière à ce qu'une seule ImageView soit positionnée au centre de l'écran. L'utilisateur devra appuyer sur le bouton de retour pour s'en sortir, mais il semble que c'est ce que vous voulez.

Si vous voulez qu'il ressemble à une boîte de dialogue réelle, vous pouvez toujours utiliser une activité de style boîte de dialogue en utilisant également Theme.Dialog. OU, vous pouvez simplement utiliser une boîte de dialogue et la personnaliser.

1
SBerg413

Vous pouvez le faire facilement en créant un fragment de dialogue dans Kotlin:

BigImageDialog.kt

    class BigImageDialog():DialogFragment() {
    private var imageUrl = ""
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        arguments?.let {
            imageUrl = arguments.getString("url")
        }
    }
    override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?, savedInstanceState: Bundle?): View {
        val v = inflater!!.inflate(R.layout.dialog_big_image, container, false)
        this.dialog.window.requestFeature(Window.FEATURE_NO_TITLE)
        Picasso.get().load(imageUrl).into(v.bigImageView)
        return v
    }

    override fun onStart() {
        super.onStart()

        val dialog = dialog
        if (dialog != null) {
            dialog.window.setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)
        }
    }

    companion object {
        @JvmStatic
        fun newInstance(imageUrl: String) =
                BigImageDialog().apply {
                    arguments = Bundle().apply {
                        putString("url", imageUrl)
                    }
                }
    }
}

dialog_big_image.xml

<?xml version="1.0" encoding="utf-8"?>
<Android.support.constraint.ConstraintLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <ImageView
        Android:id="@+id/bigImageView"
        Android:layout_width="0dp"
        Android:layout_height="0dp"
        Android:scaleType="centerCrop"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</Android.support.constraint.ConstraintLayout>

Boîte de dialogue d'ouverture:

"smallImageView".setOnClickListener { BigImageDialog.newInstance("image url").show(fragmentManager,"") }
1
Bayar Şahintekin

Essayez ce qui suit:
Il a également l'image zoom_in/zoom_out.

Étape 1:
Ajouter compile 'com.github.chrisbanes.photoview:library:1.2.4' à ton build.gradle
Étape 2:
Ajoutez le xml suivant

custom_fullimage_dialoge.xml

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
              Android:id="@+id/layout_root" Android:orientation="horizontal"
              Android:layout_width="fill_parent" Android:layout_height="fill_parent"
              Android:padding="10dp">
    <ImageView Android:id="@+id/fullimage" Android:layout_width="fill_parent"
               Android:layout_height="fill_parent">
    </ImageView>

    <TextView Android:id="@+id/custom_fullimage_placename"
              Android:layout_width="wrap_content" Android:layout_height="fill_parent"
              Android:textColor="#FFF">
    </TextView>
</LinearLayout>

Étape 3:

private void loadPhoto(ImageView imageView, int width, int height) {

    final Dialog dialog = new Dialog(this);
    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
    dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Android.graphics.Color.TRANSPARENT));
    //dialog.setContentView(R.layout.custom_fullimage_dialog);
    LayoutInflater inflater = (LayoutInflater) this.getSystemService(LAYOUT_INFLATER_SERVICE);
    View layout = inflater.inflate(R.layout.custom_fullimage_dialog,
            (ViewGroup) findViewById(R.id.layout_root));
    ImageView image = (ImageView) layout.findViewById(R.id.fullimage);
    image.setImageDrawable(imageView.getDrawable());
    image.getLayoutParams().height = height;
    image.getLayoutParams().width = width;
    mAttacher = new PhotoViewAttacher(image);
    image.requestLayout();
    dialog.setContentView(layout);
    dialog.show();

}

Étape 4:

user_Image.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        Display display = getWindowManager().getDefaultDisplay();
        int width = display.getWidth();
        int height = display.getHeight();
        loadPhoto(user_Image,width,height);
    }
});
1
Vakas