폐사 디자이너와의 대화에 도움이 되었으므로 메모입니다.

「레이아웃 범위 표시」란?

Android 단말에는 「개발자용 옵션」이라고 하는 것이 있어, 거기로부터 ON/OFF 할 수 있는 기능입니다.
「레이아웃 범위 표시」를 ON으로 하면, 이런 느낌의 화면이 됩니다.



보시다시피 각 View의 경계에 선이 들어가면 어떻게 화면이 구성되어 있는지 알 수 있습니다.

문서를 찾아도 보이지 않았다 (찾을 수 없었다) 입니다만, 핑크로 채워지고 있는 곳은 margin라고 생각합니다.

이 기능을 활용하는 것으로, 엔지니어←→디자이너간에 「이 이미지의 좌단은, 이 텍스트의 좌단에 맞추고 있습니다」라고 하는 대화가 쉬워집니다.

실제로, 폐사 디자이너와의 대화 속에서 「과연.여기의 끝은 이 요소에 맞추고 있지만, 일률적으로 왼쪽으로부터◯%의 곳에 맞추고 싶다」라고 하는 대화가 생겼습니다.

일률적으로 왼쪽에서 ◯%로 텍스트를 넣고 싶습니다.

이러한 요구를 실현하려면 ConstraintLayout의 GuideLine을 사용하면 실현 가능합니다.
그런 대화를 할 수 있게 된 것도, 「레이아웃 범위 표시」덕분입니다.

어떻게 설정합니까?

정리하면 「개발자용 옵션을 유효하게 하고 나서, 레이아웃 범위를 표시를 ON으로 한다」입니다.
대부분의 Android 기기에서 설정할 수 있습니다.

먼저 기기 설정 앱에서 ビルド番号를 찾습니다.
기종에 따라 다릅니다만, Pixel3XL이라고 「단말 정보」안에 있었습니다.


이 빌드 번호를 연타합니다! 그러면 개발자 모드가 켜지고 개발자 옵션을 설정할 수 있습니다.


개발자 모드가 켜지면 설정 앱의 어딘가에 開発者向けオプション라는 항목이 증가하고 있습니다.
Pixel3XL이라면, 「시스템＞고급 설정」안에 있었습니다.


「개발자용 옵션」안에서 아래쪽으로 스크롤하면 「레이아웃 경계를 표시」라고 있으므로, 이것을 ON으로 합니다!


이제 화면이 어떻게 구성되어 있는지 볼 수 있습니다!

요약

이 기능은 엔지니어와 디자이너가 커뮤니케이션을 수행하는 데 매우 좋은 도구라고 생각합니다.
다만, 이 기능의 존재를 아는 것은 엔지니어라고 생각합니다.
적극적으로 전하자!