UIScrollView not scrolling when add constrains for UIPageControl in iOS

Question

I have 1 UIPageControl and 1 UIScrollView . When I set constrains for UIPageControl , my UIScrollView cannot scroll. This is my code:

//set contentsize for uiscrollview
[self.scrollView setContentSize:CGSizeMake(320,  1440)];

UIPageControl *imagePVControl = self.imagePVControl;
[imagePVControl setTranslatesAutoresizingMaskIntoConstraints:NO];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[imagePVControl]-0-|"
                                                                  options:0  
                                                                  metrics:nil 
                                                                    views:NSDictionaryOfVariableBindings(imagePVControl)]];

When I use [imagePVControl setTranslatesAutoresizingMaskIntoConstraints:NO]; the scrollview cannot scroll , but if I use [imagePVControl setTranslatesAutoresizingMaskIntoConstraints:YES]; , my scrollview can srcoll . Can you please help me to fix this issue. Thanks.

Also, my XIB is uncheck "Use Autolayout"" .

UPDATE

I change to my code as below. The UIScrollview can scroll but the UIPageControl is aligned in the center not the left. I want to algin the UIPageControl in the left but it is not successful. Please help me to correct it. Thanks

NSDictionary *views = @{@"ScrollImageView":self.scrollViewImage,@"TableView":self.productDetailTable,@"InfoView":self.infoView};

            NSDictionary *metrics = @{ @"ScrollImageheight" : ScrollImage_height,@"Tablewidth" : width, @"Tableheight" : Table_height,@"infoViewheight" : InfoView_height,@"infoViewWidth" : InfoView_width};

            [self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[TableView(Tablewidth)]-0-|" options:0 metrics:metrics views:views]];

            [self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[InfoView(infoViewWidth)]-0-|" options:0 metrics:metrics views:views]];

            [self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[ScrollImageView(ScrollImageheight)]-0-[InfoView(infoViewheight)]-0-[TableView(Tableheight)]-|" options:0 metrics:metrics views:views]];


            [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[imagePVControl]-0-|" options:0  metrics:nil views:NSDictionaryOfVariableBindings(imagePVControl)]];

Answer 1

I am also struggling with constraints in the UIScrollView. What I learn recently is that, once you set TranslatesAutoresizingMaskIntoConstraints to NO, you will lose a lot of settings. Like contentSize and the frames of views inside the UIScrollView , that's weird. What I learnt is that if you want to add constraint to the views inside a UIScrollView , you have to set everything of whoseViews. In your case, I think you should try this way: [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[imagePVControl(320)]-0-|", options:0, metrics:nil, views:NSDictionaryOfVariableBindings(imagePVControl)]]; [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[imagePVControl(1440)]-0-|", options:0, metrics:nil, views:NSDictionaryOfVariableBindings(imagePVControl)]]; In these two constraints, I specify the top, bottom, left and right, besides that, I also set the width and the height of the imagePVControl The reason here is that, once you set the TranslatesAutoresizingMaskIntoConstraints to NO, you tell the computer that you are going to tell it how big the contentSize is, instead of setting the contentSize , you tell it all the information of the views inside the content. The main difference here is that UIScrollView does not have a fixed edge around it, so you can not set constraints as other kinds of UIView .

You could learn from this: https://developer.apple.com/library/ios/technotes/tn2154/_index.html Hope this help :)

After reviewing this problem, I found the problem. The way you treat with UIPageControl was right, you should add a few more code here. I assume that you have a UIView called myView in the top of the scrollview, and then you have a UITableView called myTable below myView. And you want to set myView 240 height, and myTable 1200 height. Then here is the code:

NSDictionary *viewsDic = NSDictionaryOfVariableBindings(myView, myTable);
[self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[myView(320)]-|", options:0, metrics:nil, views:viewDic]];
[self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[myTable(320)]-|", options:0, metrics:nil, views:viewDic]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[myView(240)]-[myTable(1200)]-|", options:0, metrics:nil, views:viewDic]];

The main reason is that you set a subview of the scrollView TranslatesAutoresizingMaskIntoConstraints to NO, this will make the contentSize unable to be manually set. So I give out the how big the content of scrollView will be, it automatically calculates the contentSize.

Answer 2

Why use constraints? why can't you setPagingEnabled:YES on UIScrollView and then place UIPageControl on top of your UIScrollView in the hierarchy?