4

I'm trying to align a multi-lines UILabel with a UIImage. The thing is : I want to align the first line of this label with the image, horizontally.

What I tried :

1 - align the image with the entire UILabel, so basically I still wanted to take the image up.

[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|[image(width)]-8-[multiLinesLabel]|" options:NSLayoutFormatAlignAllCenterY metrics:metrics views:views]];

2 - So I tried this, but then the image was too high.

[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|[image(width)]-8-[multiLinesLabel]|" options:NSLayoutFormatAlignAllTop metrics:metrics views:views]];

Has anybody got an idea to do that ?

Thanks in advance

EDIT : I finally did the trick like that :

[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|[image(width)]-8-[multiLinesLabel]|" options:kNilOptions metrics:metrics views:views]];

[containerView addConstraint:[NSLayoutConstraint
                                      constraintWithItem:image
                                      attribute:NSLayoutAttributeTop
                                      relatedBy:NSLayoutRelationEqual
                                      toItem:multiLinesLabel
                                      attribute:NSLayoutAttributeTop
                                      multiplier:1.0
                                      constant:3.0]];

I'm not really proud of me, it's not a clean way of solving the problem, but it works. If anyone thinks about an other solution...

Randy
  • 4,335
  • 3
  • 30
  • 64

1 Answers1

14

You could add a single line dummy label with the same font and a single character of text. Make it hidden. Position it to align with your image, and then position the multi-line label's top edge to align with the dummy label.

Ben Packard
  • 26,102
  • 25
  • 102
  • 183