Как создать «перелистывание страниц» на Android - PullRequest
Новая
       17

Как создать «перелистывание страниц» на Android

0 голосов
/ 20 февраля 2012

Я хочу создать приложение с функцией перелистывания страниц.Это должно выглядеть как Pape Flipping Demo В пункте меню есть функция «Перемещение текущей страницы», я хочу, чтобы в моем приложении была эта функция, подробно в 00:33 в этом видео.Любое тело имеет учебник или пример исходного кода об этом?Пожалуйста, помогите мне.

Ответы [ 3 ]

1 голос
/ 20 февраля 2012

Просто используйте ViewPager.Это часть библиотеки поддержки Android v4.Документы API имеют простой код о том, как его использовать.Приложения, такие как Android Market, используют это.

http://developer.android.com/reference/android/support/v4/view/ViewPager.html

0 голосов
/ 23 февраля 2012

Вот код из видео ... это точный код

Вы можете найти все здесь http://typea.info/blg/glob/2010/07/androidx06ht-desire-4.html 

package info.typea.viewflipperapp;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.animation.AnimationUtils;
import android.widget.LinearLayout;
import android.widget.ViewFlipper;

public class ViewFilpperAppActivity extends Activity implements OnTouchListener {
    private static final String LOG_TAG = "MyApp";

    /* コンテキストメニューID */
    private static final int MENU_VIEWFLIP_ANIM  = Menu.FIRST; 
    private static final int MENU_MOVE_NEXT      = Menu.FIRST + 1; 
    private static final int MENU_MOVE_CURRENT   = Menu.FIRST + 2; 

    /* ページ切り替え動作モード　*/
    private int procMode = MENU_VIEWFLIP_ANIM;

    /* ページを切り替える移動量閾値 */
    private final int SWITCH_THRESHOLD = 10;

    /* ページ切り替えモード */
    private final int FLIPMODE_NOMOVE = 0;
    private final int FLIPMODE_NEXT =  1;
    private final int FLIPMODE_PREV = -1;
    private int flipMode = FLIPMODE_NOMOVE;

    private ViewFlipper vf    = null;
    private View currentView  = null;
    private View nextView     = null;
    private View prevView     = null;

    /* ページのIDと順序を管理 */
    private int viewOrder[]   = null;
    private int curIdx = -1;
    private int preIdx = -1;
    private int nxtIdx = -1;

    private int movePageThreshold = 0;
    private float startX;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        LinearLayout layout = (LinearLayout) findViewById(R.id.layout_main);
        layout.setOnTouchListener(this);

        vf = (ViewFlipper) findViewById(R.id.details);

