PhotoView

🌇 PhotoView is an ImageView component for Android that enables zoom functionality through diverse touch gestures. This project has been forked from ChrisBanes' PhotoView.

The aim of this library is to sync up to the recent androidx library, address bugs, enhance features, and distribute the package through Maven Central instead of Jitpack.

Contribution 💙

PhotoView is maintained by Stream. If you’re interested in building powerful real-time video/audio calling, audio room, and livestreaming, check out the Stream Video SDK for Compose! Also, anyone can contribute to improving code, docs, or something following our Contributing Guideline.

Download

Gradle

Add the dependency below to your module's build.gradle file:

dependencies {
    implementation("io.getstream:photoview:1.0.2")
}

Usage

PhotoView can be utilized exactly like ImageView, as demonstrated in the example below:

<io.getstream.photoview.PhotoView
    android:id="@+id/phptoView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/wallpaper"/>

When incorporating third-party image loading libraries like Glide or Coil, images can be loaded as demonstrated in the following examples.

Coil

val photoView = binding.photoView
photoView.load(IMAGE_URL) {
  crossfade(true)
}

Glide

val photoView = binding.photoView
Glide.with(this)
  .load(IMAGE_URL)
  .into(photoView)

Exploring the sample directory reveals a variety of practical examples, including integration with ViewPager, using PhotoView with shared transition elements, utilizing third-party image libraries (such as Coil, Glide, and Picasso), among others.

PhotoView Dialog

You can implement a dialog that displays a list of PhotoView images with the photoview-dialog package. First, you can simply add the dependency below:

dependencies {
    implementation("io.getstream:photoview-dialog:$version")
}

Now, you can display the PhotoView image dialog by using the PhotoViewDialog component like the code below:

val imageUrls = listOf(
  ..,
)

val button = binding.button
button.setOnClickListener {
  PhotoViewDialog.Builder(context = this, images = imageUrls) { imageView, url ->
    Glide.with(this)
      .load(url)
      .into(imageView)
  }.build().show()
}

Then, you'll see the result below:

Supported Features

• Effortless Zooming: Enables zooming capabilities through multi-touch gestures and double-tapping.
• Smooth Scrolling: Offers seamless scrolling experience with fluid fling motion.
• Compatibility with Scrolling Parents: Integrates flawlessly within scrolling containers, like ViewPager, ensuring smooth operation.
• Matrix Change Notifications: Alerts the application when the displayed Matrix changes, which is essential for UI adjustments based on the current zoom or scroll position.
• User Tap Notifications: Notifies the application when the user interacts with the Photo, facilitating responsive UI actions.

Find this repository useful? ❤️

Support it by joining stargazers for this repository. ⭐
Also, follow me on GitHub for my next creations! 🤩

License

Copyright 2024 Stream.IO, Inc.
Copyright 2011, 2012 Chris Banes.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.