(Kotlin) Activity에 Toolbar 만들기

Kotlin 개발을 시작하면서...

안녕하세요. 

 

안드로이드 개발을 자바로만 하던 왕초보 개발자입니다. 

이번에 새로운 어플을 만들어보려고 하는데, 

요즘 대세는 JAVA가 아니라 Kotlin이라고 하네요?!

 

그래서, 개발하면서 기록도 할 겸

혹, 누군가 저와 같은 처지의 왕초보 개발자들에게 도움이 될 수 있을까 해서 

개발과 블로그를 동시에 진행할까 합니다. 

 

각설하고,

 

Activity에Toolbar 만들기

1. Styles

우선 위에 디자인을 망치며 거추장스럽게 붙어 있는 액션바를 없앱니다.

app > res > valuse > styles.xml

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

 

2. Layout

레이아웃에 android.support.v7.widget.Toolbar를 추가합니다.

app > res > layout > layout.xml

	<android.support.v7.widget.Toolbar
			android:id="@+id/toolbar"
			android:layout_width="match_parent"
			android:layout_height="wrap_content"
			android:background="@color/colorPrimary" 
			tools:ignore="MissingConstraints">
		<TextView
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:id="@+id/set_date"
				android:text="@string/search"
				android:textSize="17sp"
				android:textStyle="bold"
				android:layout_gravity="center"
				android:textColor="@android:color/white"/>
	</android.support.v7.widget.Toolbar>

android:id="@+id/toolbar"

툴 바 안에 TextView에 제목을 입력해줍니다.

 

3. Kotlin

onCreate부분에 아래 코드를 추가해줍니다.

app > java > Activity.kt

        val toolbar = findViewById(R.id.toolbar) as Toolbar
        setSupportActionBar(toolbar)
        val ab = supportActionBar!!
        ab.setDisplayShowTitleEnabled(false)

위에 툴바가 생겼습니다. 이제 여기에 뒤로가기 버튼도 만들어 보겠습니다.

 

 

Toolbar에 뒤로가기 버튼 만들기

1. Kotlin

위에서 만든 코드에 아래의 한 줄을 추가해줍니다. 

app > java > Activity.kt

        ab.setDisplayHomeAsUpEnabled(true)

onCreate의 바깥부분에 override로 아래 코드를 추가해줍니다.

override fun onOptionsItemSelected(item: MenuItem): Boolean {
        val id = item.itemId
        when (id) {
            android.R.id.home -> {
                finish()
                return true
            }
        }
        return super.onOptionsItemSelected(item)
    }

 

끝.