자, 이제 첫 번째 Jetpack Compose Android 앱을 만들어 보도록 하겠습니다
그러므로 New Project로 가야 하겠지요
이제는 드디어 No Activity 대신 Empty Activity를 선택합니다
이 프로젝트 윈도우의 Phone and Tablet에서 Empty Activity를 선택한 다음
여기 있는 Next를 클릭합니다
그러고 나면 애플리케이션에 이름을 붙일 수 있습니다
저는 UnitConverter(단위 변환기)라고 부르겠습니다
첫 번째 동영상에서는 환율 계산기라 불렀었습니다만
어느 단위든 변환할 수 있으니 사실상 단위 변환기입니다
환율도 계산할 수 있고 다른 단위도 계산할 수 있습니다
나머지는 모두 초기 설정으로 둡니다
Kotlin DSL 등등을 그대로 사용할 것입니다
그러니 Finish를 클릭하여 줍시다
그러면 새로운 윈도우가 뜨는데 이전 윈도우는 닫아 주면 됩니다
저번 동영상에서의 BankAccountProgram 윈도우는 닫겠습니다
그러면 이제 아름다운 Kotlin 애플리케이션을 만들 준비가 되었습니다
Gradle에서 프로젝트의 환경을 설정해야 하기 때문에 조금 걸리는 것을 볼 수 있습니다
여러분의 기기 성능에 따라 오래 걸릴 수도 있고 얼마 안 걸릴 수도 있습니다
완료될 때까지 기다리겠습니다
보시면 코드가 단계별로 작성되는
준비 과정이 보입니다
저는 총 1분 정도 걸린 거 같습니다만
여러분의 기기 성능에 따라 천차만별일 것입니다
좋습니다
준비가 끝났습니다
1일차에서 보았던 것과
사용자 인터페이스(UI)와 같은 구조가 모두 같습니다
잠깐 요약드리자면 저는 지금 Android 폴더 내부의 Project에 있습니다
Android가 기본 폴더로 설정되어 있습니다
만약 기본값으로 안 되어 있다면 여러분도 설정하여 주십시오
그렇게 하면 따라오기 쉬워집니다
그 다음에는 app 폴더와 Gradle 프로젝트들이 있습니다
지금 관심 있는 것들은 대부분 kotlin+java 내부에 있습니다
여기에는 프로젝트와 가지고 있는 패키지들의 이름이 있습니다
그리고 ui.theme(UI 테마)와 MainActivity도 있습니다
여기서 대부분의 작업이 이루어질 것입니다
지금으로서는 너무 복잡한 작업은 하지 않겠습니다
UI 내부에 logic(로직)을 구축할 것인데
별로 권장되는 방법은 아니지만 초반에는 해도 괜찮습니다
간단한 애플리케이션에서는 문제가 발생하지 않습니다
하지만 나중에는 어떻게 유지 가능하고 구조가 깔끔하도록
앱을 최적화하는지도 알아보겠습니다
지금으로서는 너무 앞서 간 이야기입니다
지금은 시작이니까 말입니다
그러면 시작할 때에는 무엇을 신경 써야 할까요?
처음에는 MainActivity class(클래스)에 주목하여야 합니다
이제는 class(클래스)가 무엇인지 아실 것입니다
class(클래스)가 무엇인지는 알지만 component activity나
inheritance 같은 용어는 무슨 뜻인지 모르실 것입니다
이것들은 나중에 강좌에서
필요해졌을 때 다룰 것입니다
그 class(클래스)를 이용하는 다른 class가 아니라 해당 class가 직접 등장할 때 말입니다
여기 override가 있습니다
fun,
그리고 override에 대하여 onCreate
즉 특정 기능을 하는 onCreate function(함수)입니다
그런데 그 원래 implementation은 무시하고 원하는 방식으로 function이 작동하도록 하는 것입니다
처음에는 일반적인 implementation이 실행되지만 그 다음에는 우리의 커스텀 코드가 실행됩니다
그리고 이것이 그 코드입니다
setContent UnitConverterTheme입니다
이것이 앱의 테마이고
다음으로 Surface는 애플리케이션의 배경입니다
그리고 Surface 내부에는 Greeting(“Android")라는 텍스트가 있습니다
이제 Device Manager를 열어 Pixel 에뮬레이터와 Android AVD를 실행합시다
Composable(컴포저블)은 이미 있는 것이 보입니다
이 UnitConverterTheme은 Composable입니다
이 윈도우는 Windows에서는 Ctrl, Mac에서는 Command 키를 누르면 열립니다
그 다음 이 이름을 클릭합니다
그러면 Theme 파일이 열리는데
그 내부에 UnitConverterTheme function이 있는 것이 보입니다
Composable은 사실상 하나의 function인데
특정 기능을 하는 특수한 function이라고 보시면 됩니다
이 function에는 특정 parameter(매개변수)가 필요합니다
예를 들자면 테마를 결정하는 darkTheme이 있습니다
Boolean이라고 되어 있습니다
이것은 true 또는 false 값을 가집니다
이 윈도우는 닫겠습니다
isSystemInDarkTheme은 시스템을 보고
만약 다크 모드로 설정되어 있으면 다크 테마로 만들고
아니라면 라이트 테마로 만듭니다
dynamicColor 역시 Boolean입니다
다음으로 content가 보이는데, 이것도 Composable이며 pass(패스)가 가능합니다
Composable을 pass하도록 되어 있습니다
그러면 해당 Composable은 이곳에 있는 코드를 실행하는데
이 when 문장으로부터 생성된 색채 배합을 이용하는
다크 테마를 이 colorScheme을 이용하여 만듭니다
다음으로 typography입니다
텍스트가 어떻게 표시되는지 정하며 content는 MaterialTheme의 content(내용)가
이곳에서 생성된 content가 되도록 합니다
좋습니다
아주 수준이 높은 내용입니다
보시다시피 이 코드는 아주 많은 내용을 담고 있는데, 저는 여러분께
이 UnitConverterTheme이 무슨 역할을 하는지 간단하게 보여드리고자 하였습니다
간단히 설명하자면 알맞은 색채의 테마를 사용하도록 만드는 내용입니다
Surface는 애플리케이션의 배경입니다
이제 앱을 실행해 볼 차례인데, 그 전에 축소를 해야겠습니다
축소하여도 보시는 데는 문제 없을 것입니다
View로 가서 Appearance를 변경하겠습니다
IDE를 150% 확대로 바꿉니다
강의를 태블릿 등으로 보고 계셔도
아직 잘 보이실 것 같습니다
자, 이제 가상 Pixel 7에 앱을 실행하도록 해 주는
Run 버튼이 있습니다
다시 한 번 실행하여 보겠습니다
1일차에서도 한 번 실행해 보았습니다
하지만 시간이 조금 지났기 때문에, 반복해서 보여드리려고 합니다
이전보다 이해되는 부분들이 늘어났을 것입니다
Surface는 보셨듯이 하나의 function에 불과하지요
여기 기기가 실행되고 있는 것이 실시간으로 보입니다
이렇게 윈도우를 띄워 놓도록 하겠습니다
이러면 제가 더 잘 제어할 수 있게 됩니다
여기를 보시면 화면 맨 위에 Hello Android라고만 표시되고 있습니다
이제 Surface라는 function에게 parameter(매개변수)를 pass(전달)합니다
modifier(수정자)를 pass함으로써 Surface의 각종 설정을 변경합니다
fillMaxSize라고 되어 있습니다
Modifier에게 fillMaxSize라는 function이 있는데
이 function이 호출됩니다
그러면 Surface는 화면 전체를 채우도록 설정됩니다
즉 이 배경은 애플리케이션 화면 전체를 채웁니다
그 다음에 배경, 또는 Surface에 무슨 색을 사용하고 싶은지
이곳에 알려줍니다
배경 색은 UnitConverterTheme 내부에서 정의된
MaterialTheme의 colorScheme(색채 배합)에서 가져올 것입니다
즉 화이트 모드, 다른 말로 낮 모드 또는 라이트 모드라면 배경은 흰색이어야 하고
아니라면 검은색이어야 합니다
검은색은 아니고 어두운 회색 등이겠네요
적어도 그럴 것이라고 생각합니다
기기의 테마를 바꾸어 보면 알아낼 수 있습니다
그러니 환경설정으로 가서
Pixel에서는 어떻게 환경설정을 하는지 봐야겠습니다
저는 Pixel을 사용하지 않는데, 다크 모드를 검색해 보겠습니다
dark
찾았습니다
다크 테마를 켭니다
됐습니다
잠시 기다려야 합니다
이제 애플리케이션으로 돌아갑시다
이제 보시다시피 다크 테마가 적용되었습니다
배경 색이 어두워졌습니다
Hello Android라는 텍스트도 색이 바뀌었습니다
이 테마에는 배경이나 배경 색에 대한 코드뿐만 아니라
폰트에 관한 정보도 포함되어 있습니다
즉 폰트는 무슨 색이어야 하는지 말입니다
전과 같이 흰 바탕에 검은색 글씨로 표시되는 것이 아니라
검은 바탕에 흰 글씨가 되었습니다
잠시 시간을 내어 한 번 보여드리고 싶었습니다
그 다음에는 역시 Composable type(유형)인 Greeting이라는 function이 있습니다
이것은 특수한 function인데, 화면에 표시할 수 있는
사용자 인터페이스(UI)를 생성하는 function입니다
이것에게 Android라는 variable(변수)를 넘기는데, 그 값은 Android로 되어 있어 Hello Android로 표시될 것입니다
왜냐하면 Greeting function(함수)는, 이제는 function이 무엇이며 parameter(매개변수)가
무슨 역할을 하는지 알고 있으므로, parameter(매개변수) 몇 개를 가진다는 것이 이해됩니다
예를 들어 name이라 이름 붙여진 Text나 기본값이 Modifier로 되어 있는 modifier(수정자)가 있습니다
우리는 modifier를 직접 설정할 필요도 없습니다
그런데 Text 내부에도 modifier가 필요합니다
보시면 Text 역시 일종의 함수임을 알 수 있지요?
Composable(컴포저블) 함수입니다
오버라이드가 가능한 수많은 parameter들을 가지고 있지만,
우리가 이것들을 오버라이드 할 필요는 없습니다
어떤 것들은 오버라이드가 가능하고, 다른 것들은 그대로 두어도 됩니다
텍스트에 대한 수많은 설정들을 추가하는 것이 가능합니다
즉 Text에 parameter 여러 가지를 추가할 수 있다는 것입니다
font size(폰트 크기), font style(폰트 스타일), font weight(폰트 굵기), font family(글꼴) 등등을 모두 변경할 수 있습니다
텍스트의 정렬 방식도 정할 수 있습니다
그런데 pass하여야 하는 parameter type(유형)을 보시면 단순 텍스트가 아닙니다
String을 pass하면 되는 text를 제외하면, 다른 것들은 모두
더 복잡한 데이터 유형입니다
이 parameter의 데이터 type은 TextUnit입니다
TextUnit은 무엇일까요?
이것은 하나의 텍스트 단위가 무엇인지 정의하는 클래스입니다
즉 텍스트 단위를 정의하는 프로토타입 또는 템플릿인 것입니다
그리고 이것을 이용하여 폰트 크기를 정할 수 있습니다
그런데 또 FontStyle이라는 것이 있는데 이것도 마찬가지로 클래스이며, 뒤에 물음표까지 붙어 있습니다
이렇게 여러분이 아직 모르시는 것들이 있지만, 지금으로서는 몰라도 괜찮습니다
단계별로 내용을 배워나갈 것입니다 지금 이해가 가능한 미가공 데이터 type들이 보입니다
maxLines과 minLines
그리고 Boolean인 softWrap입니다
그래서 이 데이터 type들은 쉽게 이해가 되지만 다른 것들은 조금 더 복잡합니다
이것들을 변경하고 싶다면 더 자세한 내용을 배워야 합니다
하지만 지금으로서는 여러분이 function과 parameter, class가 무엇인지에 대하여
더 이해를 잘 하게 되셨다는 것을 보여드리고 싶었습니다
모든 부분을 아시는 것은 아니지만
이 모든 것이 조금 더 잘 이해되실 것입니다
이번 동영상은 꽤 길었지만, 이것들에 대하여 정말 설명드리고 싶었습니다
아무것도 이해가 안 된 채로 코드만 입력하게 되시지 않기를 바라기 때문입니다
그래서 짧게 소개를 드렸습니다
좋습니다
이제 다음 동영상으로 넘어가서 사용자 인터페이스에 몇 가지를 더하여 봅시다