툴바 만들기

앱을 만들 때 위에 있는 바에 기능들을 넣고 싶다는 생각이 들어서 툴바를 만들어 보기로 했다.

보통 앱 상단에 위치하는 바를 AppBar라고 부르는 듯하고 그 안에 두 가지로 나뉘어 ActionBar와 ToolBar가 있다는 것 같다. Android 3.0(API 11) 버전부터 스튜디오에서 제공하는 기본적인 테마를 사용하면 ActionBar 디폴트 값 같은 느낌으로 제공되었다고 하는데, 최근에 들어오는 새 기능 들은 보통 ToolBar 라이브러리에 등록된다고 한다.

 

 

Empty Activity로 시작한다. 해야 할 일이 총 4가지 있다.

☞ res/layout 디렉터리에 툴바 리소스 파일 생성

☞ res/values/styles.xml 파일 내용 수정

☞ activity_main.xml 파일에 툴바 리소스 파일 등록

☞ MainActivity.java 에 기능 입력하기

 

1. res/layout 디렉터리에 툴바 리소스 파일 생성

왼쪽에 있는 창을 보면 res라는 디렉터리가 있는데 이는 resourse를 의미하고, 레이아웃이나 문자열, 디자인 소드 등의 형식들을 저장하는 곳이다. res 디렉터리에서 layout - New - Layout Resource File 순으로 클릭하면 다음과 같은 화면이 나올텐데

• File name : toolbar (기능에 맞는 이름)
• Root element : androidx.appcompat.widget.Toolbar

작성하고 OK 버튼을 누르면 layout 디렉토리 안에 xml 파일이 하나 생성된 것을 볼 수 있다. toolbar.xml 파일의 내용은 다음과 같다.

 

2. res/layout 디렉터리에 툴바 리소스 파일 생성

styles.xml 파일을 처음 들어가면 위와 같은 내용이 적혀있는데 바꿔줘야 하는 내용이 있다. 

 

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> 에서 parent의 내용을 Theme.AppCompat.Light.NoActionBar으로 변경한다.

 

그렇다. styles.xml 은 ActionBar의 디자인 내용에 대해 작성하는 파일이다. parent가 Theme.AppCompat.Light.DarkActionBar 인 경우에는 (바로 위 내용) toolbar.xml 파일의 background를 오렌지색으로 바꿔도 액션바 비활성화를 하지 않았기 때문에 styles.xml의 내용을 우선순위로 둔다.

 

3. activity_main.xml 파일에 툴바 리소스 파일 등록

activity_main.xml 파일에 아까 layout 디렉터리 안에 작성한 toolbar.xml 경로를 알려준다. 그러면 toolbar.xml 에서 background로 지정한 색이 툴바 배경색으로 출력된다.

 

4. MainActivity.java 에 기능 입력하기

 

툴바에 만들 수 있는 기능이야 여러 가지 있겠지만 블루투스에 쓸 연결 버튼을 만들어봤다.

res 디렉터리에서 오른쪽 버튼을 눌러 리스소 파일을 하나 생성한다.

File name :  menu_toolbar (대문자는 사용할 수 없다.)

Resoure type: Menu

 

작성하고 OK 버튼을 누르면 텅 빈 menu 파일이 디렉터리와 함께 생성된다.

android:icon에 기본 블루투스 모양이 있어서 아이콘을 등록했다. showAsAction은 노출 여부다. 블루투스 연결을 위해 항상 있어야 해서 always로 했다.

 

서브액티비티를 하나 만들어준다.

새 액티비티를 만들었다. 툴바에 있는 Connect 메뉴를 누르면 새 액티비티로가는 코드를 작성할 것이다.

새로 생긴 클래스와 xml 파일에는 툴바에 있는 블루투스 버튼을 눌렀을 때 새액티비티로 이동하는 것을 만들어준다.

 

※ MainActivity.java

※ bluetoothDeviceLists.java

※ activity_bluetooth_device_lists.xml

툴바 오른쪽의 블루투스 아이콘을 클릭하면 새 액티비티 화면으로 넘어가고 RETURN 버튼을 누르면 다시 toolbarCreate 화면으로 돌아온다. 

만약 툴바에 쓰여있는 toolbarCreate 문자를 바꿔주고 싶다면 res/values/string.xml 에서 수정하면 된다.

 

블루투스앱은 정말 어려웠다. 대신 많이 배웠으니 기분은 좋다.