B4i Library Zoomable ImageView

mcGeorge · Jun 18, 2015

5 minutes and it works, great!
Thanks narek.

Luiz Fernando Orlandini · Jul 29, 2015

narek adonts said:
Hi All,

Please find attached a new Class which will allow to have Zoomable Images like in popular apps.

Please see the attached exemple.

If MinScale and MaxScale are not set the default values are Minscale to fit the View size and MaxScale is 1.

Please ask if you have any questions.

As the Upload limitations are not so high I can not upload an image with the example so you have to put your own.

Narek

Great job Narek.

I just found an issue that I'm trying to solve without success yet. When I use ZoomedImage Sub and set the image in another ImageView I get the image rotated.

Any idea?

Luiz Fernando Orlandini · Aug 7, 2015

narek adonts said:
Hi All,

Please find attached a new Class which will allow to have Zoomable Images like in popular apps.

Narek

Hi Narek,

this class works really well for landscape images, although when I pick a portrait image and use ZoomedImage method, I got the image rotated.

Can you help me with?

Looking for the code, something suggests that the problem is with the code below:

Code:

-(UIImage*)ImageInRect: (UIImage*)image :(CGRect)rect
{


UIImage * LandscapeImage = image;
UIImage * PortraitImage = [[UIImage alloc] initWithCGImage: LandscapeImage.CGImage
                                                     scale: 1.0
                                               orientation: UIImageOrientationLeft];
CGImageRef imageRef = CGImageCreateWithImageInRect([PortraitImage CGImage], rect);

UIImage *img = [UIImage imageWithCGImage:imageRef]; 


CGImageRelease(imageRef);

return img;
}

Thanks man.

joilts · Dec 15, 2015

Hi, is there a way to crop a specific area of the zoomed image? I've been looking some code example here in forum, but was unable to find.

narek adonts · Dec 15, 2015

didnt understood the question ?

joilts · Dec 17, 2015

narek adonts said:
didnt understood the question ?

What I was trying to ask, and was difficult to explain (sorry for that): https://www.b4x.com/android/forum/threads/crop-image-area-from-a-zoomed-pic.61386/
Opened an thread for that.

imbault · Dec 18, 2015

Thank Narek, I just needed that...

mystic · Jan 11, 2016

Hi narek,

first thanks for this great library.
It just happend that i have some problems with it.

I try to make an Zoomable Image in my App, using following code:

Code:

  If pg.IsInitialized = False Then
     pg.Initialize("pg")
     pg.Title = aTitle
   End If
   Main.NavControl.ShowPage(pg)
   pg.RootPanel.RemoveAllViews
   
   
   
   imgg.Initialize(modHTTP.fRX_Image)
   imgg.MaxScale = 10.0
   imgg.UnZOOMonDoubleTap = True
   imgg.AddToView(pg.RootPanel, 0, 0, pg.RootPanel.Width, pg.RootPanel.Height)

pg being the page
imgg being your class
fRX_Image being an Bitmap containing the Image

minScale i have left Default becouse i dont need smaler than View Image

If i start with this code, everything goas fine until i want to zoom.
The image is shown, and i can move around on it. (Image is bigger than Screen)
But the "Zoom" function only works very minimal (like ~5% missing at the edge on full zoom in).

I already tryed playing around with different values for Maxscale, minscale and scale ....
Maybe you have an Idea what i can try to fix this?

Already thanks in advance for any possible help.

joilts · Jan 12, 2016

mystic said:
But the "Zoom" function only works very minimal (like ~5% missing at the edge on full zoom in).

I already tryed playing around with different values for Maxscale, minscale and scale ....
Maybe you have an Idea what i can try to fix this?

I think I had a similar situation, I don´t really know a lot about this lib, but in my case, minscale and maxscale were too close (almost the same), when using iPad. At iPhone 4, I had no problem. I used default maxscale.

That's how I initiate minscale:

Code:

imgZoom.MinScale=Min(imZoom.Width/imZoom.Bitmap.Width,imZoom.Height/imZoom.Bitmap.Height)

Using iPad it was bigger than default maxscale (1).
If you do not define minscale, I think it is calculated as

Code:

Dim f As Float=Max(sc.Width/iv.Bitmap.Width,sc.Height/iv.Bitmap.Height)

To fix it, I have changed maxscale to a bigger value (10 times minscale).

androidtom · Jan 21, 2016

Thanks Narek, great class. If I start an image with the top edge 50% down the page is there a way to move the image to the top? For example I have a thumbnail located after some descriptive text. If I pinch-zoom the thumbnail it zooms correctly but I can't move it to the top of the screen.

