【Android】ActionBarに検索バーを表示する

ActionBarは、ActionViewというウィジェットを表示する領域が存在します。 ActionViewは、表示するメニューアイテム(ボタン)と連動して対応するウィジェットを表示することが可能です。

今回は、ActionViewに検索バー(SearchView)を表示してみます。

1.メニューリソースを定義

ActionViewのメニューリソースは、以下の2種類の方法で定義することが可能です。

①android:actionViewClass属性を使う場合

menu/menu.main

<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:id="@+id/searchView"
        android:icon="@android:drawable/ic_menu_search"
        android:showAsAction="always"
        android:title="hogehoge"
        android:actionViewClass="android.widget.SearchView"/>
</menu>

②android:actionLayout属性を使う場合

menu/menu.main

<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:id="@+id/searchView"
        android:icon="@android:drawable/ic_menu_search"
        android:showAsAction="always"
        android:title="hogehoge"
        android:actionLayout="@layout/layout_search"/>
</menu>

layout/layout_search.xml

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

2.ソースの実装

ActionViewのインスタンスは、MenuItemインスタンスのgetActionView()メソッドで取得が可能です。
以下のサンプルでは、SearchViewで入力した文字をTextViewに反映しています。

public class MainActivity extends Activity implements OnQueryTextListener {
    TextView mTextView;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        mTextView = (TextView) findViewById(R.id.textView);
    }

    @Override
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        
        // SearchViewを取得する
        MenuItem searchItem = menu.findItem(R.id.searchView);
        final SearchView searchView = (SearchView) searchItem.getActionView();
        searchView.setOnQueryTextListener(this);
     
        return true;
    }
    
    @Override
    public boolean onQueryTextChange(String newText) {
        return false;
    }

    @Override
    public boolean onQueryTextSubmit(String query) {
        // テキストViewに検索文字列を表示
        mTextView.setText(query);
        return false;
    }
}