본문 바로가기
안드로이드 웹앱 콘테츠 개발자 양성(국비지원)/Android 화면 구성 기능(디자인- xml 과 java로 제어)

Android Studio Navigation Drawer + ToolBar

by 차누감 2019. 9. 27.

◎Material Design : Gogle 디자인 가이드 라인

①Navigation Drawer

②Toolbar

③AppBar Layout, TabLayout

 

구상

<최종 실행 화면>

첫 화면의 제목부터 없애자.

activity 화면에 방금 만든 테마 적용
그러면 제목줄이 없어지고, 새로운 모습을 볼 수 있다.
사이드 화면을 만들기 전에, 전면 화면 구성

 

이 줄은 운영체제가 자동으로 적당한 사이즈를 구해준다. (핸드폰, 테블릿 등등)

이제 사이드 만들자 (그러기 위해선 library추가 해야함.)

추가한 것을 Gradle Scripts에 app에서 확인 할 수 있다.
사이드 드로우어 메뉴를 만듬. 위 사진은 자동 생성이 안되서, 직접 타이핑 했다.. 원래 되는데
이제 사이드 메뉴의 헤더를 만들자.
위 사진처럼 헤더쪽 구성이 끝났다.
사이드 메뉴에 방금 만든 헤더를 붙이고, 미리 그 아래에 들어갈 메뉴를 붙이자.(미리 붙이고 메뉴를 만들거임)
메뉴를 만들기 위해 res에 menu 추가 작업
미리 보기는 저렇게 나오지만, 사이드에 붙였기 때문에 실행 화면은 다를 것이다.
지금까지 만든 Toobar를 화면에 보이기 위해선 .java파일에 코드 작성이 필요!! id를 주고 제어

 

.java 파일에 코드를 작성하면 실행 시, 만든 화면들이 잘 보인다.
동작은 잘 되지만 ,사이드에 테마 적용 했듯이, 첫 화면의 제목도 테마 적용할거임.
(배경색과 제목글 색을 바꿨다.)
Tollbar에 테마 적용 (배경색과 제목글 색을 바꿨다.)

이제 사이드 메뉴의 아이콘과 첫 화면의 삼선 목록, 흰색 테마 입히자.

 

 

첫화면 제목이 가운데 정렬해보자.

그럴려면 제목을 따로 만들어야 한다.

 

그런데, 우리가 원하는 모습이 아니다. .java에 이 코드만 써주자.

<실행 화면>

 

댓글