CODEWITHSUNDEEP
iosobjective-cxamarin.ios
user1060500
user1060500

Reputation: 1535

Image Not Centering In ScrollView after Zoom

I am trying to centre an imgView inside a scrollView so that when I zoom in, it will remain centred properly (like the photos app).

When the screen first loads, it is centred ok. When I pinch and start to zoom, the position adjusts itself so the image is no longer centred. See before and after pinch/zoom photos. The red is the background color of the scrollview.

Before Zoom

After Zoom

Here is the code I am using to create the imgView and Center it within the scroll view. (MonoTouch, but should translate over to Obj-C easy)

private void LoadPageContent(int page) { //TODO: Code to put here to load image or whateer you want to display on this panel/page

        //Each page will have it's own scrollview for scrolling and zooming that image on the page
        var panelScrollView = new UIScrollView();
        _panels.Add (panelScrollView);

        panelScrollView.CanCancelContentTouches=false;
        panelScrollView.ClipsToBounds = true; 

        panelScrollView.MinimumZoomScale = 1f;
        panelScrollView.MaximumZoomScale = 50.0f;
        panelScrollView.MultipleTouchEnabled = true;

        panelScrollView.ScrollEnabled = true;
        panelScrollView.UserInteractionEnabled=true;
        var ui = new UIImage (_assetImages[page], 1.0f, UIImageOrientation.Up);

        UIImageView imgView = new UIImageView(ui);


        panelScrollView.Frame = new RectangleF(scrollView.Frame.Width * (_numberOfPanels - 1),
                                               0,
                                               _pageWidthPortrait,
                                               scrollView.Frame.Height);


        panelScrollView.BackgroundColor = UIColor.Red;

        //scale down image to get proper fitted imgview dimensions
        float nPercentW = (panelScrollView.Frame.Width / (float)imgView.Image.Size.Width);
        float nPercentH = (panelScrollView.Frame.Height / (float)imgView.Image.Size.Height);
        float newPercent;
        if (nPercentH >= nPercentW)
        {
            //wider than it is tall
            newPercent = nPercentW;
        }
        else{
            //taller than it is wide..
            newPercent = nPercentH;
        }
        int newWidth1 = Convert.ToInt32(imgView.Image.Size.Width * newPercent);
        int newHeight = Convert.ToInt32(imgView.Image.Size.Height * newPercent);

        panelScrollView.ViewForZoomingInScrollView += (UIScrollView sv) => { 
            return imgView; 
        };

        imgView.Frame = new RectangleF(0,0,newWidth1, newHeight);
        imgView.Center = new PointF(panelScrollView.Frame.Width /2,
                                    (panelScrollView.Frame.Height/2));


  //ScaleToFill and ScaleAspect fit - i used scaleaspectfit and it had the same problem
  //I tried scaletofill but resizing the imgView to fit the proper view dimensions so it is like an aspect fit, but same problem
        imgView.ContentMode=UIViewContentMode.ScaleToFill;//ScaleAspectFit;
        imgView.UserInteractionEnabled=true;

        panelScrollView.ContentSize = imgView.Image.Size;


        panelScrollView.DidZoom += (object sender, EventArgs e) => {

    };

    panelScrollView.AddSubview(imgView);
    scrollView.AddSubview(panelScrollView);


    }

Upvotes: 0

Views: 1294

Answers (1)

fibnochi
fibnochi

Reputation: 1113

This is working fine for me

- (void)centerScrollViewContents {

CGSize boundsSize = ScrollView.bounds.size;
CGRect contentsFrame = ImageView.frame;

if (contentsFrame.size.width < boundsSize.width) {
    contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0f;
} else {
    contentsFrame.origin.x = 0.0f;
}

if (contentsFrame.size.height < boundsSize.height) {
    contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2.0f;
} else {
    contentsFrame.origin.y = 0.0f;
}

ImageView.frame = contentsFrame;

}

You have to call this method in 

- (void)scrollViewDidZoom:(UIScrollView *)scrollView

Upvotes: 2

Related Questions