돌아오신 것을 환영합니다
이번 동영상에서는 Button(버튼)과, Toast(토스트)의 원리에 대하여 소개드리겠습니다
Toast는 도대체 무엇이냐고 묻고 싶으실 수도 있습니다
잼을 발라먹는 그 토스트는 아닙니다
Android(안드로이드) 사용자이시라면 많이 보셨을 것인데
애플리케이션에 나타나는 팝업입니다
빠르게 Button(버튼)을 생성하여 봅시다
Row 내부에 Button을 만들었습니다
이 Column들은 사실 필요 없습니다
Button을 생성할 것인데, 이것 역시 Composable의 일종입니다
추가해 줍니다
implement(구현)하기 위하여 Button에 필요한 것은 onClick 하나뿐이며
Button의 내용 역시 입력할 수 있습니다
예를 들어 이곳에 텍스트를 입력하여
button(버튼) 중앙에 표시될 텍스트를 정할 수 있습니다
이 button은 MyButton이라고 부르겠습니다
그러면 이곳에 MyButton이라고 표시됩니다
이렇게 보입니다
사용자 인터페이스(UI)가 업데이트되었습니다
이제 MyButton이라고 표시됩니다
또 다른 문구로 Click Me(클릭하시오)라고 쓸 수도 있겠습니다
Click Me!
사람들이 클릭하게 만드는 것입니다
그러면 몇 초 후에 이곳에서도 보입니다
그런데 button(버튼)을 클릭하여 어떻게 무언가를 할 수 있을까요?
지금으로서는 아무 일도 일어나지 않습니다
onClick method(메소드)가 아무것도 하지 않고 있기 때문입니다
TODO라고만 쓰여 있습니다
좋습니다
button(버튼)을 봅시다
button을 클릭해 보면
애니메이션이 발생하는 것이 보입니다
button의 기본적인 행동입니다
작아서 잘 안 보이실 수도 있습니다만 움직이는 것이 보입니다
하지만 실제로 무언가를 display(표시)하거나 상호작용을 하려면 어떻게 하여야 할까요?
이번 예시에서 할 일은 아주 간단합니다
Toast(토스트)를 display(표시)할 것입니다
그렇게 하기 위해서는 Toast가 어디에 display될 것에 대한 context(콘텍스트)가 필요합니다
그러면 context(콘텍스트)는 무엇일까요?
context는 애플리케이션의 어느 위치에서
주어진 명령이 실행될 것인지에 대한 맥락을 뜻합니다
Composable(컴포저블) function(함수) 내부에 실행되어야 한다고 입력하겠습니다
즉 context는 현재 Composable인 UnitConverter 로컬 context의 내부여야 합니다
이제 저는 LocalContext.current라는 context를 생성하겠습니다
local context(로컬 콘텍스트)라는 context가 존재합니다
사용하려고 하면 붉은색으로 이렇게 표시되는 것이 보입니다
이때는 import을 해 주어야 합니다
LocalContext라는 property(속성)입니다
이것을 실행하고 나면 글씨가 보라색으로 변합니다
이제 맨 위에 있는 androidx.compose.ui.platform
이것이 import된 것입니다
이제 Toast(토스트)를 사용할 때에 필요한 local context를 얻었습니다
Toast를 작성하기 위하여 Toast Composable(컴포저블)을 사용합니다
위쪽에 이미 import가 되어 있는 것이 보이는 이 android.widget에 포함된
Toast라는 class(클래스)가 있습니다
android.widget.Toast에서 자동으로 import됩니다
이제 이 makeText method(메소드)를 call(호출)하여 정보를 몇 가지 pass(전달)하여야 합니다
text(텍스트), duration(지속시간), 그리고 맨 앞의 context입니다
방금 생성한 context를 pass해 줍시다
다음으로 display(표시)하고 싶은 텍스트를 입력해 주어야 합니다
저는 "Thanks for clicking!(클릭해 줘서 고마워요!)"라고 입력하겠습니다
그 다음에는
가독성을 위하여 줄을 바꾸겠습니다
"Thanks for clicking!" 다음에는
Toast를 얼마나 오래 표시할지 결정하는 실수를 입력하여야 합니다
기본값이 두 가지 존재합니다
그 두 가지는
Toast.LENGTH_LONG과 Toast.LENGTH_SHORT입니다
Toast를 꽤 오랫동안 표시하는 LENGTH_LONG을 사용합시다
무엇을 하고 있는지
여러분께 더 잘 보일 수 있도록
이것도 줄을 바꾸겠습니다
이제 Toast(토스트)를 생성하였지만, 실행을 하고 있지는 않습니다
Toast가 실행되어 실제로 보이도록 하기 위해서는
이 코드 맨 뒤에 .show()를 붙여야 합니다
Toast.LENGTH_LONG) 바로 뒤에 말입니다
지금 코드가 아주 많습니다
정확히 무슨 일이 일어나고 있는 것일까요?
아까 생성한 이 Button(버튼)이 있습니다
이 중괄호( {} ) 내부에 버튼에 적힌 텍스트가 있습니다
괄호로 인하여 분리되어 있습니다
다음 Button에게 pass(전달)되는 정보가 있습니다
즉 parameter(매개변수)들입니다 parameter 중 하나는 onClick입니다
onClick은 무언가를 실행하도록 되어 있어야 합니다
설명으로부터 알 수 있습니다
괄호 안에 든 명령을 실행할 것입니다
명령은 중괄호로 둘러싸여야 합니다
다음으로 중괄호의 안에서 누군가가 버튼을 클릭하여
onClick event(이벤트)가 발생하는 순간 실행될 코드를 implement(구현)하면 됩니다
지금은 Toast를 이용하여 화면에 텍스트를 표시하려 하고 있습니다
그리고 makeText라는 이 method(메소드)를 사용하기 위해서는 context(콘텍스트)를 pass하여야 합니다
그 외에도 표시 시간을 pass하여야 합니다
이렇게 하여 Toast(토스트)가 생성됩니다
하지만 Toast를 보이도록 하기 위해서는
.show() method 역시 call(호출)하여야 합니다
이제 실행하여 보겠습니다
혹시 context에 대해 잊으셨다면 이곳에서 생성한 것입니다
이제 실행하여 화면에 나타나는 모습을 보도록 합시다
클릭하면 아래에 이렇게 Thanks for clicking!이라고 표시됩니다
한 번 더 해보겠습니다
아래쪽의 이것이 Toast(토스트)라는 것입니다
좋습니다
이제 여러분은 Toast(토스트)가 무엇인지 알게 되셨습니다
또한 Toast의 사용 방법도 배우셨으며
버튼의 상호작용 기능도 보셨습니다
다음 동영상에서는 Button(버튼)에 다르게 접근하여 보겠습니다
버튼을 드롭다운 메뉴를 여는 데 사용할 것입니다
다음 영상에서 뵙겠습니다