결정적인 iPhone X 코너 반경은 얼마입니까?


10

나는 실험을 해왔고 iPhone X에 대한 결정적인 코너 반경을 찾지 못했습니다.

Xcode를 사용하여 너비와 길이가 80 (반지름 40) 인 원을 만들고 iPhone X의 왼쪽 상단 모서리에 넣습니다 (x와 y는 0) 원 사이에 작은 흰색 간격이 있습니다. 화면 가장자리는 다음과 같습니다.

나는 또한 버튼으로 이것을하는 다른 방법을 시도했다.

button.frame.size.height = 812
button.frame.size.width = 375
button.layer.cornerRadius = 40
button.center = self.view.center

이것으로 나는 남아 있습니다 :

문제는 실제 코너 반경은 얼마입니까? 아니면 Xcode는 어떻게됩니까?

답변:


16

아이폰 X 코너는하지 않습니다 결정적인 코너 반경. 그들은 정상적인 호가 아니며 ' 연속 구석 '입니다.

간단한 .cornerRadius로 복제 할 수 없으며 개인 API이므로 Apple 자체의 연속 모서리를 사용할 수도 없습니다.

iOS 11의 CALayer에는 개인 "continuousCorners"속성이 있으며 이는 SpringBoard의 많은 둥근 모서리를 가능하게합니다. 이제 질투합니다.

https://twitter.com/argentumko/status/955773459463790592

자신의 구현없이 얻을 수있는 가장 가까운 것은 UIBezierPath의 둥근 사각형 그리기 _continuousRoundedRectBezierPath입니다.


정말 감사합니다. 이제 훨씬 더 이해가됩니다
chriscrutt

1

브래드 엘리스 (Brad Ellis)아이폰 X의 곡선을 자세히 기술 한 기사를 가지고 있다 .

[..] iPhone X 둥근 화면 모서리는 직선으로 이동 한 다음 단일 사분면을 사용하여 호를 그리는 고전적인 둥근 방법을 사용하지 않습니다. 대신 수학은 좀 더 복잡합니다. 일반적으로 다람쥐라고 불리는이 슬로프는 더 빨리 시작되지만 더 완만합니다.

여기서 차이점을 볼 수 있습니다.

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


1

다음 Objective-C 라인

NSLog(@"%@", [self traitCollection]);

iPhone X의 iOS 11.0.1 시뮬레이터에서 실행하면 다음과 같은 출력이 생성됩니다.

<UITraitCollection: ... _UITraitNameDisplayCornerRadius = 39.000000>

그것에서 보이는 그래서 어느 시점 시간에, 누군가 애플은 코너 반경이 39 점을 생각했다. 이것이 가장 공식적인 답변이라고 생각합니다 . :-) 그러나 다른 답변이 설명 하듯이 그 정보는별로 유용하지 않습니다 ...

더 쓸모없는 정보 : 다른 iOS 11.0 및 11.1 시뮬레이터는 _UITraitNameDisplayCornerRadius = 0.000000둥근 모서리가없는 iPhone에 대해 보고 하지만 (예 : 이 SO 질문 참조 ) iOS 12.2 용 시뮬레이터는 에 대한 로그 출력에 속성을 포함 하지 않으며 실제 iPhone X도 마찬가지입니다. iOS 11.2.1을 실행 중입니다. iOS 11.2 정도의 로그 출력 에서이 속성을 제거했다고 생각합니다._UITraitNameDisplayCornerRadiusUITraitCollection

추신 : 그것은 중요하지 않다고 생각하지만 Xcode 10.1에서 이러한 결과를 얻었습니다.


1

모서리의 모양은 호로 설명 할 수 없습니다. 그러나 iOS 11 UIBezierPath.init(roundedRect:cornerRadius:)은 연속 둥근 모서리가있는 사각형을 생성 하므로 공개 API를 사용하여 재생할 수 있습니다 .

출처 : https://medium.com/fueled-engineering/continuous-rounded-corners-with-uikit-b575d50ab232

iOS 13 cornerCurve은 CALayer에 명시 적 속성을 도입했습니다 : https://developer.apple.com/documentation/quartzcore/calayercornercurve

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.