Shehabic
Shehabic

Reputation: 6877

ScrollView with one child and AutoLayout not scrolling

I have a ViewController setup as follows:

enter image description here

This is a News app so everything is dynamically loaded, once I finish loading data into the Article Title, Article Content, and Image View (the Outer ScrollView) doesn't really scroll

I also checked the ContentView to get its size (just debugging) it gives height: 0px (Which is the height I initially set for it)

My Background is Android/Java for Mobile development so I set the height to 0, I'm not sure if there's something like "Wrap_Content" in android (-1: internal property value for android as an example).

And in all ways I want to find a way to make ContentView resize dynamically to include all the heights + spacing of its Child Views. and then the Scroll View will show a nice Scroll.

What I tried:

1-Set height of ContentView to e.g (1000) -> it made the ScrollView scroll normally (but such magical numbers are bad).

2-Tried the following code (once I finish loading data into the child views)

// Given that the references of the UI elements in my ViewController are:
// scrollView and contentView
- (void)updateScroll{
    self.scrollView.translatesAutoresizingMaskIntoConstraints = NO;
    self.contentView.translatesAutoresizingMaskIntoConstraints = NO;

    // Iterate over SubViews of ContentView
    for (UIView* subView in self.contentView.subviews) {
        subView.translatesAutoresizingMaskIntoConstraints = NO;
    }
    [self.scrollView setContentSize:self.contentView.frame.size];
}

I debugged using this:

NSLog(@"Content view's frame is: %@", NSStringFromCGRect(self.contentView.frame));

And always got this output:

2015-05-24 00:30:36.123 NewsApp[18983:2738892] Content view's frame is: {{0, 0}, {343, 0}}

Now when I even tried to go through the Child Views one by one using this code:

    for (UIView* v in self.contentView.subviews) {
        v.translatesAutoresizingMaskIntoConstraints = NO;
        totalHeight += v.frame.size.height;
        NSLog(@"My view %@ frame is: %@",v.class ,NSStringFromCGRect(v.frame));
    }

Sizes were as follows: (As you can see ImageView displays height: 0px) --> ruins everything :(

2015-05-24 01:59:38.696 NewsApp[20218:3145567] My view UILabel frame is: {{10, 20}, {323, 52.5}}

2015-05-24 01:59:38.696 NewsApp[20218:3145567] My view UIImageView frame is: {{10, 82.5}, {323, 0}}

2015-05-24 01:59:38.696 NewsApp[20218:3145567] My view UILabel frame is: {{10, 92.5}, {323, 507.5}}

Constraints:

1-ScrollView: 0 px from all directions (Horiz. and Vert.)

2-ContentView: 0 px from Horizontal positions and same "width" as ScrollView (tried also to add contraint 0px from top and also tried 0px from top and bottom).

3-Articles Title, Image View, Article Content: 0px horizontal, equal spacing vertical, and placed below each other).

My Environment: Build Target iOS 8, XCode: v. 6.3, Project has AutoLayout enabled of course

Solution: Add top and bottom constraint (Vertical to 0) or any fixed number between ContentView and ScrollView, and Add Bottom Contraint between the last element inside the ContentView and the ContentView itself

Upvotes: 0

Views: 1017

Answers (2)

Tim
Tim

Reputation: 2098

You need to pin your scrollview and contentview to the main view width and height. Then inside the content view, pin the top and bottom of each element to the view and each other, to define the content height based on the height of the elements (with a small space between.)

Check that all subviews are pinned vertically in both directions, and there is a continuous series of pins that define the shape of the ContentView. You were missing the bottom constraint from ArticleContentView to the bottom of the ContentView.

Upvotes: 2

Ahd Radwan
Ahd Radwan

Reputation: 1100

you dont have wrap-content int iOS . I suggest defining the height of the ScrollView you dont need to make it has dynamic height since you have a scroll

Upvotes: 0

Related Questions