UIView không tuân theo các ràng buộc tự động hoàn thành trong UIScrollView

Question

Tôi đang thêm UIView vào một UIScrollView và hạn chế nó sao cho nó lấp đầy không gian ngang, ngoại trừ một số lề. hạn chế hình ảnh của tôi trông như thế này:

@"|-16-[theLineView]-16-|" 

Tôi đã thực hiện quan điểm một pixel cao vì vậy nó sẽ xuất hiện như một dòng, và đặt nó giữa hai nhãn văn bản:

@"V:[someOtherStuff]-[aTextLabel]-[theLineView]-[anotherLabel]" 

Tuy nhiên, tôi đang tìm kiếm rằng chiều rộng của đường chỉ mở rộng theo chiều rộng của nhãn dài nhất trên/dưới nó.

Tại sao điều này là?

Tái bút: Tôi đã đọc http://developer.apple.com/library/ios/#technotes/tn2154/_index.html

Mã

Dưới đây là toàn bộ mã xem điều khiển từ một dự án thử nghiệm mà thể hiện vấn đề này trên sim iPad.

- (void)viewDidLoad 

{ [super viewDidLoad];

self.scrollView = [[UIScrollView alloc] init]; 
self.scrollView.translatesAutoresizingMaskIntoConstraints = NO; 
self.scrollView.backgroundColor = [UIColor greenColor]; 
[self.view addSubview:self.scrollView]; 
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|[scrollView]|" 
                   options:0 
                   metrics:0 
                    views:@{@"scrollView":self.scrollView}]]; 
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[scrollView]|" 
                    options:0 
                    metrics:0 
                    views:@{@"scrollView":self.scrollView}]]; 

self.line1 = [[UIView alloc] init]; 
self.line2 = [[UIView alloc] init]; 
self.label1 = [[UILabel alloc] init]; 
self.label2 = [[UILabel alloc] init]; 
self.label3 = [[UILabel alloc] init]; 

for (UILabel *label in @[self.label1, self.label2, self.label3]) 
{ 
    label.text = @"I am a label and I am long enough that I can be multiline on an iphone but single on ipad"; 
} 

for (UIView *view in @[self.line1, self.line2, self.label1, self.label2, self.label3]) 
{ 
    view.translatesAutoresizingMaskIntoConstraints = NO; 
    view.backgroundColor = [UIColor redColor]; 
    [self.scrollView addSubview:view]; 
} 

//horizontal layout - all views/labels should fill the horizontal space expect for margin 
for (UIView *view in @[self.line1, self.line2, self.label1, self.label2, self.label3]) 
{ 
    NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"|-16-[view]-16-|" 
                    options:0 
                    metrics:0 
                    views:@{@"view":view}]; 
    [self.scrollView addConstraints:constraints]; 
} 

//vertical layout - stack em up 
[self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[lab1]-[line1(==1)]-[lab2]-[line2(==1)]-[lab3]-|" 
                    options:0 
                    metrics:0 
                    views:@{@"lab1":self.label1, @"line1":self.line1, @"lab2":self.label2, @"line2":self.line2, @"lab3":self.label3}]]; 

}

Answer 1

UIScrollView tự động co lại cho phù hợp với quan điểm bên trong nó. Bạn cần đặt chiều rộng hoàn toàn ở đâu đó.

Đề xuất chiến thuật:

1. Hoàn toàn fixiate các scrollview bên cha mẹ-view của nó sử dụng hạn chế (hàng đầu, đuôi, trên, dưới).
2. Tạo UIView bên trong UIScrollView và đặt mọi thứ bạn cần vào trong đó.
3. Đặt các ràng buộc để UIView hoạt động như một chế độ xem nội dung (điều này có nghĩa là nó đủ lớn để bao gồm tất cả các phần tử). Sử dụng kích thước nội tại nội tại, khả năng chống co lại và chuỗi các phần tử có nhiều ràng buộc. Bố trí kết quả phải được xác định rõ ràng và duy nhất (điều này có nghĩa là nếu bạn loại bỏ tất cả các ràng buộc bên ngoài, bố cục sẽ vẫn hoạt động).
4. Kết nối các giới hạn của UIView với người giám sát của họ (đó là chế độ xem nội dung thực tế của UIScrollView, KHÔNG phải là UIScrollView!).

Nếu bạn làm điều này trong trình tạo giao diện (có thể), bạn cần phải kiểm tra lại các ràng buộc của mình mỗi khi bạn chạm vào cảnh nào đó trong cảnh đó. Và bằng cách chạm vào tôi có nghĩa là "chọn" không chỉ "sửa đổi".

Answer 2

Tìm thấy giải pháp làm việc cũng nên hoạt động cho trường hợp sử dụng của bạn. Xem here.

Answer 3

Mở rộng số 4 của câu trả lời của Patric Schenke; vì kích thước nội dung của scrollView là chất lỏng, việc ghim chế độ xem nội bộ vào các cạnh của nó chỉ không hoạt động để xác định chiều rộng của chế độ xem. Pin bên trái của bạn sẽ hoạt động, nhưng cả hai sẽ không hoạt động. Tính chiều rộng của chế độ xem dựa trên vùng chứa cấp tiếp theo là cách để đi.Miễn là self.scrollView của bạn được ghim vào thùng chứa (mà tôi gọi là containerView), dòng mã này sẽ thực hiện những gì bạn muốn. Thêm dòng này vào for vòng lặp của bạn cho các ràng buộc ngang:

// Pin view's width to match the scrollView container's width 
// -32 constant offset for margins 
[containerView addConstraint: 
    [NSLayoutConstraint constraintWithItem:view 
           attribute:NSLayoutAttributeWidth 
           relatedBy:NSLayoutRelationEqual 
            toItem:containerView 
           attribute:NSLayoutAttributeWidth 
           multiplier:1.0f 
           constant:-32]]; 

Answer 4

Tôi tìm thấy một cách hạn chế dựa trên đơn giản để thực hiện điều này (tôi đã không kiểm tra mức độ giòn của giải pháp này):

...@"H:|-16-[view]-16-|"... // (your original constraint) 

[self.scrollView addConstraint: 
    [NSLayoutConstraint constraintWithItem:view 
           attribute:NSLayoutAttributeCenterX 
           relatedBy:NSLayoutRelationEqual 
            toItem:self.scrollView 
           attribute:NSLayoutAttributeCenterX 
           multiplier:1.0f 
           constant:0.0f]]; 

Điều này kéo dài view tất cả các đường ra phía bên kia của chế độ xem. Điều này có lẽ không lý tưởng cho nội dung cuộn theo chiều ngang, nhưng nên hoạt động theo chiều dọc.

Tôi nhận ra điều này đã hơn một năm sau, nhưng đơn giản hơn đối với trường hợp sử dụng cuộn một chiều so với câu trả lời của patric.schenke (tốt và mạnh hơn).