web-dev-qa-db-ja.com

ナビゲーションパネル(Google+とYouTube)

誰もが今日のトップアプリのいくつかのようにスライディングメニューを実装する方法を知っていますか?

他のスタックオーバーフロー の質問 はこれを行う方法について何の答えもありませんでしたので、他の人を助けるためにできるだけ多くの情報を集めるようにしています。私が以下で言及するすべてのアプリケーションはスライドメニューを実行する素晴らしい仕事をします。

1. Google Plus(7/7/12現在)

Google+ slide out menu screenshot

左上隅にあるG +ロゴをクリックすることによってのみ、最初の画面から2番目の画面に進むことができます。画面全体がその位置から移動し、画面の右側(操作バーを含む)に移動していることに注意してください。最初の画面に戻るには、右側をスライドさせて焦点を合わせるか、またはG +アイコンをもう一度クリックします。

2. YouTube(7/7/12現在)

YouTube slide out menu screenshot

2つの方法で最初の画面から2番目の画面に進むことができます。左上のYouTubeロゴをクリックするか、スワイプジェスチャーを使用してそれを右に移動できます。これはすでにG +アプリとは異なります。次に、アクションバーが表示されたままになっていることがわかります(G +とは異なります)。最後に、元の画面に戻すためには、G +のように機能します。

395
EGHDK

#3を編集:

Navigation Drawerパターンは、Androidのドキュメントに正式に記載されています。

enter image description here 以下のリンクをチェックしてください。

  • 設計書はここで見つけることができます
  • 開発者用ドキュメントはここで見つけることができます

編集2:

Roman Nurik(GoogleのAndroidデザインエンジニア)は、(YouTubeアプリのように)引き出しを開くときにアクションバーを動かさないことをお勧めします。これを見る Google+の投稿


編集1:

私はしばらく前にこの質問に答えました、しかし私はPrixingがそこに最高のフライアウトメニューを持っていることを再び強調しています...はるかに。それは絶対に美しく、完全に滑らかで、そしてそれはFacebook、Google +、そしてYouTubeを恥ずかしがります。 EverNoteもなかなかいいですが…それでもPrixingほど完璧ではありません。フライアウトメニューがどのように実装されたかについて この一連の投稿 をチェックしてください。 Prix​​ing自身で開発者をしています!).


元の答え:

Adam PowellとRichard Fulcherは、このことについて「Androidでのナビゲーション」というタイトルのGoogle I/Oの講演で 49:47 - 52:50 に話しています。

彼らの答えを要約すると、この記事の投稿時点でのスライドアウトナビゲーションメニューはnotであり、公式にはAndroidアプリケーション設計標準の一部です。お気づきかもしれませんが、現時点ではこの機能に対するネイティブサポートはありませんが、サポートパッケージの今後の改訂にこれを追加することについての話はありました。

YouTubeとG +のアプリに関しては、動作が異なるのは変です。 YouTubeアプリがアクションバーの位置を固定した理由は、

  1. YouTubeアプリを使用するユーザーにとって最も重要なナビゲーションオプションの1つは検索です。これはアクションバーのSearchViewで実行されます。ユーザーがalwaysに新しいビデオを検索するオプションを与えることができるので、アクションバーを静的にすることは理にかなっています。

  2. G +アプリはその内容を表示するためにViewPagerを使用しています。そのため、レイアウトの内容に特化したプルアウトメニュー(つまり、アクションバーの下のすべて)を作成しても意味がありません。スワイプは、グローバルナビゲーションの手段ではなく、ページ間をナビゲートする手段を提供することになっています。これが、G +アプリとYouTubeアプリのやり方で違うやり方をすることを決めた理由かもしれません。

    別のメモとして、Google Playアプリで別のバージョンの「引き出しメニュー」をチェックしてください(一番左のページにいるときは、左にスワイプして引き出すと、「半ページ」メニューが表示されます)。

これはあまり一貫性のない動作ではないというのは正しいのですが、Androidチーム内でこの動作をどのように実装するべきかについて100%のコンセンサスがあるようには見えません。将来、両方のアプリのナビゲーションが同一になるようにアプリが更新されても、私は驚かないでしょう(話題のすべてのGoogle製アプリでナビゲーションの一貫性を保つことに非常に熱心でした)。

152
Alex Lockwood

つい最近、 "RibbonMenu"と呼ばれる現在のGithubプロジェクトをフォークし、それを自分のニーズに合うように編集しました。

https://github.com/jaredsburrows/RibbonMenu

目的は何ですか

  • 使いやすさ:スライドインおよびスライドアウトするメニューへの簡単なアクセスを許可する
  • 実装の容易さ:最小限のコードで同じ画面を更新
  • 独立性:ActionBarSherlockのようなサポートライブラリを必要としません
  • カスタマイズ:色やメニューの変更が簡単

新着情報

  • スライドアニメーションをFacebookとGoogle+のアプリに合うように変更しました
  • 標準のActionBarを追加しました(ActionBarSherlockの使用を選択できます)
  • メニューを開くために使用されたメニュー項目
  • メインアクティビティのListViewを更新する機能を追加しました
  • FacebookやGoogle+のアプリに似た、2つのリストビューをメニューに追加しました
  • 実装例を示すためにAutoCompleteTextViewとButtonを追加しました。
  • 開いているときにメニューを非表示にするために、ユーザーが「戻るボタン」を押すことができるようにするメソッドを追加
  • FacebookやGoogle+のアプリとは異なり、ユーザーは背景(メインのListView)とメニューを同時に操作できます。

メニューなしのアクションバー

ActionBar with Menu out

メニューが出て検索が選択されているアクションバー

ActionBar with Menu out and search selected

15
Jared Burrows

Googleのマテリアルデザインガイドラインに準拠した(およびAPI 10までの互換性のある)NavigationDrawerの素晴らしい実装があります - MaterialDrawerライブラリ (GitHubへのリンク) 。これを書いている時点で、2017年5月現在、それは積極的に支持されています。

それは Maven Centralレポ で利用可能です。 Gradle依存関係の設定

compile 'com.mikepenz:materialdrawer:5.9.1'

Mavenの依存関係の設定

<dependency>
    <groupId>com.mikepenz</groupId>
    <artifactId>materialdrawer</artifactId>
    <version>5.9.1</version>
</dependency>

enter image description hereenter image description here

5
naXa

私はこれが古い質問であることを知っていますが、最新の答えはあなたの人生を楽にするでしょう Android Support Designライブラリ を使うことです。

2
Sotti

個人的にはGoogle Driveの公式アプリのnavigationDrawerが好きです。それだけで動作し、素晴らしい作品。ナビゲーションドロワーを開閉するための重要なポイントであるため、ナビゲーションドロワーはアクションバーを動かすべきではないことに同意します。

それでもその振る舞いを得ようとしているのであれば、私はSherlockNavigationDrawerというプロジェクトを最近作成しました。期待どおりにはActionBarSherlockを使用したNavigation Drawerの実装であり、それ以前のハニカムデバイスでも動作します。確認してください。

SherlockNavigationDrawer github

2
Nicolas Jafelle