407

今日のトップアプリのようなスライドメニューを実装する方法を知っている人はいますか?

他のスタック オーバーフローの質問には、これを行う方法に関する回答がありませんでした。そのため、他の人を助けるためにできるだけ多くの情報を収集しようとしています。以下で説明するすべてのアプリケーションは、スライド メニューの実装に優れています。

1. Google プラス (2012 年 7 月 7 日現在)

Google+ スライド アウト メニューのスクリーンショット

最初の画面から 2 番目の画面に移動するには、左上隅にある G+ ロゴをクリックします。画面全体がその位置から移動し、画面の右側に移動することに注意してください (アクション バーを含む)。最初の画面に戻るには、右側をスライドしてフォーカスを戻すか、G+ アイコンをもう一度クリックします。

2. YouTube (2012 年 7 月 7 日現在)

YouTube スライドアウト メニューのスクリーンショット

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

4

5 に答える 5

154

編集#3:

ナビゲーションドロワーのパターンは、Androidのドキュメントで正式に説明されています。

ここに画像の説明を入力してください 次のリンクを確認してください。

  • デザインドキュメントここにあります。
  • 開発者向けドキュメントここにあります。

編集#2:

Roman Nurik(GoogleのAndroidデザインエンジニア)は、(YouTubeアプリのように)ドロワーを開いたときにアクションバーを動かさないことが推奨される動作であることを確認しました。このGoogle+の投稿をご覧ください。


編集#1:

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


元の回答:

AdamPowellとRichardFulcherは、「Androidでのナビゲーション」というタイトルのGoogle I / Oトークで、 49:47〜52:50にこれについて話します。

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

YouTubeアプリとG+アプリに関しては、動作が異なるのは奇妙に思えます。私の推測では、YouTubeアプリがアクションバーの位置を修正する理由は、

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

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

    別の注意点として、Google Playアプリで「プルアウトメニュー」の別のバージョンを確認してください(左端のページにいるときに左にスワイプすると、プルアウトの「ハーフページ」メニューが表示されます)。

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

于 2012-07-08T00:48:53.123 に答える
15

つい最近、「RibbonMenu」と呼ばれる現在のGithubプロジェクトをフォークし、ニーズに合わせて編集しました。

https://github.com/jaredsburrows/RibbonMenu

目的は何ですか

  • アクセスのしやすさ:スライドインおよびスライドアウトするメニューに簡単にアクセスできるようにします
  • 実装のしやすさ:最小限のコードを使用して同じ画面を更新します
  • 独立性:ActionBarSherlockなどのサポートライブラリは必要ありません
  • カスタマイズ:色やメニューを簡単に変更

新着情報

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

メニューアウトのあるActionBar

メニューアウトのあるActionBar

メニューが表示され、検索が選択されたActionBar

メニューが表示され、検索が選択されたActionBar

于 2012-12-19T07:06:06.920 に答える
5

Google マテリアル デザイン ガイドライン (および API 10 まで互換性がある) に準拠した優れた実装がありNavigationDrawerます - The MaterialDrawer ライブラリ(GitHub へのリンク)。2017 年 5 月の執筆時点では、積極的にサポートされています。

Maven Central repoで利用できます。Gradle 依存関係の設定:

compile 'com.mikepenz:materialdrawer:5.9.1'

Maven 依存関係のセットアップ:

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

ここに画像の説明を入力 ここに画像の説明を入力

于 2015-04-27T11:47:31.347 に答える
2

個人的にnavigationDrawerはGoogleドライブの公式アプリが好きです。それはうまく機能し、うまく機能します。ナビゲーション ドロワーを開閉するキー ポイントであるため、ナビゲーション ドロワーがアクション バーを移動するべきではないことに同意します。

あなたがまだその動作を取得しようとしている場合は、私は最近呼び出さSherlockNavigationDrawerれたプロジェクトを作成しました。ご想像のとおり、Navigation Drawer の実装であり、ActionBarSherlockハニカム以前のデバイスで動作します。それを確認してください:

SherlockNavigationDrawer github

于 2013-05-29T14:21:38.793 に答える
2

これは古い質問であることは承知していますが、最新の回答は、あなたの生活を楽にするAndroid Support Design ライブラリを使用することです。

于 2015-07-24T10:59:23.900 に答える