UIImageView erroneously moves up in parent when clicked on - ios

Question

I have an ImageViewController that presents an ImageZoomView (which currently doesn't zoom yet, but it will soon). When I tap on the image, the entire image will shift upwards slightly. This should not happen, the image should stay in it's place until a user swipes or pinches.
The ImageViewController lives inside a UIPageViewController that allows swiping between views. However, the only issue I have is with the ImageViewController (i.e. the VideoViewController and PdfViewController both work fine and do not shift upwards on a tap)
ImageZoomView is a UIScrollView with a UIImageView as it's child control.
ImageZoomView:
public class ImageZoomView : UIScrollView
{
private UIImage _image;
private UIImageView _imageView;
public ImageZoomView()
{
_imageView = new UIImageView
{
ContentMode = UIViewContentMode.ScaleAspectFill
};
AutoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
ClipsToBounds = true;
AddSubview(_imageView);
}
public int Index { get; set; }
public override void LayoutSubviews()
{
base.LayoutSubviews();
var imageWidth = Bounds.Width;
_imageView.Frame = new CGRect(
Bounds.Left, Bounds.Top,
imageWidth, imageWidth / _image.Size.Width * _image.Size.Height);
ContentSize = _imageView.Bounds.Size;
}
public void DisplayImage(UIImage image)
{
_image = image;
_imageView.Image = image;
}
}
ImageViewController:
public class ImageViewController : AssetViewController
{
private ImageZoomView _imageView;
public ImageViewController(int index, Media media) : base(index, media) { }
public override void ViewDidLayoutSubviews()
{
base.ViewDidLayoutSubviews();
_imageView.Frame = View.Bounds;
}
public override void LoadView()
{
_imageView = new ImageZoomView()
{
Index = Index,
BackgroundColor = UIColor.White,
};
_imageView.DisplayImage((_media as LocalMedia<UIImage>).Resource);
View = _imageView;
}
}
AssetViewController:
public abstract class AssetViewController : UIPageViewController
{
protected Media _media;
public AssetViewController(int index, Media media)
{
_media = media;
Index = index;
View.BackgroundColor = Globals.ColorDark;
}
public int Index { get; set; }
public Media CurrentMedia { get { return _media; } }
}

Answer 1

Few things causing problems
All your controllers are derived from UIPageViewController. The content controllers should not be derived from UIPageViewController
In ImageViewController the code View = _imageView; substitutes main View of controller to ScrollView. I suggest to use AddSubview(_imageView); What I saw that this erroneous movement shifts not the scroll view but somehow view of the whole controller.
LayoutSubviews is called pretty often and calculates the same thing all the time as neither image size nor scroll bounds are changing.
Below suggested improvements.
ImageViewController is content controller inside PageViewController and ImageZoomView is the scroll view inside ImageViewController
PageViewController
public partial class PageViewController : UIPageViewController
{
public PageViewController(IntPtr handle) : base(handle)
{
}
public override void ViewDidLoad()
{
base.ViewDidLoad();
List<ImageViewController> pages = new List<ImageViewController>();
UIStoryboard board = UIStoryboard.FromName("Main", null);
for (int i = 0; i < 3; i++)
{
ImageViewController ctrl = (ImageViewController)board.InstantiateViewController("imageControllerStoryboardID");
ctrl.Index = i;
pages.Add(ctrl);
}
DataSource = new PageDataSource(pages);
View.Frame = View.Bounds;
//Set the initial content (first page)
SetViewControllers(new UIViewController[] { pages[0] }, UIPageViewControllerNavigationDirection.Forward, false, s => { });
}
}
public class PageDataSource : UIPageViewControllerDataSource
{
List<ImageViewController> pages;
public PageDataSource(List<ImageViewController> pages)
{
this.pages = pages;
}
override public UIViewController GetPreviousViewController(UIPageViewController pageViewController, UIViewController referenceViewController)
{
var currentPage = referenceViewController as ImageViewController;
if (currentPage.Index == 0)
{
return pages[pages.Count - 1];
}
else
{
return pages[currentPage.Index - 1];
}
}
override public UIViewController GetNextViewController(UIPageViewController pageViewController, UIViewController referenceViewController)
{
var currentPage = referenceViewController as ImageViewController;
return pages[(currentPage.Index + 1) % pages.Count];
}
}
ImageViewController
public partial class ImageViewController : UIViewController
{
public int Index;
private ImageZoomView _imageView;
public ImageViewController (IntPtr handle) : base (handle)
{
}
public override void ViewDidLoad()
{
base.ViewDidLoad();
_imageView = new ImageZoomView(UIImage.FromFile("MergedImage.png"), View.Frame)
{
Index = Index,
BackgroundColor = UIColor.Blue,
};
View.AddSubview(_imageView);
}
}
ImageZoomView
public class ImageZoomView : UIScrollView
{
private UIImage _image;
private UIImageView _imageView;
public ImageZoomView(UIImage image, CGRect frame):base()
{
_imageView = new UIImageView
{
ContentMode = UIViewContentMode.ScaleAspectFill,
};
_image = image;
_imageView.Image = image;
Frame=_imageView.Frame = frame;
AutoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
ClipsToBounds = true;
AddSubview(_imageView);
ContentSize = new CGSize(Frame.Width, Frame.Width / _image.Size.Width * _image.Size.Height);
_imageView.Center = new CGPoint(ContentSize.Width / 2, ContentSize.Height / 2);
}
public int Index { get; set; }
}
There are still some code left from original sample as unused Index field and private _image variables. May be useful in the future, so I kept them around