B4A Library [B4X] ZoomImageView - Cross platform zoomable + pannable image view

A custom view that shows an image and allows the user to zoom and pan the image.

Instructions:
- Add with designer.
- Call SetBitmap.

Updates:

v1.05 - Base_Resize is public. Call it after resizing the view in B4A.
v1.04 - Fixes an issue in B4i where the image jumps when switching from pinch gesture to pan gesture.
v1.03 - Fixes an issue with the click event.
v1.02 - Removed the loading of Picture1.png which was left by mistake.
v1.01 - Fixes an issue with old Android devices.

More sophisticated view that can handle huge images: https://www.b4x.com/android/forum/threads/b4x-hugeimageview-show-very-large-images.132905/#content

Tip: simplest way to add ZoomImageView is with SMM: [B4X] SimpleMediaManager (SMM) - framework for images, videos and more

 

[omo]

Is any method missing out in this library? I tried attached example out twice with 7/13 and 7/15 uploads but generated the same error on real-device and emulator. Am i missing something at my end? Here is my log:

Spoiler: Is setQuickScaleEnable method missing in this library?

*** Service (starter) Create ***
** Service (starter) Start **
** Activity (main) Create, isFirst = true **
zoomimageview_designercreateview (java line: 151)
java.lang.RuntimeException: Method: setQuickScaleEnabled not found in: android.view.ScaleGestureDetector
at anywheresoftware.b4j.object.JavaObject$MethodCache.getMethod(JavaObject.java:366)
at anywheresoftware.b4j.object.JavaObject.RunMethod(JavaObject.java:119)
at b4a.example.zoomimageview._designercreateview(zoomimageview.java:151)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:213)
at anywheresoftware.b4a.objects.CustomViewWrapper.AfterDesignerScript(CustomViewWrapper.java:67)
at anywheresoftware.b4a.keywords.LayoutBuilder.loadLayout(LayoutBuilder.java:162)
at anywheresoftware.b4a.objects.PanelWrapper.LoadLayout(PanelWrapper.java:134)
at anywheresoftware.b4a.objects.B4XViewWrapper.LoadLayout(B4XViewWrapper.java:311)
at b4a.example.b4xmainpage._b4xpage_created(b4xmainpage.java:39)
at b4a.example.b4xmainpage.callSub(b4xmainpage.java:72)
at anywheresoftware.b4a.keywords.Common.CallSub4(Common.java:1066)
at anywheresoftware.b4a.keywords.Common.CallSubNew2(Common.java:1037)
at b4a.example.b4xpagesmanager._createpageifneeded(b4xpagesmanager.java:497)
at b4a.example.b4xpagesmanager._showpage(b4xpagesmanager.java:799)
at b4a.example.b4xpagesmanager._addpage(b4xpagesmanager.java:197)
at b4a.example.b4xpagesmanager._addpageandcreate(b4xpagesmanager.java:204)
at b4a.example.b4xpagesmanager._initialize(b4xpagesmanager.java:680)
at b4a.example.main._activity_create(main.java:360)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:213)
at b4a.example.main.afterFirstLayout(main.java:105)
at b4a.example.main.access$000(main.java:17)
at b4a.example.main$WaitForLayout.run(main.java:83)
at android.os.Handler.handleCallback(Handler.java:605)
at android.os.Handler.dispatchMessage(Handler.java:92)
at android.os.Looper.loop(Looper.java:137)
at android.app.ActivityThread.main(ActivityThread.java:4424)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:784)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:551)
at dalvik.system.NativeStart.main(Native Method)

 

[vecino]

The example works well for me, except that you have to change the images, which are assigned incorrectly.

 

[omo]

The example works well for me, except that you have to change the images, which are assigned incorrectly.

This example is not working for me, i don't know why. I tried it again after your message, but i am still having the same error. I am using android 9 and Youwave emulator. Below is the screenshot of library used, but still having the same errors linked above

Am i still missing something?

 

[asales]

Am i still missing something?

Your Android SDK is up to date?

 

[omo]

Your Android SDK is up to date?

I am still using android SDk-28 also targeted by Erel in that example: <uses-sdk android:minSdkVersion="5" android:targetSdkVersion="28"/> and jdk-11.0.1

 

[asales]

I am still using android SDk-28 also targeted by Erel in that example: <uses-sdk android:minSdkVersion="5" android:targetSdkVersion="28"/> and jdk-11.0.1

Not your SDK target in manifest. Your Android SDK.
Check the menu: Tools / SDK Manager.
Make a copy of the Android SDK folder before update the recommended items.

 

[omo]

Not your SDK target in manifest. Your Android SDK.
Check the menu: Tools / SDK Manager.
Make a copy of the Android SDK folder before update the recommended items.

Ok, thanks Asales, that may be the reason, i tried updating it 2-weeks ago, but i am not sure i finished it successfully due to other issues of the moment then
?

 

[Erel]

v1.01 - Fixes an issue with old Android devices.

 

[omo]

v1.01 - Fixes an issue with old Android devices.

Ok, Thanks, this v1.01 now fixes the problem, but first generated another errors that it coundn't found picture1.png and later was looking for world-physical-map-mercator.jpg. I replaced the two files in the asset folder; so now it works well on my emulator and device

Thanks, Erel, Asales and Vecino
Regards

 

[Erel]

I've updated the example.

 

[Biswajit]

Due to this following line, if you don't have an image named Picture1.png in your assets folder this library is crashing the app,

Public Sub DesignerCreateView (Base As Object, Lbl As Label, Props As Map)
    mBase = Base
    Tag = mBase.Tag
....
....
....
    no.RunMethod("addGestureRecognizer:", Array(nme.RunMethod("CreateRecognizer", Null)))
    #end if
    SetBitmap(xui.LoadBitmap(File.DirAssets, "Picture1.png")) '<- this line
End Sub

 

[Erel]

v1.02 - Removed the loading of Picture1.png which was left by mistake.

 

[omo]

Due to this following line, if you don't have an image named Picture1.png in your assets folder this library is crashing the app,

Public Sub DesignerCreateView (Base As Object, Lbl As Label, Props As Map)
    mBase = Base
    Tag = mBase.Tag
....
....
....
    no.RunMethod("addGestureRecognizer:", Array(nme.RunMethod("CreateRecognizer", Null)))
    #end if
    SetBitmap(xui.LoadBitmap(File.DirAssets, "Picture1.png")) '<- this line
End Sub

Ok, thank you Biswajit, noted, although, I provided the picture since, but I will have to modify the code or keep managing it till Erel correct that in next version

 

[omo]

Ok

v1.02 - Removed the loading of Picture1.png which was left by mistake.

Ok, thank you, Erel. Noted!

 

[Erel]

v1.03 - Fixes an issue with the click event.

 

[Erel]

v1.04 - Fixes an issue in B4i where the image jumps when switching from pinch gesture to pan gesture.

 

[Erel]

v1.05 - Base_Resize is public. Call it after resizing the view in B4A.

 

[Peter Simpson]

Nice one @Erel.
I found ZoomImageView last night and decided to implement it into one of my clients Android powered 2D laser barcode apps (thank you @DonManfred for wrapping the library 2 years ago for me ?). I was previously using another slightly more complicated solution, but this solution works ?% perfect and is extremely simple to use.

I will be using ZoomImageView in future apps that needs this feature, and in all my bespoke Android 2D laser barcode apps.

Thank you ?

 

[Erel]

Worth adding that ZoomImageView is now also available with SimpleMediaManager (SMM). Using SMM is the simplest way to show many types of media and it does it in a very efficient way.