Adds touch functionality to Android ImageView.

Overview

TouchImageView for Android

Capabilities

TouchImageView extends ImageView and supports all of ImageView’s functionality. In addition, TouchImageView adds pinch zoom, dragging, fling, double tap zoom functionality and other animation polish. The intention is for TouchImageView to mirror as closely as possible the functionality of zoomable images in Gallery apps.

Download

Repository available on https://jitpack.io/#MikeOrtiz/TouchImageView

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}
dependencies {
    implementation 'com.github.MikeOrtiz:TouchImageView:1.4.1' // last SupportLib version
    // or
    implementation 'com.github.MikeOrtiz:TouchImageView:$LAST_VERSION' // Android X
}

Examples

Please view the sample app which includes examples of the following functionality:

Single TouchImageView

Basic use of a single TouchImageView. Includes usage of OnTouchImageViewListener, getScrollPosition(), getZoomedRect(), isZoomed(), and getCurrentZoom().

ViewPager Example

TouchImageViews placed in a ViewPager like the Gallery app.

Mirroring Example

Mirror two TouchImageViews using onTouchImageViewListener and setZoom().

Switch Image Example

Click on TouchImageView to cycle through images. Note that the zoom state is maintained though the images are switched.

Switch ScaleType Example

Click on TouchImageView to cycle through supported ScaleTypes.

Resize Example

Click on the arrow buttons to change the shape and size of the TouchImageView. See how the view looks when it shrinks with various "resize" settings. Read ChangeSizeExampleActivity.java's comment for advice on how to set up a TouchImageView that's going to be resized.

Limitations

TouchImageView does not yet support pinch image rotation. Also, FIT_START and FIT_END scaleTypes are not yet supported.

API

Get the current zoom. This is the zoom relative to the initial scale, not the original resource.

float getCurrentZoom();

Get the max zoom multiplier.

float getMaxZoom();

Get the min zoom multiplier.

float getMinZoom();

Return the point at the center of the zoomable image. The PointF coordinates range in value between 0 and 1 and the focus point is denoted as a fraction from the left and top of the view. For example, the top left corner of the image would be (0, 0). And the bottom right corner would be (1, 1).

PointF getScrollPosition();

Return a RectF representing the zoomed image.

RectF getZoomedRect();

Returns false if image is in initial, unzoomed state. True, otherwise.

boolean isZoomed();

Reset zoom and translation to initial state.

void resetZoom();

Set the max zoom multiplier. Default value is 3.

void setMaxZoom(float max);

Set the min zoom multiplier. Default value is 1. Set to TouchImageView.AUTOMATIC_MIN_ZOOM to make it possible to see the whole image.

void setMinZoom(float min);

Set the max zoom multiplier to stay at a fixed multiple of the min zoom multiplier.

void setMaxZoomRatio(float max);

Set the focus point of the zoomed image. The focus points are denoted as a fraction from the left and top of the view. The focus points can range in value between 0 and 1.

void setScrollPosition(float focusX, float focusY);

Set zoom to the specified scale. Image will be centered by default.

void setZoom(float scale);

Set zoom to the specified scale. Image will be centered around the point (focusX, focusY). These floats range from 0 to 1 and denote the focus point as a fraction from the left and top of the view. For example, the top left corner of the image would be (0, 0). And the bottom right corner would be (1, 1).

void setZoom(float scale, float focusX, float focusY);

Set zoom to the specified scale. Image will be centered around the point (focusX, focusY). These floats range from 0 to 1 and denote the focus point as a fraction from the left and top of the view. For example, the top left corner of the image would be (0, 0). And the bottom right corner would be (1, 1).

void setZoom(float scale, float focusX, float focusY, ScaleType scaleType);

Set zoom parameters equal to another TouchImageView. Including scale, position, and ScaleType.

void setZoom(TouchImageView img);

Set which part of the image should remain fixed if the TouchImageView is resized.

setViewSizeChangeFixedPixel(FixedPixel fixedPixel)

Set which part of the image should remain fixed if the screen is rotated.

setOrientationChangeFixedPixel(FixedPixel fixedPixel)

License

TouchImageView is available under the MIT license. See the LICENSE file for more info.

