android - Android Facebook スタイルのスライド

Question

新しい Facebook アプリケーションとそのナビゲーションはとてもクールです。私のアプリケーションでどのようにエミュレートできるかを確認しようとしていました。

誰でもそれを達成する方法を知っていますか?

ここに画像の説明を入力

左上のボタンをクリックすると、ページがスライドし、次の画面が表示されます。

ここに画像の説明を入力

score 176 · Accepted Answer

私はこれを自分で試しましたが、FrameLayoutを使用して、メニューの上にカスタムのHorizontalScrollView（HSV）を配置するのが最善の方法でした。HSVの内部にはアプリケーションビューがありますが、最初の子として透過的なビューがあります。これは、HSVのスクロールオフセットがゼロの場合、メニューが透けて見えることを意味します（それでも驚くほどクリック可能です）。

アプリが起動したら、HSVを最初に表示されているアプリケーションビューのオフセットまでスクロールします。メニューを表示する場合は、スクロールして戻って、透明なビューからメニューを表示します。

コードはここにあり、起動アクティビティの下の2つのボタン（HorzScrollWithListMenuおよびHorzScrollWithImageMenuと呼ばれる）は、私が思いついた最高のメニューを示しています。

Androidスライディングメニューデモ

エミュレーターのスクリーンショット（スクロール中）：

エミュレーターのスクリーンショット（スクロール中）

デバイスからのスクリーンショット（フルスクロール）。私のアイコンはFacebookメニューアイコンほど広くないので、メニュービューと「アプリ」ビューは整列していないことに注意してください。

デバイスからのスクリーンショット（フルスクロール）

score 37 · Accepted Answer

このライブラリプロジェクトに、Facebook のようなスライドアウトナビゲーションを実装しました。

アプリケーション、UI、およびナビゲーションに簡単に組み込むことができます。1 つのアクティビティと 1 つのフラグメントのみを実装する必要があります。ライブラリにそのことを知らせてください。そうすれば、必要なすべてのアニメーションとナビゲーションがライブラリによって提供されます。

リポジトリ内には、lib を使用して facebook のようなナビゲーションを実装する方法を示す demo-project があります。これは、デモプロジェクトの記録を含む短いビデオです。

また、このライブラリは、アクティビティトランザクションと TranslateAnimations (フラグメントトランザクションとカスタムビューではない) に基づいているため、この ActionBar パターンと互換性がある必要があります。

現在、最も問題なのは、縦向きと横向きの両方のモードをサポートするアプリケーションでうまく機能させることです。フィードバックがある場合は、github 経由で提供してください。

万歳、
アレックス

score 24 · Accepted Answer

ここに別のライブラリがあり、私の意見では最高のようです。書いてなかった..

アップデート：

このコードは私にとって最もうまくいくようで、G+ アプリと同様にアクションバー全体を動かします。

Google はどのようにしてこれを実現したのでしょうか。Android アプリケーションでの ActionBar のスライド

score 22 · Accepted Answer

Facebookアプリはネイティブコードで書かれていないと思います（ネイティブコードとは、Androidのレイアウトを使用することを意味します）が、webviewを使用し、 sencha などのjavascript uiライブラリを使用しています。sencha フレームワークを使用して簡単に実現できます。

ここに画像の説明を入力

score 20 · Accepted Answer

ここにさらに別の（非常に素晴らしい）オープンソースライブラリがあります！

これの良い機能は、ActionBarSherlockと簡単に統合できることです。

これがgithubプロジェクトのリンクです

これがGooglePlayのダウンロードリンクです

score 17 · Accepted Answer

私は自分のプロジェクトに同様のビューを実装しました。ここで確認できます

これは、私が書いたライブラリに基づくサンプルアプリケーションの画面です。 ActionsContentView の例

