레이아웃

Android Auto의 적응형 반응형 (AR) 프레임워크는 모든 자동차 화면 크기에 앱 레이아웃을 조정합니다.

미디어 탐색 및 재생 작업과 같은 앱 UI 및 기능도 Android Auto에서 자동으로 조정됩니다. 이 기능은 사용자 휴대전화에서 프로젝션된 앱과 호환되는 자동차입니다.

한눈에 보기

레이아웃 결정 방식

Android Auto의 적응형 프레임워크는 적응형 디자인과 반응형 디자인을 모두 사용합니다.

레이아웃은 중단점이라고 하는 측정값을 사용하여 결정됩니다. 중단점은 전략적으로 정의된 화면 높이 및 너비 측정값으로 특정 레이아웃을 표시할 시기를 결정합니다. 각 중단점 범위의 경우 화면 크기와 방향에 맞게 레이아웃이 조정됩니다.

Android Auto는 적응형 중단점을 사용하여 전체 화면이 아닌 앱 창의 크기로 계산되는 화면 레이아웃을 결정합니다.

Android Auto는 전체 자동차 화면 크기에 따라 반응형 여백을 사용합니다. 왼쪽과 오른쪽 여백은 화면 너비의 12% 로 조정되며 일반적으로 스크롤바와 탐색 컨트롤이 포함됩니다. 앱 캔버스라고 하는 남은 화면 공간에는 앱 콘텐츠가 포함됩니다.

작은 화면 크기에서 오른쪽 여백을 삭제하여 공간을 더 확보할 수 있습니다. 앱에서 이 공간을 보조 영역으로 사용하여 추가 정보를 표시할 수 있습니다.

Android Auto 레이아웃은 8dp 그리드를 따라 UI 요소를 정렬하며 일부 작은 구성요소는 4dp 그리드에 정렬됩니다.

패딩은 UI 요소 사이의 공간을 나타냅니다. Android Auto 패딩 배율은 9dp의 배수로 적용되며 최대 패딩 크기는 96dp입니다. 또한 8dp의 배수로 더 큰 패딩을 추가해야 합니다.

이 표에는 자동 UI에 표시되는 일반적인 패딩 값이 나와 있습니다. 크기 증가는 문자 'P'로 시작하는 라벨로 표시되는 오름차순으로 나열됩니다.

P0	P1	P2	P3	P4	P5	P6	P7	P8
4dp	8dp	12dp	16dp	24dp	32dp	48dp	64dp	96dp

더 나은 정렬을 만들고 충분한 간격을 두기 위해 작은 구성요소에서는 12dp의 패딩을 조금만 사용할 수도 있습니다.

키라인은 요소와 구성요소를 레이아웃에서 (X축을 따라) 가로로 배치해야 하는 위치를 표시하여 UI를 구성하는 측정값입니다. 'KL'로 시작하는 라벨로 표시됩니다.

키라인은 레이아웃의 아무 곳에나 배치할 수 있습니다. 두 개의 세로 가장자리 (요소, 구성요소, 화면 자체) 간의 거리를 나타내는 데 사용할 수 있습니다. 구성요소와 요소는 가장 가까운 키라인에 왼쪽 또는 오른쪽 가장자리를 맞춥니다.

키라인으로 측정

키라인은 화면 너비에 따라 변경되므로 UI 요소가 다양한 화면 크기에 걸쳐 게재위치를 일관되게 조정할 수 있습니다.

화면 크기 범위에는 'KL(n)&'로 표시된 라벨로 표시되는 키라인이 권장됩니다. 키라인 크기가 커지는 순서대로 표시됩니다.

KL(n)	좁은 화면 (0~600dp)	표준 화면 (600~930dp)	넓은 화면 (930~1280dp)	초대형 화면 (1280dp 이상)
KL0	16dp	24dp	24dp	32dp
KL1	24dp	32dp	32dp	48dp
KL2	96dp	112dp	112dp	N/A
KL3	112dp	128dp	128dp	152dp
KL4	148dp	168dp	168dp	N/A