코린이 탈출기

chapter 10.5 - 커스텀 액션바 만들기 본문

인터넷 강의/클래스101 - 비전공자들을 위한 나만의 안드로이드 앱 만들기

chapter 10.5 - 커스텀 액션바 만들기

50HEE 2021. 6. 14. 12:05

기존까지 만들었던 프로젝트의 경우에는 맨 위에 액션바를 안드로이드에서 제공하는 것으로만 사용하였습니다.

안드로이드에서 제공하는 액션바는 상단에 보라색 배경에 흰 글씨로 프로젝트의 이름을 띄웠습니다.

이번에는 위의 액션바를 커스텀하여 사용하는 방법을 알아보겠습니다.

 

 

액션바를 커스텀하기 위해 xml을 새로 만들겠습니다.

 

간단하게 검은색에 흰 글씨가 쓰여있는 액션바의 xml을 만들었습니다.

높이의 경우 60dp로 설정하였습니다.

 

MainActivity.kt로 와서 액션바를 불러오겠습니다.

12번째 줄은 기본 액션바를 변수로 설정해서 불러오는 것입니다. 이 화면에는 액션바를 무조건 띄울 것이기 때문에 !!를 붙여서 null일 수 없다는 것을 표시합니다.

위에서 만든 기본 액션바의 변수를 사용하여 액션바의 모드를 커스텀 지원으로 설정하겠습니다. 14번 줄과 같습니다.

커스텀 지원으로 설정하였으면 이제 실제로 어떤 커스텀바를 사용할 것인지를 설정합니다. 16번 줄과 같습니다.

 

위 코드까지 작성하고 에뮬레이터를 실행하면 위의 화면처럼 사이드에 기존의 보라색 액션바가 보입니다.

즉, 양 옆의 여백의 부분을 들고 있는 커스텀이 따로 있다는 것입니다.

여백을 없애기 위해 여백의 부분을 들고 있는 toolbar를 불러서 설정을 하겠습니다.

 

위의 코드 뒷부분에 작성하였습니다.

우선 커스텀뷰를 들고 있는 toolbar를 변수로 저장하겠습니다.

19번 줄과 같이 toolbar를 변수로 설정하여 기존 액션바에서 커스텀한 뷰를 불러서 캐스팅을 해주었습니다.

 

2021.05.18 - [안드로이드/클래스101 - 비전공자들을 위한 나만의 안드로이드 앱 만들기] - chapter 7.5 - 타입 변환 - casting

 

캐스팅할 때에는 androidx가 주는 Toolbar를 사용합니다.

20번째 줄은 설정한 변수를 불러서 양 옆의 여백의 크기를 Int로 설정합니다. 즉, 오른쪽과 왼쪽의 여백을 설정합니다.

 

 

여기까지 작성을 하면 원하는 모양의 액션바를 만들 수 있습니다.

 

 

 

추가적으로 더 다루어보겠습니다.

액션바에 버튼을 달아서 토스트를 띄워보겠습니다.

 

 

커스텀 액션바를 만드는 xml로 가서 버튼을 만들어보겠습니다.

 

MainActivity.kt로 와서 액션바에 있는 버튼을 눌렀을 때 토스트를 띄워보겠습니다.

버튼을 눌렀을 때 토스트를 띄우려면 기존에는 onCreat 함수 내에 setOnClickListener 기능을 불러 설정하였습니다.

하지만 액션바에서 버튼을 사용하는 방법은 조금 다르게 합니다. 

액션바에 있는 UI를 담아줄 변수를 만들어줍니다. 이 변수의 경우 멤버변수로 만들어줍니다. 12번 줄과 같습니다.

담아둔 변수를 이용하여 버튼을 실행할 때에는 onCreate 함수 내에 작성합니다.

만들어둔 버튼의 id를 어디에서 찾을 것인지를 설정해야 합니다. 27번 줄과 같이 만들어둔 버튼을 기존 액션바를 커스텀한 액션바에서 id를 이용해 찾으라는 것입니다.

마지막으로 29 ~ 31번 줄과 같이 토스트를 띄우면 됩니다.

 

2021.04.21 - [안드로이드/클래스101 - 비전공자들을 위한 나만의 안드로이드 앱 만들기] - chapter 3.2 - 기초 이벤트 처리, 로그, 토스트 활용하기

 

 

 

여기까지 나만의 커스텀 액션바를 만들어서 토스트를 띄우는 이벤트를 추가해보았습니다.

 

토스트를 띄우는 경우에는 12, 27번 줄을 지워서 바로 토스트를 띄워도 상관은 없습니다.

하지만 만약에 액션바에 뒤로가기 버튼을 달아준다면 액션바를 사용하는 모든 화면에서 뒤로가기 버튼에 대한 이벤트 처리를 각각 코딩해주어야 합니다.

이러한 번거로움을 줄이고자 멤버변수를 만들어서 사용해줍니다.

Comments