Comments
  • Fixed to respect view padding

    Fixed to respect view padding

    Previously, padding was not taken into account when calculating the size of the image, yet the image was still placed within the view with the left and top padding, causing the image to appear offset, as below.

    screenshot_2014-02-23-16-10-53

    When zoomed in, you could not see the padding on the right hand side or the bottom.

    screenshot_2014-02-23-16-11-07

    This fix allows the view to respect any padding specified on the image view. The view fills the entire view area, but then the image itself is sized to fit inside the views padding. This allows any background color etc to fill the view, as expected.

    screenshot_2014-02-23-16-11-29

    When zoomed in, you can pan to the edge of the image, and see the padding on all sides.

    screenshot_2014-02-23-16-11-35

    Finally, you can see that this works for non-uniform padding - the following image has 200dp padding on the right side, with 16dp on all other sides.

    screenshot_2014-02-23-16-12-07

    And zoomed in & panned:

    screenshot_2014-02-23-16-12-13

    The image in all of the examples except the last one is a TouchImageView with the following attributes:

        <com.example.TouchImageView
            android:id="@+id/activity_image_overlay"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="16dp"
            android:background="#f00"/>
    
    opened by adamsp 19
  • Using TouchImageView with Glide library

    Using TouchImageView with Glide library

    Hi, when I display the image using Glide library, I can't see the Image. However is I use setImageBitmap() method, the image is perfectly displayedwith all zoom capabilities.

    How can I use TouchImageView with Glide library?

    opened by niteshkhatri 17
  • Problem zooming within a ViewPager

    Problem zooming within a ViewPager

    Inside a "android.support.v4.view.ViewPager" i instantiate several layouts like this one ´´´ < LinearLayout xmlns:android='http://schemas.android.com/apk/res/android' android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" >

    < com.gilead.calculator.android.views.TouchImageView
        android:id="@+id/pag1"
        android:tag="article_image"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/pag1" />
    
    ´´´ After zooming and swiping the container page, if i swipe back to that zoomed image that image don't appear until zoom or other gesture on that image. Bug 
    opened by buguibu 16
  • Release notes improvements

    Release notes improvements

    Notes

    • Please label this PR with the enhancement label

    Changes

    Screenshots

    The look should be identical: | Original | New | |--------|-------| | Screenshot 2021-03-27 at 23 28 08 | Screenshot 2021-03-27 at 23 39 05 |

    Proposal

    • Do not run build for all variants on the release to decrease the build time
    enhancement 
    opened by emartynov 14
  • Crashing during load large bitmap

    Crashing during load large bitmap

    java.lang.RuntimeException: at android.graphics.RecordingCanvas.throwIfCannotDraw (RecordingCanvas.java:281) at android.graphics.BaseRecordingCanvas.drawBitmap (BaseRecordingCanvas.java:91) at android.graphics.drawable.BitmapDrawable.draw (BitmapDrawable.java:548) at android.widget.ImageView.onDraw (ImageView.java:1434) at com.ortiz.touchview.TouchImageView.onDraw (TouchImageView.kt: 284) at android.view.View.draw (View.java:23191) at android.view.View.updateDisplayListIfDirty (View.java:22066) at android.view.View.draw (View.java:22921) at android.view.ViewGroup.drawChild (ViewGroup.java:5230) at android.view.ViewGroup.dispatchDraw (ViewGroup.java:4987)

    opened by soura216 13
  • New TouchImageView with Universal Image Loader

    New TouchImageView with Universal Image Loader

    Until now I was using a old version of TouchImageView. I was using it with Universal Image Loader:

    String[] images --> URLs Images

    imageView = (TouchImageView) imageLayout.findViewById(R.id.imagenFullScreen); imageLoader.displayImage(images[position], imageView, options, new SimpleImageLoadingListener()...

    How I can implement your new code with my current code? Thanks

    opened by christian160984 12
  • Image got invisible after dragging other view

    Image got invisible after dragging other view

    Hey Mike, I am using your Imageview class in my project all gesture working properly but when i am trying to drag other view on image view , image view getting invisible or null ? so do you have any solution for this ?

    Bug 
    opened by ghost 12
  • Glide and insert into TouchImageView (with solution)

    Glide and insert into TouchImageView (with solution)

    I have been trying to use glide in my app, but it won't load any images:

    Glide.with(this).load(urinormal).into(exampleTouchImageView);
    

    before that I was using this code which worked fine:

    exampleTouchImageView.setImageURI(urinormal);
    

    Using Glide with a normal ImageView also works, but I need zooming.

    I also tried putting it into a bitmap, but I couldn't do that on the main thread and AsyncTasks get buggy here as I have a ViewPager.

    opened by ImageViewGlide 11
  • zoomed image gets invisible when nearby adview refreshes

    zoomed image gets invisible when nearby adview refreshes

    When using the TouchImageView and also having an AdView in the same Activity, then the following happens: If the image has been zoomed, and the AdView initially loads its ad or refreshes it, then zoomed image will completely disapear. If the image has not been zoomed by the user, it will stay visible.

    I've debugged this a bit and found out, that the gesture listener and all that stuff still works fine (even though there is no image being displayed).

    opened by ghost 11
  • Show full size image on startup

    Show full size image on startup

    Hello,

    I am currently working on a program that will show up an imagedialog showing part of an image with multitouch. I want the imagedialog to show the image fullsize initially and the ability to zoom out/drag to look at the other parts. I can't seem to change it to do this.Is this possible?

    Question 
    opened by 89jd 11
  • Add shape outlined image example

    Add shape outlined image example

    As promised!

    Here is an example of how to change border shape with the Outline.

    Please review!

    Changes

    • Add launch of the activity with new example
    • Show how to round corners with Outline
    • Add screenshot test

    Screenshot

    Screenshot_1615891594

    opened by emartynov 10
  • Bump junit-ktx from 1.1.4 to 1.1.5

    Bump junit-ktx from 1.1.4 to 1.1.5

    Bumps junit-ktx from 1.1.4 to 1.1.5.

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    dependencies java 
    opened by dependabot[bot] 0
  • adjustViewBounds = true not work

    adjustViewBounds = true not work

    The below code Image shows a full screen with and height

     <androidx.appcompat.widget.AppCompatImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true" />
    

    after a change to touchImageview

    <com.ortiz.touchview.TouchImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true" />
    

    Image only full height, not full width screen

    how to fix this, please help me. image2 image3

    opened by phanvandinh 1
  • I don't know how this app will work

    I don't know how this app will work

    I wish somethings works with me when I download App from Github from the first-time

    For this app in build.grade, when inspecting the code

    doFirst { new File(reportsDirectory).mkdirs() } Can't resolve the Symbol File and hundreds of other errors.

    opened by nburno 2
  • The TouchImageView is not correctly wrapped vertically when wrap content is used.

    The TouchImageView is not correctly wrapped vertically when wrap content is used.

    Same issue as #256

    I am trying to wrap the TouchImageView with a border but there is an unpredictable artificial space at the top and bottom of the image when I use wrap_content for height. Layout inspector is showing the empty space belongs to the TouchImageView. it seems like adjustViewBounds = true is not applied. The problem is illustrated below. The image with the correctly wrapped view is using the AppCompatImageView, the other one uses TouchImageView. I am aware that TouchImageView extends AppCompatImageView so I guess the issue is somewhere in the additional code handling image resizing in TouchImageView. TouchImageView AppCompatImageView

    Changing the view type below to TouchImageView breaks it.

    <androidx.appcompat.widget.AppCompatImageView
                        android:id="@+id/iv_test"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="16dp"
                        android:layout_marginTop="16dp"
                        android:layout_marginEnd="16dp"
                        android:layout_marginBottom="16dp"
                        android:adjustViewBounds="true"
                        android:scaleType="fitCenter"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>
    
    opened by AndroidPat 5
Releases(3.2.1)
Owner
Michael Ortiz
Michael Ortiz
Custom shaped android imageview components

Shape Image View Provides a set of custom shaped android imageview components, and a framework to define more shapes. Implements both shader and bitma

Siyamed SINIR 2.6k Jan 8, 2023
Android ImageView that handles animated GIF images

GifImageView Android ImageView that handles Animated GIF images Usage In your build.gradle file: dependencies { compile 'com.felipecsl:gifimageview:

Felipe Lima 1.1k Dec 27, 2022
Android ImageView that supports different radii on each corner.

SelectableRoundedImageView Note that this project is no longer maintained. Android ImageView that supports different radii on each corner. It also sup

Joonho Kim 1.1k Nov 25, 2022
A fast ImageView that supports rounded corners, ovals, and circles.

RoundedImageView A fast ImageView (and Drawable) that supports rounded corners (and ovals or circles) based on the original example from Romain Guy. I

Vince Mi 6.4k Jan 8, 2023
An imageView can auto scroll with device rotating.

PanoramaImageView An imageView can auto scroll with device rotating. ScreenShots Include PanoramaImageView to Your Project With gradle: dependencies {

郭佳哲 2.2k Dec 26, 2022
An image loading and caching library for Android focused on smooth scrolling

Glide | View Glide's documentation | 简体中文文档 | Report an issue with Glide Glide is a fast and efficient open source media management and image loading

Bump Technologies 33.2k Jan 7, 2023
Android Asynchronous Networking and Image Loading

Android Asynchronous Networking and Image Loading Download Maven Git Features Kotlin coroutine/suspend support Asynchronously download: Images into Im

Koushik Dutta 6.3k Dec 27, 2022
A powerful image downloading and caching library for Android

Picasso A powerful image downloading and caching library for Android For more information please see the website Download Download the latest AAR from

Square 18.4k Jan 6, 2023
Powerful and flexible library for loading, caching and displaying images on Android.

Universal Image Loader The great ancestor of modern image-loading libraries :) UIL aims to provide a powerful, flexible and highly customizable instru

Sergey Tarasevich 16.8k Jan 8, 2023
An Android library for managing images and the memory they use.

Fresco Fresco is a powerful system for displaying images in Android applications. Fresco takes care of image loading and display, so you don't have to

Facebook 16.9k Jan 8, 2023
Image loading for Android backed by Kotlin Coroutines.

An image loading library for Android backed by Kotlin Coroutines. Coil is: Fast: Coil performs a number of optimizations including memory and disk cac

Coil 8.8k Jan 8, 2023
An Android view for displaying repeated continuous side scrolling images. This can be used to create a parallax animation effect.

Scrolling Image View An Android view for displaying repeated continuous side scrolling images. This can be used to create a parallax animation effect.

Q42 1.8k Dec 27, 2022
Photo picker library for android. Let's you pick photos directly from files, or navigate to camera or gallery.

ChiliPhotoPicker Made with ❤️ by Chili Labs. Library made without DataBinding, RxJava and image loading libraries, to give you opportunity to use it w

Chili Labs 394 Jan 2, 2023
:ribbon: The simple way to implement a beautiful ribbon with the shimmering on Android.

AndroidRibbon ?? The simple way to implement a beautiful ribbon with the shimmering on Android. 中文語 Download Gradle Add below codes to your root build

Jaewoong Eum 653 Jan 7, 2023
An Android transformation library providing a variety of image transformations for Glide.

Glide Transformations An Android transformation library providing a variety of image transformations for Glide. Please feel free to use this. Are you

Daichi Furiya 9.7k Dec 30, 2022
An android image compression library.

Compressor Compressor is a lightweight and powerful android image compression library. Compressor will allow you to compress large photos into smaller

Zetra 6.7k Jan 9, 2023
An Android transformation library providing a variety of image transformations for Picasso

Picasso Transformations An Android transformation library providing a variety of image transformations for Picasso. Please feel free to use this. Are

Daichi Furiya 1.7k Jan 5, 2023
Media Picker is an Android Libary that lets you to select multiple images or video

Media Picker Please let me know if your application go to production via this link Media Picker is an Android Libary that lets you to select multiple

Abdullah Alhazmy 264 Nov 10, 2022
Library to handle asynchronous image loading on Android.

WebImageLoader WebImageLoader is a library designed to take to hassle out of handling images on the web. It has the following features: Images are dow

Alexander Blom 102 Dec 22, 2022