ページ

▼

2013/05/01

[Android]タイトルバーにカスタムレイアウトを表示する

iOSみたいにタイトルバーにボタンを入れたかったのでカスタマイズしてみた。
ついでにタイトルも中央揃えにして iOS っぽさを増してみた。

一応2つの方法があるので両方書いておく。
  1. requestWindowFeature(Window.FEATURE_CUSTOM_TITLE) を使う方法
  2. layout を include して擬似タイトルバーを表示する方法

1. requestWindowFeature(Window.FEATURE_CUSTOM_TITLE) を使う方法

@Override
public void onCreate(Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
    setContentView(R.layout.activity_main);
    getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.activity_main_title);
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="44dp" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:gravity="center_vertical"
        android:text="@string/appName"
        android:textColor="@android:color/white"
        android:textSize="18sp"
        android:textStyle="bold" />

    <ImageButton
        android:id="@+id/infoButton"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="@android:color/transparent"
        android:contentDescription="@string/infoButton"
        android:src="@android:drawable/ic_menu_info_details" />

</RelativeLayout>
こちらが正統派なタイトルバーのカスタマイズ。
ImageButton を使用していてデフォルトの高さでは残念なコトになるので高さを変更する必要がある。
[Android]タイトルバーの高さを変更する | DevAchieve

2. layout を include して擬似タイトルバーを表示する方法

@Override
public void onCreate(Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="44dp" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:gravity="center_vertical"
        android:text="@string/appName"
        android:textColor="@android:color/white"
        android:textSize="18sp"
        android:textStyle="bold" />

    <ImageButton
        android:id="@+id/infoButton"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="@android:color/transparent"
        android:contentDescription="@string/infoButton"
        android:src="@android:drawable/ic_menu_info_details" />

</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <include layout="@layout/activity_main_title" />

    <!-- コンテンツのレイアウト -->

</LinearLayout>
こちらは擬似タイトルバーなので NoTitleBar 入りのテーマを AndroidManifest.xml で指定する必要がある。