오늘 포스팅할 내용은 Toolbar 위젯이다.


Toolbar 위젯이 뭔지 아래의 설명을 보자.


해당 내용은 안드로이드 디벨로퍼 API문서이다.




A standard toolbar for use within application content.

A Toolbar is a generalization of action bars for use within application layouts. While an action bar is traditionally part of an Activity's opaque window decor controlled by the framework, a Toolbar may be placed at any arbitrary level of nesting within a view hierarchy. An application may choose to designate a Toolbar as the action bar for an Activity using the setActionBar() method.



요약하자면, 어플리케이션의 제어를 도와주는 액션바는 스크린의 최상위 뷰인 윈도우 decor에 붙여져 있어 다루기 어렵다.

하지만 toolbar는 어느 뷰에서나 종속관계 상관없이 다채롭게 사용가능하며 actionbar 사용하듯 toolbar를 사용할 수 있다는 내용이다.

머터리얼 디자인이 등장함에 따라 UI의 큰 변화가 있었다. ActionBar를 사용시 구현하기 어려운 경우가 많아 

toolbar란 위젯을 만든거 같다. 자세한 내용을 보고 싶다면 아래의 링크를 참조하길 바란다.

http://developer.android.com/intl/ko/reference/android/widget/Toolbar.html 




해당 위젯은 롤리팝 부터 나온 위젯이기 때문에(API level 21) 만약 하위 os에서 쓰고 싶다면 서포트 라이브러리가 필요하다.


build.gradle에서 dependencies에 아래와 같이 추가해준다.

dependencies {

compile 'com.android.support:appcompat-v7:23.2.1'
compile 'com.android.support:design:23.2.1'

}


actionBar 대신에 toolbar를 쓸 것 이므로, 액션바가 없는 테마로 변경해야한다.


values 폴더에 styles.xml 안에다가 해당 테마를 만들어준다.


<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>



Activity에 붙일 레이아웃을 아래와 같이 작성한다. (main_activity.xml)


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="@style/AppTheme.NoActionBar">
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
app:titleTextColor="#fff"
android:id="@+id/toolbar"
android:background="@color/colorPrimary"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
</android.support.v7.widget.Toolbar>
</LinearLayout>


레이아웃을 작성후 액티비티의 onCreate 메서드에 아래와 같이 작성한다.


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_activity);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setTitleTextColor(Color.WHITE);
}

아래의 이미지는 결과물이다.








포스팅이 도움 되셨다면, 커피 한잔 후원해주세요!
더 좋은 포스팅 작성에 큰 힘이 됩니다.

Buy me a coffeeBuy me a coffee

+ Recent posts