B4i Library Zoomable ImageView

Discussion in 'iOS Libraries' started by narek adonts, Jun 17, 2015.

  1. narek adonts

    narek adonts Well-Known Member Licensed User

    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
     

    Attached Files:

  2. mcGeorge

    mcGeorge Member Licensed User

    5 minutes and it works, great!
    Thanks narek.
     
  3. Luiz Fernando Orlandini

    Luiz Fernando Orlandini Active Member Licensed User

    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?
     
  4. Luiz Fernando Orlandini

    Luiz Fernando Orlandini Active Member Licensed User

    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.
     
  5. joilts

    joilts Member Licensed User

    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.
     
  6. narek adonts

    narek adonts Well-Known Member Licensed User

    didnt understood the question ?
     
    joilts likes this.
  7. joilts

    joilts Member Licensed User

  8. imbault

    imbault Well-Known Member Licensed User

    Thank Narek, I just needed that...
     
  9. mystic

    mystic Member Licensed User

    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, 
    00, 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.
     
  10. joilts

    joilts Member Licensed User

    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).
     
    Last edited: Jan 13, 2016
  11. androidtom

    androidtom Member Licensed User

    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.
     
  12. narek adonts

    narek adonts Well-Known Member Licensed User

    didnt understood the issue
     
  13. androidtom

    androidtom Member Licensed User

    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.
     
  14. narek adonts

    narek adonts Well-Known Member Licensed User

    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
     
  15. mystic

    mystic Member Licensed User

    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, 
    00, Main.TOTAL_WIDTH, Main.TOTAL_HEIGHT)

    Unfortunatly it wasnt the solution to my original problem.

    Again Thanks in Advance for any Possible help.
     
  16. narek adonts

    narek adonts Well-Known Member Licensed User


    I really dont understand what is not working.
     
  17. mystic

    mystic Member Licensed User

    Hi narek,

    my original post:
    I wasnt able to come up with a reason for this behavior so far.

    As Always thanks for helping.
     
  18. kreativa

    kreativa Member Licensed User

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

    kreativa Member Licensed User

    Hi narek
    why when i crop a portrait image i get a 90 degrees rotated image?
    How can i solve?
     
  20. Luiz Fernando Orlandini

    Luiz Fernando Orlandini Active Member Licensed User

    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.
     
Loading...