Xcode 6 스토리 보드의 "여백에 구속"이란 무엇입니까


249

자동 레이아웃 및 제약 조건으로 작업 중이며 Constrain to marginsXcode 6에는 Xcode 5에는 없었으며 기본적으로 확인되는 옵션이 있습니다.

테스트 프로젝트를 만든 다음 UITableView뷰와 동일한 크기로 프레임을 설정하고 제약 조건을 추가하여 ViewController에를 추가했습니다 .

Xcode 6 tableview에는 뷰와 동일한 프레임이 있지만 Xcode 5는 간격을 0으로 추가하는 것이 좋습니다.

여백에 대한 구속 조건이 선택된 상태

이제 "여백에 제약"옵션을 선택 취소하면 Xcode 5와 동일하게 작동하며 0을 제약 조건으로 추가하는 것이 좋습니다.

제한되지 않은 여백에 구속

또한 Constrain으로 제약 조건을 추가하여 여백을 확인하면 더 이상 Xcode 5에서 스토리 보드 파일을 열 수 없으므로 Xcode 6의 새로운 기능입니다.

잘만되면 내 질문을 올바르게 설명 할 수 있습니다. 나는 "여백에 제약"이 실제로 무엇을하고 언제 사용해야하는지 그리고 사용하지 않아야하는지 이해하고 싶습니다. 그것이 매우 간단하고 명백한 것이면 사과드립니다.

편집하다

토론에서 레이아웃 여백에 대해 뭔가를 찾았습니다 . 이와 관련이 있는지 궁금합니다.


15
사과 할 필요가 없습니다. 그것이 무엇을하는지는 분명하지 않습니다.
Ben Clayton

4
+1 사과 할 필요가 없습니다.이 질문도하고 싶었습니다. BTW : Xcode5에서 스토리 보드를 열려면 다음을 참조하십시오. stackoverflow.com/a/25298909/529243
Olaf

1
이것은 내가 찾은 설명에 가장 가까운 것입니다 : stackoverflow.com/questions/25275901/…
Nathaniel

이것을 비활성화하는 방법?
오켄 슈타인

2
그래, 진짜 고통이야. 나는 그것을 영구적으로 체크 해제하는 방법을 알아낼 수 없었다.
Bhumit Mehta

답변:


315

사람들이 왜 " 여백이 iOS 8 이전의 어떤 것에 대해서도 명백한 충돌을 일으킬 것이라고 있습니다. "

xib 파일 또는 스토리 보드에서 여백을 기준으로 제약 조건을 설정하면 iOS7에서 앱이 중단 되지 않습니다. 하지 않습니다 당신의 iOS7에 장치에 UI의 차이를 어느만큼 당신이 접촉하지 않는 UIView.layoutMarginsUIView.preservesSuperviewLayoutMargins코드에서 속성을.

iOS8의 여백은 무엇입니까

레이아웃 여백은 내부 주변의 패딩을 나타냅니다.UIView간격이 뷰와 서브 뷰의 가장자리 사이에 남아 있는지 확인 - 하위 뷰를 배치 할 때 레이아웃 시스템에서 사용할 수있는. 이와 관련하여 CSS의 블록과 관련된 패딩 속성과 매우 유사합니다.

여기에 이미지 설명을 입력하십시오

기본적으로, UIView양쪽에 레이아웃 여백이 8 포인트이며 Interface Builder 에서 변경할 수 없습니다. . 그러나 UIView.layoutMarginsiOS8에서만 사용할 수있는 코드 에서 속성 을 설정하면 이 값을 조정할 수 있습니다.

IB가 여백을 표시하도록 할 수 있습니다. Editor> Canvas> Show Layout Rectangles를 사용 . 여기에 이미지 설명을 입력하십시오

여백을 사용하여 뷰와 하위 뷰를 레이아웃 할 수 있습니다. 모든는 UIView기본적으로 마진와 함께,하지만 당신은 여백과 관련된 제약 조건을 설정할 때 그들은 단지보기 배치에 영향을 미칩니다.

여백을 사용하는 방법

Interface Builder에서 여백을 사용하는 유일한 방법은 제약 조건을 구성하는 동안 여백에 상대적 옵션 을 확인하는 것 입니다. 이것은 뷰를 배치 할 때 가장자리 대신 여백사용 하도록 제약 조건을 지시하는 방법 입니다.

여기에 이미지 설명을 입력하십시오

뷰와 서브 뷰 사이에 주요 제약 조건을 설정하는 네 가지 방법을 살펴 보겠습니다. 각 제약 조건에 대해 설명첫 번째 연관은 서브 뷰의 선행 이며 두 번째는 슈퍼 뷰의 주요 입니다. 주의해야 할 것은 각 구속 조건 끝의 여백에 상대적 옵션의 체크 및 체크 해제 상태입니다. 이는 구속 조건이 뷰의 여백 또는 가장자리에 연결되어 있는지를 정의하기 때문입니다.

  1. 첫 번째 항목 (체크 해제), 두 번째 항목 (체크) :이 경우 하위 뷰의 왼쪽 가장자리가 슈퍼 뷰의 왼쪽 여백에 정렬되어야한다고 선언합니다 (그림 참조).

여기에 이미지 설명을 입력하십시오

  1. 첫 번째 항목 (확인 취소), 두 번째 항목 (확인 취소) : 모두 margin가 아닌 edge를 사용 합니다. 이 경우, 서브 뷰의 왼쪽 가장자리는 슈퍼 뷰의 왼쪽 가장자리와 정렬되어야합니다.

