compose

    [Android Studio] Layout Inspector에서 Compose View 들이 보이지 않는 현상 해결 방법

    문제 상황 개발 테스트 도중 Android Studio Layout Inspector에서 Compose View들이 보이지 않고 아래와 같이, AndroidComposeView로만 뭉뚱그려 나오는 문제가 발생했다. 해결 방법 이 문제를 해결하기 위해서 Google Issue Tracker을 확인한 결과 다음 두가지의 요구사항이 필요함을 확인했다. 1. Android Studio Flamingo 이상의 버전 사용 2. 8.0.0 이상의 AGP(Android Gradle Plugin) 사용 참조: https://issuetracker.google.com/issues/246355403 Google Issue Tracker issuetracker.google.com 내 Android Studio는 마침 딱 Fl..

    [Android UI Test] onAllNodes 구문 사용해 복수의 UI 노드 찾기

    onNode, onNodeWithTag, onNodeWithText, onNodeWithContentDescription을 통해 UI 노드를 찾을 때의 한계 onNode- 구문을 사용해 UI 노드를 찾으면 한 번에 한 개의 노드 밖에 찾기 못한다. 예를 들어 다음과 컴포저블에 대해 Smile이라는 텍스트를 가진 모든 UI 노드를 찾아 클릭하는 테스트를 해야 한다고 해보자. class OnAllNodesTest { @get:Rule val composeRule = createComposeRule() @Test fun onNodeAllNodes() { // Given val isClicked = Array(4) { false } composeRule.setContent { Column() { EmojiTex..

    [Android UI Test] onNode와 Matcher 사용해 UI 노드 찾기

    onNodeWithTag, onNodeWithText, onNodeWithContentDescription을 통해 UI 노드를 찾을 때의 한계점 onNodeWith- 구문을 사용해 UI 노드를 찾게 되면, 특정한 조건 하나만을 가진 UI 노드를 찾게 된다. 만약 같은 값을 공유하는 UI 노드가 있다면 둘 중 하나만이 선택되며, 그 둘을 구분할 수 있는 방법은 없다. 예를 들어 다음과 같이 같은 Smile이라는 이름을 가진 EmojiText Composable이 두 개 있다고 해보자. class OnNodeTest { @get:Rule val composeRule = createComposeRule() @Test fun onNodeWithProblem() { // Given var isSecondSmile..

    [Compose Canvas] Stroke의 cap 사용해 선과 경로의 양끝 모양 설정하기 : StrokeCap

    Stroke의 cap 프로퍼티는 무엇을 하는가? Canvas를 다루면서 수많은 선과, 경로를 만들어낸다. 선과 경로를 만들어내는 것까지는 좋은데, 해당 선과 경로는 생각보다 아름답지 않다. 예를 들어 아래와 같은 코드를 만들어보자. @Preview(widthDp = 400, heightDp = 600) @Composable fun DrawCap() { Canvas( modifier = Modifier .fillMaxSize() .background(Color.White), onDraw = { val path = Path().apply { moveTo(100.dp.toPx(), 100.dp.toPx()) // 시작점 변경 lineTo(200.dp.toPx(), 500.dp.toPx()) // (100, 1..

    [Compose UIs] Compose Filled Slider 라이브러리 사용해 슬라이더 만들기

    Filled Slider 란? 이번에 Compose용 Filled Slider 라이브러리를 배포했다. Filled Slider은 볼륨 컨트롤이나 밝기 제어 등에 사용할 수 있는 채워지는 형태의 슬라이더 입니다. Filled Slider 라이브러리에서 제공하는 슬라이더는 가로 모드 세로 모드, 슬라이더 모양 설정, Continuous Discrete, 터치 민감도 설정 등 많은 기능들을 지원한다. GitHub : https://github.com/seyoungcho2/FilledSliderCompose GitHub - seyoungcho2/FilledSliderCompose: Provides Filled Slider for Jetpack Compose Provides Filled Slider for Jet..