시맨틱 속성
- 시맨틱 트리의 노드에는 의미를 전달하는 속성이 포함됨
ex) Text컴포저블에는 text속성이 포함, Icon컴포저블에 contentDescription
시맨틱 속성이 컴포저블에 의미를 전달하는 방법
Switch 요소의 의미: 전환 가능한 요소, 현재 켜짐상태, 눌러서 상호작용
-> 위 의미를 전달하기 위해 시맨틱 속성 사용
Layout Inspector
컴포저블의 시맨틱 속성을 확인할 수 있다.
1. Role: 현재 보고 있는 요소의 유형 (스위치)
2. StateDescription: 켜짐 상태를 지칭하는 방법
3. ToggleableState: 현재 상태를 지칭
4. OnClick: 클릭 했을 때 호출되는 함수를 지칭
+) 이를 이용한 테스트
val mySwitch = SemanticsMatcher.expectValue(
SemanticsProperties.Role, Role.Switch
)
composeTestRule.onNode(mySwitch)
.performClick()
.assertIsOff()시맨틱 속성이 Switch인 노드를 찾아 테스트.
병합된 시맨틱 트리와 병합되지 않은 시맨틱 트리
- UI 트리 각 컴포저블은 시맨틱 속성을 0개 이상 설정됨.
- 컴포저블에 시맨틱 속성이 없을 경우 시맨틱 트리에 포함되지 않음
- 때로는 화면에 표시되는 내용의 정확한 의미를 전달하기 위해 하위 트리를 병합하여 하나로 처리할 수 있음
Button(onClick = { /*TODO*/ }) {
Icon(
imageVector = Icons.Filled.Favorite,
contentDescription = null
)
Spacer(Modifier.size(ButtonDefaults.IconSpacing))
Text("Like")
}
위 예를 보면 Button의 하위 요소가 병합되고 트리에서 단일 Button 요소로 표현됨을 확인 가능.
병합은 Modifier.semantics(mergeDescendants = true) {}를 호출해 병합
