[안드로이드 앱 만들기] firebase의 database 어플 #7(toolbar)

▷ 이전글:『[안드로이드 앱 만들기] firebase의 database 어플 #6(firebase upload)』

이번에는 거추장스러운 안드로이드 기본 툴바를 없애고, 필요한 부분에만 툴바를 만들고 뒤로가기 버튼을 추가해보겠습니다. 

왼쪽은 툴바가 있을 때, 오른쪽은 없앴을 때 입니다. 

물론 위에 화면처럼, 두번째 액티비티부터는 뒤로가기 버튼을 포함한 툴바가 필요합니다. 이제 이렇게 바꿔보도록 하겠습니다. 

1. manifests 설정

툴바를 없애는 것은 manifests의 style에서 바꿀 수 있어요. manifests로 갑니다. 

<application> 안에 아래와 같은 <theme>가 있습니다.

android:theme="@style/AppTheme"

이 부분을 Ctrl+마우스 왼쪽 클릭!

그럼, app → res → values → styles.xml로 이동하게 됩니다. 

물론 manifests를 거치지 않고 바로 이동해도 된답니다.

styel.xml

<!-- Base application theme. -->
<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>

Theme.AppCompat.Light.DarkActionBar의 "DarkActionBar" 부분을 "NoActionBar"로 바꿔줍니다. 

2. Xml 수정

이제 모든 액티비티에서 툴바가 없어진 것을 확인할 수 있어요. 하지만 두번째 액티비티부터는 툴바가 필요한 경우가 있습니다. 이제 수동으로 툴바를 만들어주고, 뒤로가기 버튼을 달아보도록 할게요.

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/set_date"
        android:text="database 저장"
        android:textSize="15dp"
        android:textStyle="bold"
        android:layout_gravity="center"
        android:textColor="@android:color/white"/>
</android.support.v7.widget.Toolbar>

이 코드를 각 xml에 넣어줍니다. (물론, text 부분과 id부분은 입맛에 맞게 바꿔줘야겠죠? ㅎㅎ)

3. Activity 코드 수정

xml까지만 수정한다면 뒤로가기가 없는 툴바가 만들어집니다. 이제 Java에서 뒤로가기 버튼을 만들어볼게요. 

각 Activity의 onCreate 아래 setContentView(R.layout.xxx) 아래에 다음 코드를 넣어줍니다.

setSupportActionBar((Toolbar) findViewById(R.id.toolbar));
ActionBar ab = getSupportActionBar();
ab.setDisplayHomeAsUpEnabled(true);
ab.setDisplayShowTitleEnabled(false);

그리고, onCreate 밖, 제일 아래부분에 다음 코드를 넣어줍니다. 

@Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();

        switch(id) {
            case android.R.id.home:
                finish();
                return true;
        }
        return super.onOptionsItemSelected(item);
    }

정말 간단하죠? ㅎㅎ

정확히 말하면 finish();를 사용해 뒤로가기가 아닌 액티비티를 닫아주는 거예요. 

전체 코드는...

AddActivity.java

package com.tistory.hamzzibari.upload_firebase;

import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;

import com.google.firebase.database.DatabaseReference;
import com.google.firebase.database.Exclude;
import com.google.firebase.database.FirebaseDatabase;

import java.util.HashMap;
import java.util.Map;

public class AddActivity extends AppCompatActivity {

    DatabaseReference mDatabase;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.add);
        setSupportActionBar((Toolbar) findViewById(R.id.toolbar));
        ActionBar ab = getSupportActionBar();
        ab.setDisplayHomeAsUpEnabled(true);
        ab.setDisplayShowTitleEnabled(false);

        //아이디 정의
        Button add_savebtn = (Button) findViewById(R.id.add_savebtn);
        final EditText add_title = (EditText) findViewById(R.id.add_title);
        final EditText add_url = (EditText) findViewById(R.id.add_url);

        //온클릭리스너
        add_savebtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //edittext에 저장된 텍스트 Strig에 저장
                String get_title = add_title.getText().toString();
                String get_url = add_url.getText().toString();

                //hashmap 만들기
                HashMap result = new HashMap<>();
                result.put("title", get_title);
                result.put("url", get_url);

                //firebase 정의
                mDatabase = FirebaseDatabase.getInstance().getReference();
                //firebase에 저장
                mDatabase.child("article").push().setValue(result);

            }
        });
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();

        switch(id) {
            case android.R.id.home:
                finish();
                return true;
        }
        return super.onOptionsItemSelected(item);
    }

}

add.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".AddActivity"
    android:orientation="vertical">
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/set_date"
            android:text="database 저장"
            android:textSize="15dp"
            android:textStyle="bold"
            android:layout_gravity="center"
            android:textColor="@android:color/white"/>
    </android.support.v7.widget.Toolbar>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:textStyle="bold"
        android:textSize="21sp"
        android:layout_marginTop="50dp"
        android:layout_marginBottom="50dp"
        android:layout_gravity="center_horizontal"
        />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_margin="3dp"
        android:background="@color/line_color"/>
    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:id="@+id/add_title"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:padding="5dp"
            android:textSize="15sp"
            android:inputType="text"
            android:background="@null"
            android:imeOptions="actionNext"
            android:hint="제목"/>
    </android.support.design.widget.TextInputLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_margin="3dp"
        android:background="@color/line_color"/>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <EditText
        android:id="@+id/add_url"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:padding="5dp"
        android:textSize="15sp"
        android:inputType="text"
        android:imeOptions="actionDone"
        android:background="@null"
        android:hint="URL"/>
    </android.support.design.widget.TextInputLayout>
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_margin="3dp"
        android:background="@color/line_color"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp">

        <Button
            android:id="@+id/add_savebtn"
            style="@style/Widget.AppCompat.Button.Borderless"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:textColor="@color/orange"
            android:padding="5dp"
            android:text="저장"
            android:textSize="15sp"
            android:textStyle="bold"
            android:theme="@style/MyButton" />
    </LinearLayout>

</LinearLayout>

AndroidManifests.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    package="com.tistory.hamzzibari.upload_firebase">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme"
        android:usesCleartextTraffic="true"
        tools:ignore="GoogleAppIndexingWarning">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".AddActivity" />
        <activity android:name=".ListActivity" />
        <activity android:name=".ModiDelActivity"/>
        <activity android:name=".WebViewActivity"/>
    </application>

</manifest>

입니다. ㅎㅎ

toolbar는 디자인할때 굉장히 유용하므로 꼭 알아두시기 바랍니다^^

▷ 다음글:『[안드로이드 앱 만들기] firebase의 database 어플 #8(RecyclerView)』