여기에 이미지 설명을 입력하십시오

  1. 첫 번째 항목 (확인), 두 번째 항목 (확인 취소) :이 경우 하위보기의 왼쪽 여백이 수퍼 뷰의 왼쪽 가장자리에 맞춰져야한다고 선언합니다. 이런 종류의 레이아웃은 실제로 서브 뷰가 슈퍼 뷰와 겹치게합니다.

여기에 이미지 설명을 입력하십시오

  1. 첫 번째 항목 (확인), 두 번째 항목 (확인). 서브 뷰와 수퍼 뷰 모두 동일한 기본 마진을 가지므로 실제로 사례 2와 동일한 효과를 갖습니다. 우리는 서브 뷰의 왼쪽 여백이 슈퍼 뷰의 왼쪽 여백에 맞춰져야한다고 선언하고 있습니다.

여기에 이미지 설명을 입력하십시오

여백에 대한 좋은 점

이 새로운 기능 (iOS8)은 여백을 사용하기로 결정한 경우에만 UI 개발에 영향을줍니다.

여백을 사용하면 단일 속성 값을 변경하여 공유 슈퍼 뷰와 공통 관계를 공유하는 여러 서브 뷰의 배치를 조정할 수 있습니다. 각 값을 하나씩 변경하는 대신 모든 간격을 업데이트해야하는 경우 한 줄의 이 같은 코드 :

self.rootView.layoutMargins = UIEdgeInsetsMake(0, 50, 0, 0);

이 이점을 설명하기 위해 다음과 같은 경우 모든 하위 뷰의 왼쪽 가장자리가 슈퍼 뷰의 왼쪽 여백에 맞춰집니다. 따라서 superview의 왼쪽 여백을 변경하면 모든 하위보기에 동시에 영향을 미칩니다.

여기에 이미지 설명을 입력하십시오


자세한 설명을 주셔서 감사합니다. 나는 이것을 잘 설명하면서 허용되는 답변으로 표시하고 있습니다.
Bhumit Mehta

@Bhumit에게 감사드립니다.이 답변이 도움이되기를 바랍니다.
Scott Zhu

4
"사람들이 불평하는 이유를 전혀 이해하지 못합니다." 글쎄, 아마도 마지막 베타 버전 중 하나에서 동작이 바뀌었을 것입니다. 그러나 적어도 몇 개월 전에 코드에서 layoutMargins를 설정하지 않아도 충돌이 발생했습니다.
KPM

새로운 제약 조건을 추가 할 때 최신 버전의 Xcode를 사용하면 동일한 "여백에 상대적"플래그를 설정하는 "여백에 제약"확인란을 선택 취소 할 수 있습니다. 클릭 몇 번만 저장되므로 유용합니다! 큰 답변 BTW, 잘 설명하고 이미지가 매우 도움이되었습니다.
EricWasTaken

사진이 dropbox에서 호스팅된다고 언급했습니다. SO에서 이미지를 호스팅하는 것이 낫지 않습니까?
테스트

63

iOS 8에서는 이제 슈퍼 뷰의 경계 자체 대신 슈퍼 뷰의 경계에 대해 사전 정의 된 여백을 기준으로 구속 조건을 정의 할 수 있습니다. 예, 문서에서 지적한 레이아웃 여백과 완전히 관련이 있습니다. 한 가지 장점은 각 종류의 장치에 대해 여백을 동적으로 또는 다르게 재정의 할 수 있으며 제약 조건을 수정하지 않고 레이아웃이 그에 따라 업데이트된다는 것입니다.

사용시기 :이 새로운 유연성을 활용하고 싶을 때.

사용하지 않을시기 : iOS 7 이하에서 실행되는 앱을 대상으로합니다.


21
이 기능은 기본적으로 활성화되어 있지 않지만 iOS 8 이전 버전에서는 완전히 충돌하는 경우 유용한 기능입니다.
TylerJames

1
더 동의하지 못했습니다.
KPM December

42

UIView의 속성은 다음과 같습니다 layoutMargins. Apple Docs를 참조하십시오 . 기본적으로 레이아웃 여백이 8,8,8,8 (기본값) 인 경우 컨테이너 여백에 대한 선행 공간이 0 인 제약 조건의 x 위치는 8입니다. 입니다. 이는 iOS8 이상에서만 사용할 수 있습니다.

제약 조건이 컨테이너 마진으로 가고 싶지 않은 모든 사람들에게 :

CTRL + 클릭 + 드래그로 구속 조건 생성 팝업을 표시합니다.

메뉴에서 기본적으로 여백에 대한 구속 조건을 작성하는 것으로 표시되면 옵션 / alt를 누르고 있으면 컨테이너 여백이 아닌 컨테이너에 대한 제한 조건이 작성됩니다.

이제 여백이 아닌 구속 조건을 작성하는 옵션이 표시됩니다. 이다 방법을 빨리 내 사용한다.


3
이것은 아마도 내가 찾은 최고의 솔루션 일 것입니다. "여백에 포함"을 선택 해제하는 것이 항상 작동하는 것은 아니며 너무 마술처럼 느껴집니다. 이것은 완벽 해요.
Levi McCallum

왜 지구상에서 10pt가 아닌가?
ZaBlanc

11
Apple은 코드를 읽는 사람이 선호하는 숫자를 고르는 것이 아니라 유용성 연구를 기반으로 길이와 크기를 선택해 왔습니다. 예를 들어 많은 것들의 기본 높이는 44 또는 35pt입니다. @ZaBlanc
Kyle Robson

기본적으로 여백없이 스토리 보드에 제약 조건을 추가 할 때 완벽한 솔루션입니다. 감사합니다!
inix
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.