[안드로이드 코틀린] DrawerLayout Navigation 만드는 방법 part1 - 화면 만들기

이번에는 옆으로 밀면 숨겨져 있는 메뉴를 보여주는 DrawerLayout 화면 만드는 방법을 알아보겠습니다. 

---

목차

1. 실행 화면
2. 라이브러리 등록
3. 테마 설정
4. 툴바 화면 만들기 toolbar_layout.xml
5. 메인 화면 구성 activity_main.xml
6. 메인 코드 구현 MainActivity.kt

---

1. 실행 화면

2. 라이브러리 등록

build.gradle(Module:프로젝트명:app)

dependencies 괄호 안에 아래 코드를 넣어주시면 됩니다.

implementation 'com.google.android.material:material:1.6.1'

 

3. 테마 설정

( res -> value -> themes)

<style name="Theme.KotlinExam" parent="Theme.MaterialComponents.DayNight.NoActionBar">

 

4. 툴바 화면 만들기 toolbar_layout.xml

 - 설명 -

메인화면(activity_main) 에서 액션바(ActionBar)로 사용될 Layout

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:theme="@style/ThemeOverlay.MaterialComponents.Dark.ActionBar">

</androidx.appcompat.widget.Toolbar>

 

 

 

5. 메인 화면 구성 activity_main.xml

- 설명 -

1. 메인은 DrawerLayout

2. 커스텀으로 만든 Toolbar_layout 적용

3. 메뉴가 들어갈 NavigationView

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <include layout="@layout/toolbar_layout" />
    </LinearLayout>

    <com.google.android.material.navigation.NavigationView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:fitsSystemWindows="true" />

</androidx.drawerlayout.widget.DrawerLayout>

 

6. 메인 코드 구현 MainActivity.kt

 - 설명 -

직접 만든 toolbar를 액션바(ActionBar)로 지정

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val toolbar: Toolbar = findViewById(R.id.toolbar)

        //액션바에 toolbar 셋팅
        setSupportActionBar(toolbar)
    }
}

2021.01.19 - [안드로이드] - [안드로이드] DrawerLayout Navigaion 쉽게 만들어보기

[안드로이드] DrawerLayout Navigaion 쉽게 만들어보기

2022.06.29 - [안드로이드] - [안드로이드 코틀린] 큐알코드(QR CODE) 스캔하는 방법

[안드로이드 코틀린] 큐알코드(QR CODE) 스캔하는 방법

2022.06.30 - [안드로이드] - [안드로이드 코틀린] 전화 걸기(Intent.ACTION_VIEW) 기능 만들어보기

[안드로이드 코틀린] 전화 걸기(Intent.ACTION_VIEW) 기능 만들어보기