このカスタムビューを XML レイアウトの要素として使用するのは簡単です。次に例を示します。

    <shared.ui.actionscontentview.ActionsContentView
      android:id="@+id/content"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:actions_layout="@layout/actions"
      app:content_layout="@layout/content" />

ActionsContentView ライブラリの使用について質問がある場合は、projects Wiki で小さな記事を書くことができます。

このライブラリのいくつかの利点:

タッチでビューをスライドする機能
XMLでアクションバーのサイズを簡単に調整できます
2.0 以降のすべての Android SDK バージョンのサポート

1 つの制限があります。

すべての水平スクロールビューは、このビューの境界では機能しません。

よろしく、スティーブン

score 15 · Accepted Answer

既存の実装のまとめを行い、それをライブラリプロジェクトとサンプルアプリに変えました。また、存在する可能性のあるアクションバーの自動検出だけでなく、XML 解析も追加されたので、ネイティブで動作するだけでなく、ActionBarSherlock などのサポートアクションバーでも動作します。

これもアクションバーをスライドさせます！

全体はライブラリプロジェクトとサンプルアプリであり、Google や facebook アプリのような Android 用のスライドメニューで説明されています。最初のアイデアとコードを提供してくれたsciroccoに感謝します。

ジンジャーブレッドのSlideMenu ActionBar を使用した ICS の SlideMenu

score 10 · Accepted Answer

これはシンプルでエレガントです: https://github.com/akotoe/android-slide-out-menu.git

スナップショット:

ここに画像の説明を入力

score 10 · Accepted Answer

そのライブラリは言及していないと思います：

jfeinstein10 / SlidingMenu

github url:https://github.com/jfeinstein10/SlidingMenu

下位互換性に役立つアクションバーActionBarSherlockで正常に動作します!
ボタンによるスライドだけでなく、右スライドにも対応！

score 8 · Accepted Answer

@Paul Grime からの回答にはまだコメントできませんが、とにかく、ちらつきの問題の修正を彼の github プロジェクトに提出しました....

ここに修正を投稿します。おそらく誰かがそれを必要としています。2 行のコードを追加するだけです。anim.setAnimationListener 呼び出しの下の最初のもの:

anim.setFillAfter(true);

app.layout() 呼び出しの後の 2 つ目:

app.clearAnimation();

お役に立てれば：）

score 6 · Accepted Answer

これは、AbsoluteLayoutと、ビューを負のオフセットに移動して非表示にする単純なスライドコントローラーを使用して実装しました。

興味のある方は、コード/レイアウトをクリーンアップして投稿できます。AbsoluteLayoutが非推奨になっていることは知っていますが、これは非常に単純な実装でした。左側面図/右側面図。「スライドして開く」場合は、左側面図を-Xオフセットからデバイスの幅まで移動します。右側面図に表示したいものは何でもかまいません。

score 4 · Accepted Answer

こんにちは、これは Facebook のようなスライドメニューを提供する最高のサンプルデモアプリです。ここでコードを確認してください

ここに画像の説明を入力

score 3 · Accepted Answer

Android Common Library (ACL) の一部として、独自の SideBar を実装しました。主な利点:

サイドバーは、左、上、下、右の任意の位置に設定できます
メインビューとスライドビューの両方をクリック可能
サイドバーを部分的に表示可能
SideBar のスタイル設定可能な属性により、スタイルの変更が容易になります
Maven リポジトリのアーティファクト
大きな図書館の一部

ソースコード: https://github.com/serso/android-common/tree/master/views/src/main/java/org/solovyev/android/view/sidebar

使用法: https://github.com/serso/android-common/blob/master/samples/res/layout/acl_view_layout.xml

score 3 · Accepted Answer

最近、スライドメニューの実装バージョンに取り組んでいます。人気のある J.Feinstein Android ライブラリ SlidingMenu を使用します。

GitHub でソースコードを確認してください。

https://github.com/baruckis/Android-SlidingMenuImplementation

アプリをデバイスに直接ダウンロードして試してください:

