안드로이드 UI 레이어

• UI란 무엇인가를 생각해봤을 때 화면에 데이터를 시각적으로 표시하고 사용자와 상호작용하는 역할을 수행하는 것을 의미한다. 사용자 상호작용이란 버튼을 클릭하거나 스크롤을 내리는 등의 행위를 의미한다.

• 이 UI 레이어에는 데이터를 표시할 수 있는 형태로 변환되어 전달되어야 한다. 즉, UI에서 raw 데이터를 가공해서 표현하는 행위를 해서는 안된다.

• UI는 다음과 같이 구성될 수 있다.

데이터를 어떻게 보여줄것인가?

• 위 그림에서 볼 수 있듯이 앱에서 사용자에게 표시하는 부분을 UI Elements라고 하고 그 UI Elements가 가지고 있는 상태들을 UI State라고 한다. UI State에는 해당 UI를 보는데 필요한 정보들 (로그인 유무, 접근가능한지 등)을 담고 있다.

1
2
3
4
5
6
7
8
9
10
11
12
13

data class NewsUiState(
val isSignedIn: Boolean = false,
val isPremium: Boolean = false,
val newsItems: List<NewsItemUiState> = listOf(),
val userMessages: List<Message> = listOf()
)

data class NewsItemUiState(
    val title: String,
    val body: String,
    val bookmarked: Boolean = false,
    ...
)

• 위와 같은 코드가 있을 때 NewsUiState클래스는 뉴스의 메인 화면을 의미하며 로그인, 프리미엄 등에 따라 보이는게 달라져야 하며 NewsItemUiState는 제목, 내용, 북마크 유무 등이 들어갈 수 있다.
• UI 자체에서 상태를 변경할 수 없도록 val타입으로 선언해주었는데, 그 이유는 만약 실수든 고의든 상태가 변경되면 동일한 정보가 다른 곳에서 사용되어 데이터 불일치와 같은 버그가 발생할 수 있기 때문이다.

이후 부분은 이해가 잘 안돼서 나중에 정리할 예정이다..
https://developer.android.com/jetpack/guide/ui-layer