Android图片预览功能（可旋转、缩放、左右切换）

来源：互联网发布：千牛怎么查买家淘宝号编辑：程序博客网时间：2024/05/21 14:54

我们要实现的效果

1、点击图片出现预览界面

2、可对图片进行旋转、缩放

3、能左右滑动，预览其他图片

4、单击预览界面后，回到上一界面

具体如下图：

使用到的第三方库

1、图片加载缓存库 Picasso：https://github.com/square/picasso

2、图片浏览缩放控件 PhotoView：https://github.com/bm-x/PhotoView

万事俱备，就差实现了， Let ' s go！！

一、创建一个图片预览 ImageBrowseActivity

布局文件如下：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#ff171b19"    android:orientation="vertical" >    <android.support.v4.view.ViewPager        android:id="@+id/imageBrowseViewPager"        android:layout_width="match_parent"        android:layout_height="match_parent" /></LinearLayout>

二、点击图片开始预览，需要通过 Intent 跳转到 ImageBrowseActivity

1、传递图片列表，因为用到Picasso，所以列表存储的是图片URL

2、传递要第一个显示的图片下标

private val imageList = ArrayList<String>() //图片列表

val intent = Intent(context, ImageBrowseActivity::class.java)intent.putStringArrayListExtra("imageList", imageList)intent.putExtra("index", position)context.startActivity(intent)

三、ImageBrowseActivity中的具体逻辑

1、拿到图片列表、第一个显示的图片下标

if(intent.extras != null){    index = intent.getIntExtra("index", 0)    imageList = intent.getStringArrayListExtra("imageList")}

2、写一个图片适配器 ImageBrowseAdapter

图片加载使用 Picasso

需要注意的几点：

图片的 ScaleType 最好设置为 centerInside
不需要使用 PhotoView 的 animFrom()、animTo() 函数，会出现一些问题
可自己设置最大缩放倍数

private inner class ImageBrowseAdapter(var context: Context) : PagerAdapter() {    override fun getCount(): Int {        return imageList.size    }    override fun isViewFromObject(view: View, `object`: Any): Boolean {        return view === `object`    }    override fun instantiateItem(container: ViewGroup, position: Int): View {        val image = PhotoView(context)        // 开启图片缩放功能        image.enable()        // 设置缩放类型        image.scaleType = ImageView.ScaleType.CENTER_INSIDE        // 设置最大缩放倍数        image.maxScale = 2.5f        // 加载图片        Picasso.with(context)                .load(imageList[position])                .into(image)        // 单击图片，返回        image.onClick {            image.disenable()            finish()        }        container.addView(image)        return image    }    override fun destroyItem(container: ViewGroup, position: Int, `object`: Any) {        container.removeView(`object` as View)    }}

3、初始化 ViewPager

fun initViewPager(){    imageBrowseViewPager.adapter = ImageBrowseAdapter(this)    imageBrowseViewPager.currentItem = index}

到此，功能就实现了！！！！

0 0