https://play.google.com/store/apps/details?id=com.baruckis.SlidingMenuImplementation

コメントがあるため、コードは自明である必要があります。お役に立てば幸いです！;)

score 2 · Accepted Answer

Android では、ナビゲーションドロワーが追加されました。これを参照

リンク

score 2 · Accepted Answer

これは、非公式の外部ライブラリを追加する必要のない、公式の Android ドキュメントにある設計および開発ガイドです。Androidサポートライブラリのみが行います。ここでリンクを見つけてください。

設計および開発。

score 2 · Accepted Answer

ここで大胆な推測をします...

見えないメニューを表すレイアウトがあると思います。メニューボタンがタップされると、上部のレイアウト/ビューをアニメーション化して邪魔にならないようにし、単にメニューレイアウトの可視性を有効にします。これにより、ビューで z-index の問題が発生することや、ビューがそれをどのように制御するかについては考えていません。

score 1 · Accepted Answer

上記の回答のどこにも言及されている素晴らしいSimonVT/android-menudrawerは見当たりませんでした。だからここにリンクがあります

https://github.com/SimonVT/android-menudrawer

その非常に使いやすく、あなたはそれを左、右、上または下に置くことができます。サンプルコードとApache2.0ライセンスで非常によく文書化されています。

score 1 · Accepted Answer

Facebook Androidアプリは、Fragmentsを使用して構築されている可能性があります。メニューは1つのフラグメントであり、詳細なアクティビティ（ニュースフィード/イベント/友達など）はもう1つのフラグメントです。基本的に、電話のタブレットの「マスター＆ディテール」レイアウト。

score 1 · Accepted Answer

数時間検索した後、Paul Grime のソリューションがおそらく最良のソリューションであることがわかりました。しかし、機能が多すぎます。そのため、初心者には勉強が難しいかもしれません。そこで、Paul のアイデアから生まれた私の実装を提供したいと思いますが、それはよりシンプルで読みやすいはずです。

XML を使用しない Java コードを使用したサイドメニューバーの実装

score 1 · Accepted Answer

私は過去数日間これをいじっていましたが、最終的には非常に簡単で、ハニカム以前でも機能する解決策を思いつきました。私の解決策は、スライドさせたいビューをアニメーション化し(FrameLayout私にとっては)、アニメーションの最後をリッスンすることでした(ビューの左/右位置をオフセットする時点で)。ここに私のソリューションを貼り付けました:ビューの翻訳をアニメーション化する方法

score 1 · Accepted Answer

For info, as the compatibility library starts with 1.6 and this facebook app is also running on devices with Android 1.5, it could not be done with Fragments.

The way you could do it, is : Create a "base" activity BaseMenuActivity where you put all the logic for the onItemClickListener for your menu list and defines the 2 animation ("open" and "close"). At the end/beginning of the animations, you show/hide the layout of the BaseMenuActivity (lets call it menu_layout). The layout for this activity is simple, its only a list with items + a transparent part at the right of your list. This part will be clickable and its width will be the same width as your "move button". With that, you'll be able to click on this layout to start the animation to let the content_layout slide to the left and take the whole screen. For each option (i.e. item of the menu list), you create a "ContentActivity" which extends the BaseMenuActivity. Then when you click on an item of the list, you start your ItemSelectedContentActivity with the menu visible (which you'll close as soon as your activity starts). The layouts for each ContentActivity are FrameLayout and includes the and . You just need to move the content_layout and make the menu_layout visible when you want.

That's a way to do it, and I hope I've been clear enough.

score 0 · Accepted Answer

2012 年 6 月に、Google は Eclipse ADT プラグインに「テンプレート」を追加しました。「マスター/詳細フロー」と呼ばれるテンプレートがあり、まさにそれを行います (フラグメントに基づく)。

android - Android Facebook スタイルのスライド

25 に答える 25

Related

Reference