2016-01-04 13 views
6

アクションバーに検索ボタンを含むAndroidアプリを作成しようとしています。ユーザーが検索ボタンを押すと、検索バーが表示されます。 Googleのメッセンジャーアプリ(下記参照) Google's Messenger with collapsed search action. Google's Messenger with expanded search action.AppCompatActivityでSearchViewを使用するとUIのグリッチが発生する

下図のように私はそれを実装しようとしましたが、私のアプリは、次のようになります。 My app with collapsed search action My app with expanded search action

これにはいくつかの問題があります。たとえば、テキストは "elipis"とは異なり、elipsisがない単純な "Search"とは異なり、 "Search ..."と表示されますが、最も重要なことは、ツールバーに戻るボタンがないことです。検索ボタンが押されます右端のオーバーフローボタンが側に押し込まれています。さらに、私のデバイス上の物理的な戻るボタンを押すと、searchviewが崩壊することはありません。それは単にアプリケーションに存在します。

検索バーの実装に使用したコードの一部は次のとおりです。私はSearchViewExpandListenerを以下のように設定しようとしましたが、検索ビューが展開されたときに戻るボタンが表示されますが、機能しません。

EDIT:onMenuItemActionExpandonMenuItemActionCollapsedのメソッドでブレークポイントを使用してアプリを実行しましたが、これらのメソッドは実際には呼び出されませんでした。

MainActivity.java

import android.content.Context; 
import android.support.v4.view.MenuItemCompat; 
import android.support.v4.view.ViewPager; 
import android.support.v7.app.AppCompatActivity; 
import android.os.Bundle; 
import android.support.v7.widget.SearchView; 
import android.support.v7.widget.Toolbar; 
import android.view.Menu; 
import android.view.MenuInflater; 
import android.view.MenuItem; 
import android.widget.Toast; 

public class MainActivity extends AppCompatActivity { 

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

     Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
     setSupportActionBar(toolbar); 
     getSupportActionBar().setDisplayShowHomeEnabled(false); 
    } 

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

     MenuItem searchItem = menu.findItem(R.id.action_search); 
     SearchView searchView = (SearchView) MenuItemCompat.getActionView(searchItem); 
     // See above 
     MenuItemCompat.setOnActionExpandListener(searchItem, new SearchViewExpandListener(this)); 
     MenuItemCompat.setActionView(searchItem, searchView); 

     searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() { 

      @Override 
      public boolean onQueryTextSubmit(String s) { 
       Toast.makeText(MainActivity.this, "You searched " + s, Toast.LENGTH_SHORT).show(); 
       return false; 
      } 

      @Override 
      public boolean onQueryTextChange(String s) { 
       return false; 
      } 
     }); 
     return true; 
    } 

// See above 
    private class SearchViewExpandListener implements MenuItemCompat.OnActionExpandListener { 

     private Context context; 

     public SearchViewExpandListener (Context c) { 
      context = c; 
     } 

     @Override 
     public boolean onMenuItemActionExpand(MenuItem item) { 
      ((AppCompatActivity) context).getSupportActionBar().setDisplayShowHomeEnabled(true); 
      return false; 
     } 

     @Override 
     public boolean onMenuItemActionCollapse(MenuItem item) { 
      ((AppCompatActivity) context).getSupportActionBar().setDisplayShowHomeEnabled(false); 
      return false; 
     } 
    } 
} 

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/action_search" 
     android:title="Search" 
     app:actionViewClass="android.support.v7.widget.SearchView" 
     app:showAsAction="ifRoom"/> 

    <item android:id="@+id/action_about" 
     android:title="About" 
     app:showAsAction="never"/> 
</menu> 

また、この問題を持っている人私だけではないことが表示されます。 This guide on implementing a SearchViewにも同様の問題が発生しているようです。

This guy's problem which is like mine.

のでGoogleのマテリアルデザインのガイドラインではそのような検索バーに及び、そのようなGoogleのメッセンジャーとして自分のアプリでそのような結果AppCompatActivityで検索バーを実装する正しい方法は何ですか?私は過去の間、無限にグーグル・グーグルをしているように感じますが、私を助けるものは何も見つかりません。

+1

try app:showAsAction = "always | collapseActionView"あなたのメニューのaction_searchアイテム –

答えて

3

使用serchViewメニュー項目のshowAsActionalwaysとともにcollapseActionViewフラグ

app:showAsAction="always|collapseActionView" 

collapseActionViewフラグは、ユーザーがそれと相互作用していないウィジェットを表示する方法を示します:ウィジェットアプリバーの上にある場合は、アプリはウィジェットをアイコンとして表示する必要があります。ウィジェットがオーバーフローメニューにある場合は、ウィジェットをメニュー項目として表示する必要があります。ユーザーがアクションビューとやりとりすると、アプリケーションバーを埋めるように展開されます。

+0

私は決してこの単純なソリューションを期待したことはありません。ありがとうございます! – Yharooer

関連する問題