        /* 
         * レイアウトを実行時にインスタンス化し ViewFlipperに格納 
         * 同時に順序をIDで管理する
         * addView(v,idx) で管理できると思いきや、実行時に View と Index の対応が変わってしまうようだ
         */
        LayoutInflater vi = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        int layouts[] = new int[] {R.layout.layout_page1,
                                    R.layout.layout_page2,
                                    R.layout.layout_page3};
        viewOrder = new int[layouts.length];
        for (int i=0; i<layouts.length; i++) {
            View vw = vi.inflate(layouts[i], null);
            // ViewFlipper に格納
            vf.addView(vw);
            // ID管理用配列に保持
            viewOrder[i] = vw.getId();
        }
    }
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // コンテキストメニューで、ページめくりの実装を切り替える
        super.onCreateOptionsMenu(menu);
        menu.add(0, MENU_VIEWFLIP_ANIM, 0, R.string.vewflipper_anim);
        menu.add(0, MENU_MOVE_CURRENT,  0, R.string.current_page_move);
        menu.add(0, MENU_MOVE_NEXT,     0, R.string.next_prev_page_move);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        procMode = item.getItemId();

        // ViewFlipper に設定したアニメーションを解除
        vf.setInAnimation(null);
        vf.setOutAnimation(null);

        return true;
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        boolean ret = false;

        // ページめくりの実装を切り替える
        switch(procMode) {
        case MENU_VIEWFLIP_ANIM:
            ret =  pageFlipWithSimpleAnimation(v, event);
            break;
        case MENU_MOVE_CURRENT:
            ret = pageFlipWithFingerMoveCurrent(v, event);
            break;
        case MENU_MOVE_NEXT:
            ret = pageFlipWithFingerMoveNext(v, event);
            break;
        }
        return ret;
    }

    /**
     * ViewFlipper と アニメーションを利用して単純にページをめくる
     * @param v
     * @param event
     * @return
     */
    public boolean pageFlipWithSimpleAnimation(View v, MotionEvent event) {
        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            startX = event.getX();
            break;
        case MotionEvent.ACTION_UP:
            float currentX = event.getX();
            if (this.startX > currentX ) {
                vf.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_in));
                vf.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_out));
                vf.showNext();
            }
            if (this.startX  < currentX) {
                vf.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_out));
                vf.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_in));
                vf.showPrevious();
            }
        default:
            break;
        }
        return true;
    }

    /**
     * 前のページおよび次のページを移動することによってページをめくる
     * @param v
     * @param event
     * @return
     */
    public boolean pageFlipWithFingerMoveNext(View v, MotionEvent event) {
        float currentX = event.getX();

        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            startX = event.getX();

            currentView = vf.getCurrentView();
            movePageThreshold = (currentView.getWidth() / 5);

            int viewCount = viewOrder.length;
            for (int i=0; i<viewCount; i++) {
                //Log.i("MyApp", "ord=id:" + viewOrder[i] + "==" + cv.getId());
                if (viewOrder[i] == currentView.getId()) {
                    curIdx = i;
                    break;
                }
            }

            if (curIdx >= 0) {
                preIdx = curIdx - 1;
                nxtIdx = curIdx + 1;
                preIdx = (preIdx < 0         )?viewCount - 1:preIdx;
                nxtIdx = (nxtIdx >= viewCount)?0            :nxtIdx;

                prevView = vf.findViewById(viewOrder[preIdx]);
                nextView = vf.findViewById(viewOrder[nxtIdx]);
            }

            Log.i(LOG_TAG, 
                    String.format("Pre=%d(%d),Cur=%d(%d),Nxt=%d(%d)" 
                                    ,preIdx,prevView.getId()
                                    ,curIdx,currentView.getId()
                                    ,nxtIdx,nextView.getId()));

            break;
        case MotionEvent.ACTION_MOVE:
            int travelDistanceX = (int)(currentX - this.startX);
            int fingerPosX = (int)currentX;

            if (flipMode == FLIPMODE_NOMOVE) {
                if (travelDistanceX > SWITCH_THRESHOLD) {
                    flipMode = FLIPMODE_PREV;
                } else if
                   ( travelDistanceX < (SWITCH_THRESHOLD * -1)  ) {
                    flipMode = FLIPMODE_NEXT;
                } else {
                    flipMode = FLIPMODE_NOMOVE;
                }
            }

            if (flipMode == FLIPMODE_PREV) {
                prevView.layout(fingerPosX - prevView.getWidth(), 
                          prevView.getTop(), 
                          fingerPosX , 
                          prevView.getBottom());

                vf.bringChildToFront(prevView);
                prevView.setVisibility(View.VISIBLE);

            }
            if ( flipMode == FLIPMODE_NEXT)  {
                nextView.layout(fingerPosX , 
                          nextView.getTop(), 
                          fingerPosX + currentView.getWidth() + nextView.getWidth(), 
                          nextView.getBottom());

                vf.bringChildToFront(nextView);
                nextView.setVisibility(View.VISIBLE);
            }
            break;

        case MotionEvent.ACTION_UP:

            int activeIdx = -1;
            if ((this.startX - currentX) > movePageThreshold ) {
                activeIdx = nxtIdx;
            }else if 
                ((this.startX - currentX) < (movePageThreshold * -1) ) {
                activeIdx = preIdx;
            } else {
                activeIdx = curIdx;
            }
            int activeId = viewOrder[activeIdx];
            for(int i=0; i<vf.getChildCount(); i++) {
                // Log.i("MyApp",String.format("vf_id:%d,sel_id:%d",vf.getChildAt(i).getId(),activeId));
                if (vf.getChildAt(i).getId() == activeId) {
                    vf.setDisplayedChild(i);
                    break;
                }
            }
            flipMode = 0;
        default:
            break;
        }
        return true;
    }

    /**
     * 現在のページを移動することによってページをめくる
     * @param v
     * @param event
     * @return
     */
    public boolean pageFlipWithFingerMoveCurrent(View v, MotionEvent event) {
        float currentX = event.getX();

        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            startX = event.getX();

            currentView = vf.getCurrentView();
            movePageThreshold = (currentView.getWidth() / 5);

            int viewCount = viewOrder.length;
            for (int i=0; i<viewCount; i++) {
                //Log.i("MyApp", "ord=id:" + viewOrder[i] + "==" + cv.getId());
                if (viewOrder[i] == currentView.getId()) {
                    curIdx = i;
                    break;
                }
            }

            if (curIdx >= 0) {
                preIdx = curIdx - 1;
                nxtIdx = curIdx + 1;
                preIdx = (preIdx < 0         )?viewCount - 1:preIdx;
                nxtIdx = (nxtIdx >= viewCount)?0            :nxtIdx;

                prevView = vf.findViewById(viewOrder[preIdx]);
                nextView = vf.findViewById(viewOrder[nxtIdx]);
            }

            Log.i(LOG_TAG, 
                    String.format("Pre=%d(%d),Cur=%d(%d),Nxt=%d(%d)" 
                                    ,preIdx,prevView.getId()
                                    ,curIdx,currentView.getId()
                                    ,nxtIdx,nextView.getId()));

            break;
        case MotionEvent.ACTION_MOVE:
            int travelDistanceX = (int)(currentX - this.startX);
            int fingerPosX = (int)currentX;

            if (flipMode == FLIPMODE_NOMOVE) {
                if (travelDistanceX > SWITCH_THRESHOLD) {
                    flipMode = FLIPMODE_PREV;
                } else if
                   ( travelDistanceX < (SWITCH_THRESHOLD * -1)  ) {
                    flipMode = FLIPMODE_NEXT;
                } else {
                    flipMode = FLIPMODE_NOMOVE;
                }
            }

            if (flipMode == FLIPMODE_PREV) {
                currentView.layout(fingerPosX, 
                            currentView.getTop(), 
                            fingerPosX + currentView.getWidth() , 
                            currentView.getBottom());

                vf.bringChildToFront(currentView);
                prevView.setVisibility(View.VISIBLE);

            }
            if ( flipMode == FLIPMODE_NEXT)  {
                currentView.layout(fingerPosX - currentView.getWidth() , 
                          currentView.getTop(), 
                          fingerPosX, 
                          currentView.getBottom());

                vf.bringChildToFront(currentView);
                nextView.setVisibility(View.VISIBLE);
            }
            break;

        case MotionEvent.ACTION_UP:

            int activeIdx = -1;
            if ((this.startX - currentX) > movePageThreshold ) {
                activeIdx = nxtIdx;
            }else if 
                ((this.startX - currentX) < (movePageThreshold * -1) ) {
                activeIdx = preIdx;
            } else {
                activeIdx = curIdx;
            }
            int activeId = viewOrder[activeIdx];
            for(int i=0; i<vf.getChildCount(); i++) {
                // Log.i("MyApp",String.format("vf_id:%d,sel_id:%d",vf.getChildAt(i).getId(),activeId));
                if (vf.getChildAt(i).getId() == activeId) {
                    vf.setDisplayedChild(i);
                    break;
                }
            }
            flipMode = 0;
        default:
            break;
        }
        return true;
    }
}
0 голосов
/ 20 февраля 2012

