자동 줄 맞춤 제약을 사용하여 사용자 지정 너비의 단추를 중앙에 배치하는 방법은 무엇입니까?

Question

다음 코드를 참조하십시오

는

def viewDidLoad 
    super 
    self.view.translatesAutoresizingMaskIntoConstraints = false 
    self.view.backgroundColor = UIColor.whiteColor 

    @start = UIButton.buttonWithType(UIButtonTypeRoundedRect).tap do |el| 
     el.translatesAutoresizingMaskIntoConstraints = false   
     el.setTitle('Start', forState:UIControlStateNormal) 
     el.addTarget(self, action:'toStartController', forControlEvents:UIControlEventTouchUpInside) 
     self.view.addSubview(el) 
    end 

    self.layout_subviews 
    end 

def layout_subviews 
    metrics = { 'space' => 8 } 

    views_dict = { 
     'superview' => self.view, 
     'start' => @start 
    } 

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('H:|-[start(100)]-|', 
                    options: NSLayoutFormatAlignAllCenterX, 
                    metrics: metrics, 
                     views: views_dict)) 

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('V:[start]-|', 
                    options: NSLayoutFormatAlignAllBottom, 
                    metrics: metrics, 
                     views: views_dict)) 
    end 

제가하는 데 문제는 H:|-[start(100)]-|가 작동하지 않습니다이다. 내가 원하는 것은 너비가 100 인 X 축을 기준으로하고 화면 하단에 기본 여백으로 연결된 버튼입니다. (100)을 제거하면 버튼이 화면 너비에서 기본 여백을 뺀 값까지 늘어납니다. 사용자 정의 너비를 지정할 때 자동 레이아웃 시스템은 왼쪽 여백과 오른쪽 여백을 조정할 수 없습니다. Unable to simultaneously satisfy constraints. 오류가 발생합니다. 나는 이것이 superview에 start 요소를 붙이기위한 유체 너비를 가질 필요가있는 H:|-[start(100)]-|의 대시와 관련이 있다고 생각합니다.

어떻게 해결할 수 있을지에 대한 의견이 있으십니까?

업데이트 (감사 ghettopia는) :

이 (통지 내가 TestController의 viewDidLoad의 응용 프로그램 위임에 UINavigationController 및 self.view.translatesAutoresizingMaskIntoConstraints = false을 사용하고 주석) 작동 :

class AppDelegate 
    def application(application, didFinishLaunchingWithOptions:launchOptions) 
    @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds).tap do |win| 
     controller = TestController.alloc.initWithNibName(nil, bundle:nil) 
     win.rootViewController = UINavigationController.alloc.initWithRootViewController(controller).tap do |root| 
     root.navigationBarHidden = true 
     root.wantsFullScreenLayout = true 
     end 
     win.makeKeyAndVisible 
    end 
    true 
    end 
end 

class TestController < UIViewController 

    def viewDidLoad 
    super 
    # self.view.translatesAutoresizingMaskIntoConstraints = false 
    self.view.backgroundColor = UIColor.blueColor 

    @button = UIButton.buttonWithType(UIButtonTypeRoundedRect) 
    @button.translatesAutoresizingMaskIntoConstraints = false 
    self.view.addSubview(@button) 

    views = { 
     'view' => self.view, 
     'button' => @button 
    } 

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('H:[button(100)]', options: 0, metrics: nil, views: views)) 
    self.view.addConstraint(NSLayoutConstraint.constraintWithItem(@button, attribute: NSLayoutAttributeCenterX, relatedBy: NSLayoutRelationEqual, toItem: self.view, attribute: NSLayoutAttributeCenterX, multiplier: 1, constant: 0)) 
    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('V:[button]-|', options: 0, metrics: nil, views: views)) 
    end 
end 

이제 X 축에 중심을 둔 버튼이있는 파란색 화면이 나타납니다. 원하는대로 마진을 기본 여백으로 설정합니다. 그러나 내가 읽은 바에 따르면 자동 레이아웃 작업을하려면 self.view.translatesAutoresizingMaskIntoConstraints = false이 필요합니다.

class AppDelegate 
    def application(application, didFinishLaunchingWithOptions:launchOptions) 
    @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds).tap do |win| 
     win.rootViewController = TestController.alloc.initWithNibName(nil, bundle:nil) 
     win.makeKeyAndVisible 
    end 
    true 
    end 
end 

