Taku
Taku

Reputation: 5937

Cannot wrap UILabel in UIView within UIScrollView

I have a UILabel in a UIView that's within UIScrollView. There are two things I should see:

  1. UILabel wraps around horizontally after reaching the right side of screen
  2. The UIScrollView to not scroll horizontally

But the things that I currently see:

  1. The word does not wrap around and the scrollview allows me to scroll horizontally.

After doing some research like this one, I am unable to see the expected result in my project and I see the same result in a simplified code like below.

The current hierarchy is

-UIScrollView
    -UIView
        -UILabel

and the code is below. What am I missing?

- (void)viewDidLoad {
    [super viewDidLoad];


    UIScrollView * scrollView = [UIScrollView new];
    scrollView.translatesAutoresizingMaskIntoConstraints = false;
    scrollView.backgroundColor = [UIColor lightGrayColor];

    [self.view addSubview: scrollView];
    [self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat: @"V:|[scrollView]|"
                                                                        options: 0
                                                                        metrics: nil
                                                                          views: NSDictionaryOfVariableBindings(scrollView)]];

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

    UIView * view = [UIView new];
    view.translatesAutoresizingMaskIntoConstraints = false;


    UILabel * label = [UILabel new];
    label.backgroundColor = [UIColor yellowColor];
    label.numberOfLines = 0;
    label.translatesAutoresizingMaskIntoConstraints = false;
    label.text = @"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.";

    [scrollView addSubview: view];
    [scrollView addConstraints: [NSLayoutConstraint constraintsWithVisualFormat: @"V:|[view]|"
                                                                       options: 0
                                                                       metrics: nil
                                                                         views: NSDictionaryOfVariableBindings(view)]];

    [scrollView addConstraints: [NSLayoutConstraint constraintsWithVisualFormat: @"H:|[view]|"
                                                                        options: 0
                                                                        metrics: nil
                                                                          views: NSDictionaryOfVariableBindings(view)]];


    [view addSubview: label];
    [view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat: @"V:|[label]|"
                                                                        options: 0
                                                                        metrics: nil
                                                                          views: NSDictionaryOfVariableBindings(label)]];

    [view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat: @"H:|[label]|"
                                                                        options: 0
                                                                        metrics: nil
                                                                          views: NSDictionaryOfVariableBindings(label)]];





    // Do any additional setup after loading the view, typically from a nib.
}

Upvotes: 0

Views: 289

Answers (2)

Taku
Taku

Reputation: 5937

After using @Lion's suggestion on using a horizontal centering and I've added this piece of code, it works:

[scrollView addConstraint: [NSLayoutConstraint constraintWithItem: view
                                                        attribute: NSLayoutAttributeCenterX
                                                        relatedBy: NSLayoutRelationEqual
                                                           toItem: scrollView
                                                        attribute: NSLayoutAttributeCenterX
                                                       multiplier: 1.0
                                                          constant: 0]];

The whole script becomes:

- (void)viewDidLoad {
    UIScrollView *scrollView;
    UILabel * label;
    UIView * view;
    UIImageView *imageView;
    NSDictionary *viewsDictionary;

    // Create the scroll view and the image view.
    scrollView  = [[UIScrollView alloc] init];
    //imageView = [[UIImageView alloc] init];
    label = [UILabel new];
    label.text = @"SDF ksaf lkahsdf kashflasf kjsdhfakljf lsd asdfas asdf saf saf asdf asd fasfs ka";
    label.numberOfLines = 0;

    view = [UIView new];
    view.backgroundColor = [UIColor yellowColor];

    // Add an image to the image view.
    //[imageView setImage:[UIImage imageNamed:"MyReallyBigImage"]];

    // Add the scroll view to our view.
    [self.view addSubview:scrollView];

    // Add the image view to the scroll view.
    //[scrollView addSubview:imageView];
    [scrollView addSubview: view];

    // Set the translatesAutoresizingMaskIntoConstraints to NO so that the views autoresizing mask is not translated into auto layout constraints.
    scrollView.translatesAutoresizingMaskIntoConstraints  = NO;
    imageView.translatesAutoresizingMaskIntoConstraints = NO;
    label.translatesAutoresizingMaskIntoConstraints = NO;
    view.translatesAutoresizingMaskIntoConstraints = NO;
    [view addSubview: label];

    // Set the constraints for the scroll view and the image view.
    viewsDictionary = NSDictionaryOfVariableBindings(scrollView, view, label);
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[scrollView]|" options:0 metrics: 0 views:viewsDictionary]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[scrollView]|" options:0 metrics: 0 views:viewsDictionary]];
    [scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[view]|" options:0 metrics: 0 views:viewsDictionary]];
    [scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view]|" options:0 metrics: 0 views:viewsDictionary]];
    [scrollView addConstraint: [NSLayoutConstraint constraintWithItem: view
                                                            attribute: NSLayoutAttributeCenterX
                                                            relatedBy: NSLayoutRelationEqual
                                                               toItem: scrollView
                                                            attribute: NSLayoutAttributeCenterX
                                                           multiplier: 1.0
                                                              constant: 0]];
    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[label]|" options:0 metrics: 0 views:viewsDictionary]];
    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[label]|" options:0 metrics: 0 views:viewsDictionary]];


    /* the rest of your code here... */
}

Upvotes: 0

Ketan Parmar
Ketan Parmar

Reputation: 27448

You should give constraint like,

1) Scrollview - top,bottom,leading,trailing

2) View - top,bottom,leading,trailing,fixed height,horizontally center in container (If want vertical scrolling) or fixed width, vertically center (If want horizontal scrolling) - Scrollview will scroll if height of view is greater then screen size or self.view (in vertical scrolling case) like wise if width is greater then scroll will done in horizontal

3) Label - top,bottom,leading,trailing or top,leading,trailing,fix height which is suitable according to requirement.

Check your constraints. Is it match with mentioned above?

And another thing you can use UITextview with edit disable to show large string which allow scrolling also.

Hope this will help :)

Upvotes: 1

Related Questions