29

FB や G+ アプリのようなスライド メニューを実装したいのですが、FB メニュー デモhttps://github.com/jfeinstein10/SlidingMenuからいくつかのサンプル コードを見つけました。

これらはそもそも良いものですが、私はそれらから何か余分なものが必要です. ここのようにメニューボタンのクリックだけで動きますが、ジェスチャーでも動かしたいです。中央のビューがあり、その中央を右に移動すると1つのビューが表示され、左に移動するとメニューが表示されるという動作が必要です。3 つのビュー A、B、C があり、C を左にスワイプすると A が表示され、C を右にスワイプすると B が表示されるとします。C は A と B の真ん中にあります。

1.中景が右に移動

その画面が真ん中です右に移動 メニューが表示されます

2.中央のビューを左側に移動します

タッチで左に移動 左に移動3 番目のビュー

ここで私の質問は次のとおりです。そのようなビューを作成するためのベスト プラクティスは何ですか。フラグメントとビューページャーも使用する必要があると誰かから聞いたことがあります。では、どうすればこれを開発できますか?誰かが行ったサンプル実装はありますか? どんな助けや提案も大歓迎です。

参考までに、このタイプのスライド式白黒ビューを使用するこのアプリを参照してくださいSkout アプリ

4

4 に答える 4

17

最も簡単な解決策は、プロジェクトREADMEに基づいて、ベゼルスワイプが組み込まれているandroid-undergarmentを使用することです。

ユーザーは、画面の左側からベゼルをスワイプして引き出しを開き、右側から同じようにして閉じることで、引き出しを制御することもできます。このタッチ機能を防ぎたい場合は、setDrawerEnabled(false)を呼び出すことができます。

于 2012-10-29T18:38:06.557 に答える
12

TranslateAnimationフェード用のポップアップとメニュー用の別のポップアップウィンドウとともに、移動したいビューで簡単に使用できます。アプリケーションに実装しましたが、魅力的に機能します。
この画像は、アニメーションやその他のコンポーネントが必要な場合を示しています


コード:

public class SlidingOptionsMenuActivity extends Activity {

    /**
     * Signifies that the menu is already visible
     */
    boolean alreadyShowing = false;
    /**
     * Width of the current window
     */
    private int windowWidth;
    /**
     * Height of the current window
     */
    private int windowHeight;
    /**
     * Reference of the {@link PopupWindow} which dims the screen
     */
    private PopupWindow fadePopup;
    /**
     * The translate animation
     */
    private Animation ta;
    /**
     * The view which needs to be translated
     */
    private RelativeLayout baseView;
    /**
     * Reference of the {@link LayoutInflater}
     */
    LayoutInflater inflater;

    /*
     * (non-Javadoc)
     * 
     * @see android.app.Activity#onCreate(android.os.Bundle)
     */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        Display display = getWindowManager().getDefaultDisplay();
        windowWidth = display.getWidth();
        windowHeight = display.getHeight();
        inflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        findViewById(R.id.btnOptions).setOnClickListener(new OnClickListener() {

            /*
             * (non-Javadoc)
             * 
             * @see android.view.View.OnClickListener#onClick(android.view.View)
             */
            @Override
            public void onClick(View v) {
                if(!alreadyShowing){
                    alreadyShowing = true;
                    openSlidingMenu();
                }
            }
        });
    }


    /**
     * Fades the entire screen, gives a dim background
     */
    private void showFadePopup() {
        final View layout = inflater.inflate(R.layout.fadepopup, (ViewGroup) findViewById(R.id.fadePopup));
        fadePopup = new PopupWindow(layout, windowWidth, windowHeight, false);
        fadePopup.showAtLocation(layout, Gravity.NO_GRAVITY, 0, 0);
    }

    /**
     * Opens the sliding Menu
     */
    private void openSlidingMenu() {
        showFadePopup();
        // The amount of view which needs to be moved out. equivalent to the
        // width of the menu
        int width = (int) (windowWidth * 0.6f);
        translateView((float) (width));
        int height = LayoutParams.FILL_PARENT;
        // creating a popup
        final View layout = inflater.inflate(R.layout.option_popup_layout,(ViewGroup) findViewById(R.id.popup_element));

        final PopupWindow optionsPopup = new PopupWindow(layout, width, height, true);
        optionsPopup.setBackgroundDrawable(new PaintDrawable());

        optionsPopup.showAtLocation(layout, Gravity.NO_GRAVITY, 0, 0);

        optionsPopup.setOnDismissListener(new PopupWindow.OnDismissListener() {

            public void onDismiss() {
                //Removing the fade effect
                fadePopup.dismiss();    
                //to clear the previous animation transition in
                cleanUp();
                //move the view out
                translateView(0);
                //to clear the latest animation transition out
                cleanUp();
                //resetting the variable
                alreadyShowing = false;
            }
        });
    }

    /**
     * This method is responsible for view translation. It applies a translation
     * animation on the root view of the activity
     * 
     * @param right The position to translate to
     */
    private void translateView(float right) {

        ta = new TranslateAnimation(0f, right, 0f, 0f);
        ta.setDuration(300);
        ta.setFillEnabled(true);
        ta.setFillAfter(true);

        baseView = (RelativeLayout) findViewById(R.id.baseView);
        baseView.startAnimation(ta);
        baseView.setVisibility(View.VISIBLE);
    }

    /**
     * Basic cleanup to avoid memory issues. Not everything is release after
     * animation, so to immediately release it doing it manually
     */
    private void cleanUp(){
        if (null != baseView) {
            baseView.clearAnimation();
            baseView = null;
        }
        if (null != ta) {
            ta.cancel();
            ta = null;
        }
        fadePopup = null;
    }
} //END of Class
//END of file

これが役立つことを願っています。

実際のスクリーンショット。

于 2012-11-02T09:21:29.947 に答える
10

私が見つけた非常に優れた別のオープン ソース ライブラリは、SlidingMenuです。「メニュー」のクリックとベゼルのスワイプで引き出しを開閉できるので、ニーズに合うはずです。これをActionBarSherlockjohannilsson の android-actionbarライブラリなどの Actionbar ライブラリと統合するには、ライブラリ プロジェクトのコードを 1 ~ 2 行変更するだけです。SlidingMenu ライブラリの Readme には、ABSherlock ライブラリとの統合方法が説明されています。

SlidingMenu サンプル プロジェクトでは、さまざまな引き出しの開閉アニメーションが示されていることに注意してください。これらは、このスタイルのメニュー/ナビゲーションで私が見た中で最高のアニメーションの一部です.

于 2012-11-02T00:34:22.427 に答える