如何在点击ImageView时全屏显示图片？

Question

我需要在点击ImageView时全屏打开一张图片，就像一个只有一张图片的画廊！我该如何做？

- Anass

---

也许您想跟随这个教程缩放视图。 - michal.z

我已经在ImageView中添加了一个模式，但是该模式不清晰。我希望当我点击这个ImageView时，该模式可以全屏显示。我不知道从哪里开始，请原谅我的糟糕英语 :/ 这是一个屏幕截图 ==> http://img15.hostingpics.net/pics/805298Capture.jpg - Anass

michal.z，谢谢你，这正是我需要的 =D 我现在会尝试它。 - Anass

Answer 1

这是一个基本的例子：

布局文件为activity_main.xml。

   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center">

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/ic_launcher"/>

    </LinearLayout>

onCreate()方法：

private boolean zoomOut =  false;

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

    final ImageView imageView  = (ImageView)findViewById(R.id.imageView1);
    imageView .setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View v) {
            if(zoomOut) {
                Toast.makeText(getApplicationContext(), "NORMAL SIZE!", Toast.LENGTH_LONG).show();
                imageView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
                imageView.setAdjustViewBounds(true);
                zoomOut =false;
            }else{
                Toast.makeText(getApplicationContext(), "FULLSCREEN!", Toast.LENGTH_LONG).show();
                imageView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT));
                imageView.setScaleType(ImageView.ScaleType.FIT_XY);
                zoomOut = true;
            }
        }                   
    });
}

- Jorgesys

---

我已经编辑了代码，使得当你点击图像时可以进行缩放。 - Jorgesys

@Tony，请发布您的问题，我已经亲自测试过这段代码并且可行！ - Jorgesys

请查看。谢谢。 - Tony

这样可以实现很好的缩放，但是布局在左上角。 - Ali Obeid

Answer 2

Jorgesys的回答很好，但要使图像真正全屏，更好的方法是使用.NoActionBar.Fullscreen主题创建一个新的对话框/活动。例如：

<style name="FullScreenDialogTheme" parent="android:Theme.Material.NoActionBar.Fullscreen"/>

这个新的对话框只包含一个图片视图，用于显示你的图片。

然后，你需要通过意图将drawable或其引用从你的活动传递到这个新的对话框中。有关详细信息，请参见此问题。（出于效率考虑，建议通过一些引用进行传递）。

- Shashwat Black

Answer 3

尝试这段代码。。

imageView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        imageView.setVisibility(View.GONE);
        imageView2.setVisibility(View.VISIBLE);
        Glide.with(this).load(imagePath).into(imageView2);

    }
});

XML 代码...

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center">

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher"
        />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:src="@drawable/ic_launcher"
        android:visibility="gone"
        />
</LinearLayout>

如果您还使用了Glide，请在应用级别的gradle文件中添加以下依赖项。

implementation 'com.github.bumptech.glide:glide:4.7.1'

- user4571931