앱은 여러 주제(topic)를 콘텐츠내에 보여준다. 그 중 하나를 클릭하면 해당 주제에 대한 본문이 열리고 표시된다. 본문이 표시되거나 숨겨지면 텍스트가 포함된 카드가 확장 및 축소된다.

TopicRow 컴포저블에서 TODO 3에 대한 코드를 확인하자.

Column(
    modifier = Modifier
        .fillMaxWidth()
        .padding(16.dp)
) {
    // ... 제목과 본문
}

여기에서 Column 컴포저블은 내용이 변경되면 크기가 변경된다. animateContentSize 수정자를 추가하여 크기 변경을 애니메이션할 수 있다.

Column(
    modifier = Modifier
        .fillMaxWidth()
        .padding(16.dp)
        .animateContentSize()
) {
    // ... 제목과 본문
}

앱을 실행하고 주제 중 하나를 클릭한다. 애니메이션으로 확장 및 축소되는 것을 볼 수 있다.

c0ad7381779fcb09.gif

후원하기

카테고리: Compose

0개의 댓글

답글 남기기

Avatar placeholder

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다.