Centering a UIViewController within a UIScrollView

Hello everyone,

I am currently following this tutorial on YouTube describing how to create a SnapChat like menu for your applications. I am running into some difficulty in trying to center my nested UIViewController within my UIScrollView.

Within the first couple of minutes of the video, the creator shows how you can create a UIViewController, change its .xib file background to Green, and then add it as a subview of the UIScrollView. Only after adding a few lines of code and then running the application, you can see how his underlying UIViewController is centered within the UIScrollView.

I have followed his exact instructions and end up with a nested UIViewController that is off-centered and shifted about 25% up the screen. Here is a screenshot:

Here is also the code I have written thus far:

using System;
using CoreGraphics;
using UIKit;

namespace Test2.iOS
{
    public partial class ViewController : UIViewController
    {
        public ViewController(IntPtr handle) : base(handle)
        {

        }

        public override void ViewDidLoad()
        {
            base.ViewDidLoad();

            // Perform any additional setup after loading the view, typically from a nib.
            var m = new Menu();

            this.AddChildViewController(m);
            this.mainScrollView.AddSubview(m.View);
            m.DidMoveToParentViewController(this);
        }

        public override void DidReceiveMemoryWarning()
        {
            base.DidReceiveMemoryWarning();
            // Release any cached data, images, etc that aren't in use.     
        }
    }
}

Menu is a custom UIViewController class that I have created with the only change being a color of Green applied to its .xib file background.

Any ideas as to how I can center my UIViewController? Can someone offer me some intuition as to why this may be occurring?

Thank you to all

Best Answer

Answers

  • TedRogersTedRogers USMember ✭✭✭✭

    I am assuming you are using auto layout since that is in your Tag. Your code is not setting up any constraints. You could put that subview wherever you want if you setup the constraints properly. Do it right after you add the sub view.

  • RafaelNegronRafaelNegron USMember

    I'm sorry but I'm not quite sure what you mean. If I set up my own Auto Layout constraints within the designer, are they supposed to show up in my code?

  • RafaelNegronRafaelNegron USMember
    edited March 21

    @JGoldberger

    I understand what you mean now. I know I have to make at least 4 different constraints for my subview which are:

    • Center Horizontally in Container
    • Center Vertically in Container
    • Equal Widths
    • Equal Heights

    Any idea on how I can accomplish this quickly using the suggested article? Just asking in case you already know how to do this off the top of your head.

  • JGoldbergerJGoldberger USXamarin Team, University Xamurai

    Hard to say without seeing your xib. This code would seem to at least be setting the centers to be the same:
    m.View.Center = this.View.Center;
    so there may be some intrinsic size happening where the Menu view controller's view is set to the full size of the screen.

    Also the ContentSize property of a scroll view should be set to the full size of the view that is the direct child of the scroll view, so this would seem more appropriate:

    this.mainScrollView.ContentSize = new CGSize(m.View.Frame.Size.Width, m.View.Frame.Height);
    
Sign In or Register to comment.