Android Jetpack Compose

    [Android Compose 부록] 1. Compose Layout, Text에 LTR, RTL 설정하기

    Layout에 LTR RTL 옵션을 주는 방법 Compose의 LTR, RTL 옵션을 변경하는 방법은 CompositionLocalProvider을 이용하는 것이다. CompositionLocalProvider의 vararg로 ProvidedValue 객체를 넘길 수 있는데 이에 대해 LayoutDirectiion.Rtl을 넘기면 RTL이 설정된다. CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl) 이제 Rtl이 적용되길 원하는 레이아웃을 CompositionLocalProvide로 감싸면 완성된다. @Preview(showBackground = true, widthDp = 300, heightDp = 300) @Com..

    [Android Compose Resource] 2. Compose 의 Color 객체 살펴보기

    Compose의 Color객체 기존 안드로이드에서는 Color을 기본적으로 resource폴더의 color.xml상에 정의해놓고 사용했다. 물론 Color가 직접 객체로 설정되는 경우도 있었지만 거의 사용되지 않았다. Compose에서는 더이상 Color을 xml에 정의하지 않는다. Compose에서는 Color을 Color객체로 생성해놓고 사용한다. 자 아래에서 Compose에서 Color을 어떻게 표현하는지 살펴보자. 16진수로 표현하는 Android Compose의 Color 시스템 @Stable fun Color(color: Long): Color { return Color(value = (color.toULong() and 0xffffffffUL) shl 32) } Compose의 Color 시..

    [Android Compose Resource] 1. Android Compose에서 FontFamily 만들기. - Text에 Font 적용시키기

    FontFamily란? FontFamily란 같은 폰트의 모음으로 같은 폰트에 대해 다양한 스타일(굵기)을 포함하는 번들을 뜻한다. Compose에서 FontFamily 만들기 기존 xml 기반의 안드로에서 리소스 시스템에서는 xml에 모든 리소스를 정의했는데 FontFamily도 그 중 하나였다. 하지만, Compose에서는 Color, Shape,Theme, Type에 이어 FontFamily 리소스 또한 코드 상에서 정의하기 때문에 기존과 정의 방식이 달라졌다. 따라서 이번 글에서는 변경된 방식에 맞게 FontFamily를 정의하는 방법을 설명하고자 한다. 준비사항 Compose에서 FontFamily를 만들기 위해서는 2가지 준비사항이 필요하다. Font 다운로드 Android Project에 f..

    [Android Compose State] MutableState을 remember과 함께 다루는 다양한 방법 : 구조분해, by 키워드(Delegation) 사용

    remember이란 Compose는 State값이 바뀌면 Recomposition(재구성)이 일어난다. 이때 이전 State를 기억해야 하는 경우 remember을 이용해 값을 저장할 수 있다. 예를 들어 아래와 같이 remember 없이 textState를 저장할 경우 값이 입력될 때마다 State가 바뀌어 Recomposition이 일어나 textState에 다시 mutableStateOf("")이 세팅되게 된다. class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { val textState = mu..

    [Android Compose Material] 2. Compose TextField 이용해 텍스트 출력하기 : Stateless한 Compose에서 TextField는 어떻게 사용되어야 하는가?

    Stateless한 Compose의 TextField TextField란 텍스트를 입력하는 UI이다. 이 UI는 두가지 부분으로 구성된다. 텍스트를 입력하는 부분(User Interaction) 텍스트를 저장하는 부분(State) 텍스트를 입력하려면 TexrField에 입력된 Text의 상태(State)가 있어야 한다. 기존의 xml에서의 TextField는 Stateful해서 자신의 Text 상태를 직접 저장했다. 즉 위 두가지 부분이 모두 TextField에 존재했다. 하지만, Compose는 Stateless하기 때문에 TextField에는 Text의 상태를 저장하는 공간이 없다. 즉, Compose의 TextField는 텍스트를 입력하는 부분만 있고, 텍스트를 저장하는 부분이 없다. Textfie..