Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iOS: Autolayout causing UIScrollView to not scroll

I have set up a UIScrollView with which I want to display 12 images (only 8 fit on screen) laid out horizontally. In the following image you can see the problem I'm having (which makes my scroll view not scroll), my constraints and the UIScrollView which I have added on storyboard:

Screenshot of storyboard showing constraints

I have called the following method on -(void)viewDidLoad, where I "set up"my scrollview (itemList is my scroll view property and itemNames a array with the images'names):

- (void)setupHorizontalScrollView
{
    self.itemList.delegate = self;
    [self.itemList setTranslatesAutoresizingMaskIntoConstraints:NO];

    [self.itemList setBackgroundColor:[UIColor blackColor]];
    [self.itemList setCanCancelContentTouches:NO];

    self.itemList.indicatorStyle = UIScrollViewIndicatorStyleWhite;
    self.itemList.clipsToBounds = NO;
    self.itemList.scrollEnabled = YES;
    self.itemList.pagingEnabled = NO;

    NSInteger tot=0;
    CGFloat cx = 0;
    for (; ; tot++) {
        if (tot==12) {
            break;
        }

        UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:[self.itemNames objectAtIndex:tot]]];

        CGRect rect = imageView.frame;
        rect.size.height = 40;
        rect.size.width = 40;
        rect.origin.x = cx;
        rect.origin.y = 0;

        imageView.frame = rect;
        [self.itemList addSubview:imageView];
        cx += imageView.frame.size.width;
    }

    [self.itemList setContentSize:CGSizeMake(cx, [self.itemList bounds].size.height)];
}

I have added the [self.itemList setTranslatesAutoresizingMaskIntoConstraints:NO]; because I saw this suggestion on other posts, but it doesn't work with or without it. The only way it works is if I uncheck use AutoLayout on the storyboard, but that moves the UIImageViewI use to look as a navigation bar to the bottom of the screen. I don't know what to do anymore, any help is appreciated :)

like image 881
dietbacon Avatar asked Aug 02 '13 00:08

dietbacon


People also ask

Why is ScrollView not scrolling?

To fix ScrollView Not scrolling with React Native, we wrap the content of the ScrollView with the ScrollView. to wrap ScrollView around the Text components that we render inside. As a result, we should see text inside and we can scroll up and down.

Can stack view be scrollable?

Scrolling only happens when the content view inside the scrollview is larger than the scrollview! To elaborate on point 6. If the stack view had no elements but all the constraints are in place, you get "Scroll View Need constraints for Y position or height".

How do I make my UI view scrollable?

You cannot make a UIView scrollable. That's what UIScrollView is for. However if you are using storyboards you can try to add constraints to the view so when you rotate the device the content remains inside the viewable area.


2 Answers

Try to set your scrollView's Content size int "viewDidLayoutSubviews" method with keeping the autolayouts set.

-(void)viewDidLayoutSubviews
{
  [self.itemList setContentSize:CGSizeMake(required_width, required_height)];
}
like image 145
Hanny Avatar answered Oct 19 '22 23:10

Hanny


Two Solutions:

  1. Create different constraints that can be satisfied simultaneously (you will have to edit). I think the problem is your bottom space and top space constraints are mutually exclusive. please remove one and try again. IF this is difficult for you, try adding another UIView to contain the UIScrollView to help manage your constraints, it might seem odd at first, but sometimes adding another view to contain your view actually makes it simpler at each level.

  2. Turn off Autolayout, and change the autoresize masks of your UIImageView to be what you wish.

like image 45
Mitchell Currie Avatar answered Oct 20 '22 01:10

Mitchell Currie