narek adonts · Jan 22, 2016

androidtom said:
Thanks Narek, great class. If I start an image with the top edge 50% down the page is there a way to move the image to the top? For example I have a thumbnail located after some descriptive text. If I pinch-zoom the thumbnail it zooms correctly but I can't move it to the top of the screen.

didnt understood the issue

androidtom · Jan 22, 2016

The issue is I am looking for a way to move the image around on the screen . Pinch and zoom works excellent but I also want to move the imagezoom view on the screen.

narek adonts · Jan 25, 2016

androidtom said:
The issue is I am looking for a way to move the image around on the screen . Pinch and zoom works excellent but I also want to move the imagezoom view on the screen.

I am note sure but if I understood correctly you have to change the insets of the scrollview.
But anyway I dont understand the effect that you wanr to achive

mystic · Feb 4, 2016

Hi again,

first i whould like to thank joilts.

What he pointed out was indeed something i hadnt checked before.
I had adjusted my code slightly to prevent the situation joilts mentioned,
aswell as some Sizing problems that had occured.

New code:

Code:

  If pg.IsInitialized = False Then
     pg.Initialize("pg")
     pg.Title = aTitle
   End If
   Main.NavControl.ShowPage(pg)
   pg.RootPanel.RemoveAllViews
   
   imgg.Initialize(modHTTP.fRX_Image)
   imgg.MinScale = 1
   imgg.MaxScale = 10 * imgg.MinScale
   imgg.UnZOOMonDoubleTap = True
   
   imgg.AddToView(pg.RootPanel, 0, 0, Main.TOTAL_WIDTH, Main.TOTAL_HEIGHT)

Unfortunatly it wasnt the solution to my original problem.

Again Thanks in Advance for any Possible help.

narek adonts · Feb 4, 2016

mystic said:
Hi again,

first i whould like to thank joilts.

What he pointed out was indeed something i hadnt checked before.
I had adjusted my code slightly to prevent the situation joilts mentioned,
aswell as some Sizing problems that had occured.

New code:

Code:

If pg.IsInitialized = False Then pg.Initialize("pg") pg.Title = aTitle End If Main.NavControl.ShowPage(pg) pg.RootPanel.RemoveAllViews imgg.Initialize(modHTTP.fRX_Image) imgg.MinScale = 1 imgg.MaxScale = 10 * imgg.MinScale imgg.UnZOOMonDoubleTap = True imgg.AddToView(pg.RootPanel, 0, 0, Main.TOTAL_WIDTH, Main.TOTAL_HEIGHT)

Unfortunatly it wasnt the solution to my original problem.

Again Thanks in Advance for any Possible help.

I really dont understand what is not working.

mystic · Feb 8, 2016

narek adonts said:
I really dont understand what is not working.

Hi narek,

my original post:

mystic said:
If i start with this code, everything goas fine until i want to zoom.
The image is shown, and i can move around on it. (Image is bigger than Screen)
But the "Zoom" function only works very minimal (like ~5% missing at the edge on full zoom in).

I already tryed playing around with different values for Maxscale, minscale and scale ....
Maybe you have an Idea what i can try to fix this?

I wasnt able to come up with a reason for this behavior so far.

As Always thanks for helping.

kreativa · Feb 14, 2016

Luiz Fernando Orlandini said:
Great job Narek.

I just found an issue that I'm trying to solve without success yet. When I use ZoomedImage Sub and set the image in another ImageView I get the image rotated.

Any idea?

Hi i have the some problem. Did you solve it?

kreativa · Feb 14, 2016

narek adonts said:
Hi All,

Please find attached a new Class which will allow to have Zoomable Images like in popular apps.

Please see the attached exemple.

If MinScale and MaxScale are not set the default values are Minscale to fit the View size and MaxScale is 1.

Please ask if you have any questions.

As the Upload limitations are not so high I can not upload an image with the example so you have to put your own.

Narek

Hi narek
why when i crop a portrait image i get a 90 degrees rotated image?
How can i solve?

Luiz Fernando Orlandini · Jun 26, 2016

kreativa said:
Hi narek
why when i crop a portrait image i get a 90 degrees rotated image?
How can i solve?

I played a lot with that and I found the same issue. I did some tweaks on the code, trying to reset some properties that iOS set into the image, but until now, no success at all.

Hoping to have someone with a solution to that as well.

B4i Library Zoomable ImageView

Attachments

Member

Active Member

Active Member

Member

Well-Known Member

Member

Well-Known Member

Member

Member

Member

Well-Known Member

Member

Well-Known Member

Member

Well-Known Member

Member

Member

Member

Active Member

Similar Threads