Это работает на 100% ... 

    LinearLayout mainLayout = (LinearLayout) findViewById(R.id.main_layout);
    mainLayout.setOnTouchListener(this);
    flipper = (ViewFlipper) findViewById(R.id.flipper);
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    int layouts[] = new int[]{ R.layout.first, R.layout.second, R.layout.third, R.layout.fourth, 
            R.layout.fifth, R.layout.sixth, R.layout.seventh, R.layout.eighth, R.layout.nineth, R.layout.tenth, 
            R.layout.eleventh, R.layout.twelveth, R.layout.thirteen, R.layout.fourteenth };
    for (int layout : layouts)
        flipper.addView(inflater.inflate(layout, null));

и для переворачивания .... 

  public boolean onTouch(View view, MotionEvent event)
{
    switch (event.getAction())
    {
    case MotionEvent.ACTION_DOWN:
        fromPosition = event.getX();
        break;
    case MotionEvent.ACTION_UP:
        float toPosition = event.getX();
        if (fromPosition > toPosition)
        {
            flipper.setInAnimation(AnimationUtils.loadAnimation(this,R.anim.go_next_in));
            flipper.setOutAnimation(AnimationUtils.loadAnimation(this,R.anim.go_next_out));
            flipper.showNext();
        }
        else if (fromPosition < toPosition)
        {
            flipper.setInAnimation(AnimationUtils.loadAnimation(this,R.anim.go_prev_in));
            flipper.setOutAnimation(AnimationUtils.loadAnimation(this,R.anim.go_prev_out));
            flipper.showPrevious();
        }
    default:
        break;
    }
    return true;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...