class TestController < UIViewController 

    def viewDidLoad 
    super 
    self.view.translatesAutoresizingMaskIntoConstraints = false 
    self.view.backgroundColor = UIColor.blueColor 

    @button = UIButton.buttonWithType(UIButtonTypeRoundedRect) 
    @button.translatesAutoresizingMaskIntoConstraints = false 
    self.view.addSubview(@button) 

    views = { 
     'view' => self.view, 
     'button' => @button 
    } 

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('H:[button(100)]', options: 0, metrics: nil, views: views)) 
    self.view.addConstraint(NSLayoutConstraint.constraintWithItem(@button, attribute: NSLayoutAttributeCenterX, relatedBy: NSLayoutRelationEqual, toItem: self.view, attribute: NSLayoutAttributeCenterX, multiplier: 1, constant: 0)) 
    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('V:[button]-|', options: 0, metrics: nil, views: views)) 
    end 
end 

을하지만 그것은 적절한 해결책은 아닌 것 같아 : 그렇게하려면,이뿐만 아니라 작동합니다 (I를 사용하고 TestController의 viewDidLoad에서 UINavigationController이 시간과 self.view.translatesAutoresizingMaskIntoConstraints = false을 사용하지 않는주의). 내 앱 구조를 만들려면 UINavigationController이 필요합니다. 문제는 위의 솔루션 중 하나를 사용하지 않을 때 중간에 단추가없는 검은 색 화면이 표시되는 것입니다 (두 축 모두에서). 보기가 깨진 것 같습니다 :

생각합니까? 그냥 self.view.translatesAutoresizingMaskIntoConstraints = false을 삭제하고 잊어 버리십니까? 아니면 정말로 필요한 것입니까? 그렇다면 내 코드에 문제가있을 것입니다.

업데이트 2 :

재미있는 튜토리얼 : Auto Layout in iOS 6: Adding constraints through code. 저자는 서브 뷰에서만 을 viewDidLoad에 사용하지 않습니다.

업데이트 3 :

은 내가 대신 viewDidLoad의 init 방법 self.view.translatesAutoresizingMaskIntoConstraints = false를 이동하여 검은 화면 문제를 해결 한 것 같아요. 왜이 기능이 작동하는지 잘 모르겠지만 처음 화면에서와 마찬가지로 화면이 스크린 샷과 동일하게 보입니다.여기에 업데이트 된 코드는 다음과 같습니다

class AppDelegate 
    def application(application, didFinishLaunchingWithOptions:launchOptions) 
    @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds).tap do |win| 
     controller = TestController.alloc.initWithNibName(nil, bundle:nil) 
     win.rootViewController = UINavigationController.alloc.initWithRootViewController(controller).tap do |root| 
     root.navigationBarHidden = true 
     root.wantsFullScreenLayout = true 
     end 
     win.makeKeyAndVisible 
    end 
    true 
    end 
end  

class TestController < UIViewController 

    def init 
    self.view.translatesAutoresizingMaskIntoConstraints = false 
    end 

    def viewDidLoad 
    super 
    self.view.backgroundColor = UIColor.blueColor 

    @button = UIButton.buttonWithType(UIButtonTypeRoundedRect) 
    @button.translatesAutoresizingMaskIntoConstraints = false 
    self.view.addSubview(@button) 

    views = { 
     'view' => self.view, 
     'button' => @button 
    } 

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('H:[button(100)]', options: 0, metrics: nil, views: views)) 
    self.view.addConstraint(NSLayoutConstraint.constraintWithItem(@button, attribute: NSLayoutAttributeCenterX, relatedBy: NSLayoutRelationEqual, toItem: self.view, attribute: NSLayoutAttributeCenterX, multiplier: 1, constant: 0)) 
    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('V:[button]-|', options: 0, metrics: nil, views: views)) 
    end 
end 

Answer 1

UIButton* button = [UIButton buttonWithType:UIButtonTypeRoundedRect] ; 
button.translatesAutoresizingMaskIntoConstraints = NO ; 
[self.view addSubview:button] ; 

NSDictionary* views = @{ @"view" : self.view , @"button" : button } ; 
// Make button's width 100. 
[self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat:@"H:[button(100)]" options:0 metrics:nil views:views ] ] ; 
// Make button's CenterX the same as self.view's CenterX. 
[self.view addConstraint: [NSLayoutConstraint constraintWithItem:button attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0 ] ] ; 
// Make button's NSLayoutAttributeBottom the default space away from self.view's NSLayoutAttributeBottom. 
[self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat:@"V:[button]-|" options:0 metrics:nil views:views ] ] ;