2016-12-13

【Android Studio】為 app 加入查詢 / 尋找 / 搜尋 功能

參考資料 ----
Search Overview
Setting Up the Search Interface
Creating a Search Interface
Material icons

Android 本身就有提供查詢的功能讓開發者可以很快開發出具有查詢功能的 app;若您開發的 app 打算裝置在 Android 3.0(含) 以上,官方建議將搜尋功能顯示在 App Bar

Google 提供一套開發者使用的 app 圖示,先去下載 查詢的 "放大鏡" 圖示,解壓後,將各解析度的圖示放在相對應的 /res/drawable-?dpi/ 資料夾,並變更圖檔檔名為 ic_search


編輯 /res/values/strings.xml
 
<resources>
    <string name="app_name">searchtest</string>
    <string name="search_title">搜尋標題</string>
    <string name="search_hint">提示</string>
</resources>
 



/res/ 下建立 xml 資料夾



新增 /res/xml/searchable.xml
 
<?xml version="1.0" encoding="utf-8"?>

<searchable
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:label="@string/app_name"
    android:hint="@string/search_hint" />

<!-- android:label 要與 application 相同 -->
 


在  /res/menu/ 建立一個 options_menu.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">
 
    <item android:id="@+id/search"
          android:title="@string/search_title"
          android:icon="@drawable/ic_search"
          app:showAsAction="collapseActionView|ifRoom"    
          app:actionViewClass="android.support.v7.widget.SearchView" />

    <!-- 注意最末這 2 行開頭要與第 5 行一致,在本例為 "app" -->
</menu>
 


MainActivity.java 程式內容:
 
import android.app.SearchManager;
import android.content.Context;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuInflater;

// 注意這裡, Android Studio 預設會幫您引入 import android.widget.SearchView
// 但我們要的是 android.support.v7.widget.SearchView;
import android.support.v7.widget.SearchView;

...
...

@Override
public boolean onCreateOptionsMenu(Menu menu)
{
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.options_menu, menu);

    // Associate searchable configuration with the SearchView
    SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
    SearchView searchView = (SearchView) menu.findItem(R.id.search).getActionView();
    searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName()));
    
    // 顯示完成鈕
    searchView.setSubmitButtonEnabled(true);

    return true;
}

...
...
 




新增 SearchResultActivity,在版面內放一個 TextView,用以顯示傳遞查詢字串
 

<RelativeLayout
    ...
    ...>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="search result"
        android:id="@+id/txt1"/>

</RelativeLayout>

 


SearchResultActivity.java 程式內容:
 
public class SearchResultsActivity extends AppCompatActivity
{
    TextView txt1;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_search_results);

        txt1 = (TextView) findViewById(R.id.txt1);

        // 注意這一行指令
        handleIntent(getIntent());
    }


    @Override
    protected void onNewIntent(Intent intent)
    {
        handleIntent(intent);
    }


    private void handleIntent(Intent intent)
    {
        if (Intent.ACTION_SEARCH.equals(intent.getAction()))
        {
            String query = intent.getStringExtra(SearchManager.QUERY);
            txt1.setText("傳遞的查詢字串為 "+query.toString());
        }
    }

}
 


修改 AndroidManifest.xml
 
<application
    android:allowBackup="true"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:supportsRtl="true"
    android:theme="@style/AppTheme">

    <!-- Points to searchable activity so the whole app can invoke search. -->
    <meta-data
        android:name="android.app.default_searchable"
        android:value=".SearchResultActivity" />

   ...
   ...

    <!-- 啟動模式設為 singleTop, 才不會每一次查詢, 都要建立 1 個新的 activity -->
    <activity
        android:name=".SearchResultActivity"
        android:launchMode="singleTop">

        <!-- 加入下面的 intent-filter 和 meta-data -->
        <intent-filter>
            <action android:name="android.intent.action.SEARCH" />
        </intent-filter>

        <meta-data
            android:name="android.app.searchable"
            android:resource="@xml/searchable"/>
    </activity>
 


執行畫面


 查詢結果畫面


相關筆記 ----
【Android Studio】為 app 加入查詢 / 尋找 / 搜尋 功能 -- 查詢 & 結果在同一個畫面內

沒有留言:

張貼留言