화면을 터치하면 툴바를 보여주는 Toolbar 예제입니다.
다음처럼 동작합니다.
화면을 터치할 때 마다 툴바가 보여졌다 안보여졌다합니다.
아이콘을 선택하면 어떤 메뉴를 선택했는지 보여줍니다.
오른쪽 아이콘을 누르면 추가 메뉴에서 항목을 선택할 수 있습니다.
다음처럼 코드가 작성되었습니다.
1. 타이틀바를 안보이게 하기 위해 styles.xml 파일을 수정합니다.
<resources>
<!-- 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> <!-- No Title Bar--> <item name="windowActionBar">false</item> <item name="windowNoTitle">true</item> </style>
</resources> |
2. res / menu 폴더에 menu_main.xml 파일을 추가하여 다음 내용을 복사합니다.
아이콘은 편의상 프로젝트에 포함되어 있는 것을 사용했습니다. 원한시는 것으로 변경하세요.
<?xml version="1.0" encoding="utf-8"?> <menu 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" tools:context=".MainActivity"> <item android:id="@+id/action_settings" android:orderInCategory="100" android:title="설정" app:showAsAction="never" /> <item android:id="@+id/action_menu1" android:orderInCategory="200" android:title="메뉴1" android:icon="@mipmap/ic_launcher_round" app:showAsAction="always"/> <item android:id="@+id/action_menu2" android:orderInCategory="300" android:title="메뉴2" android:icon="@mipmap/ic_launcher_round" app:showAsAction="always" /> <item android:id="@+id/action_menu3" android:orderInCategory="400" android:title="메뉴3" android:icon="@mipmap/ic_launcher_round" app:showAsAction="always"/> <item android:id="@+id/action_menu4" android:orderInCategory="500" android:title="메뉴4" android:icon="@mipmap/ic_launcher_round" app:showAsAction="always" /> </menu> |
3. layout 폴더에 tool_bar.xml 레이아웃 파일을 추가합니다.
<?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorPrimary" android:elevation="4dp" android:gravity="center_vertical|start" app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<android.support.v7.widget.ActionMenuView android:id="@+id/amvMenu" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"/>
</android.support.v7.widget.Toolbar> |
4. activity_main.xml 파일에 툴바 레이아웃을 포함시킵니다.
어느 버튼을 눌렀는지 보여주기 위해 텍스트뷰를 사용합니다.
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/layout" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity">
<include android:id="@+id/tool_bar" android:layout_height="wrap_content" android:layout_width="match_parent" layout="@layout/tool_bar" />
<TextView android:id="@+id/textview" android:layout_below="@+id/tool_bar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:textSize="25sp" android:text="메뉴를 선택하세요 !" />
</RelativeLayout> |
5. MainActivity.java 파일에 다음 두가지가 구현되어 있습니다.
화면 터치시 마다 툴바 보여주기/숨기기
버튼 클릭시 해당 버튼을 눌렀음을 알려주기
package com.tistory.webnautes.toolbarexample;
import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.ActionMenuView; import android.support.v7.widget.Toolbar; import android.view.Menu; import android.view.MenuInflater; import android.view.MenuItem; import android.view.View; import android.widget.RelativeLayout; import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
private ActionMenuView amvMenu; private TextView textView;
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main);
textView = (TextView)findViewById(R.id.textview);
Toolbar t = (Toolbar) findViewById(R.id.tool_bar); amvMenu = (ActionMenuView) t.findViewById(R.id.amvMenu); amvMenu.setOnMenuItemClickListener(new ActionMenuView.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem menuItem) {
int id = menuItem.getItemId();
switch(id){ case R.id.action_settings: textView.setText("설정을 눌렀습니다."); break;
case R.id.action_menu1: textView.setText("메뉴1을 눌렀습니다."); break;
case R.id.action_menu2: textView.setText("메뉴2를 눌렀습니다."); break;
case R.id.action_menu3: textView.setText("메뉴3을 눌렀습니다."); break;
case R.id.action_menu4: textView.setText("메뉴4를 눌렀습니다."); break; }
return onOptionsItemSelected(menuItem); } });
setSupportActionBar(t); getSupportActionBar().hide(); getSupportActionBar().setTitle(null); //getSupportActionBar().setDisplayHomeAsUpEnabled(true);
// 화면 터치시 툴바 보여주기/숨기기 구현 RelativeLayout relativeLayout = (RelativeLayout)findViewById(R.id.layout);
relativeLayout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) {
if (getSupportActionBar().isShowing()) { getSupportActionBar().hide(); } else { getSupportActionBar().show(); } } });
}
@Override public boolean onCreateOptionsMenu(Menu menu) { MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.menu_main, amvMenu.getMenu()); return true; }
@Override public boolean onOptionsItemSelected(MenuItem item) {
return true; }
} |
마지막 업데이트 2019. 2. 19