开发者

How to make a ViewFlipper behave like a Scroller?

Good day everyone.

I am creating a calendar component, and I'm working in the month view. I have created a view named MonthView, and I am adding a couple instances of this to a ViewFlipper:

viewFlipper = new ViewFlipper(getContext());
viewFlipper.addView(new MonthView(viewFlipper.getContext()));
viewFlipper.addView(new MonthView(viewFlipper.getContext()));

I have implemented the fling gesture so that I change views when sliding my finger left or right. This will cyclically update and display the months.

Now, I need to give the fling gesture开发者_Go百科 a smoothly effect when touching and slowly sliding my finger. The same we get when we use a Slider instead a ViewFlipper.

The problem with Scroller is that the effect is not cyclic. Once I get to the last view, I have to slide in the other direction.

I need someone help me find how to give a scroll-like effect to the ViewFlipper, or how to make a Scroller cyclic.

Thanks in advance.

Extra comment:

I have already implemented a ViewFlipper with 2 views. I update the views by using the SimpleOnGestureListener.onFling(...) method, and the behavior I got is something like this:

Imagine I always slide from rigth to left, like flipping a book's page to read the next one, and also imagine there is a caption in the header of the view that is displayed after flipping.

View # 0 --> Caption: January 2011

View # 1 --> Caption: Febrary 2011

View # 0 --> Caption: March 2011

View # 1 --> Caption: April 2011

View # 0 --> Caption: May 2011

If at this point I slide from left to right, the result will be something like:

View # 1 --> Caption: April 2011

View # 0 --> Caption: March 2011

The ability to cyclically move forward or backward, giving the user the idea of having infinite views, but using only a couple is characteristic of ViewFlipper, and that's what I can't loose. That's why I need a way to add the cool scroll effect without loosing what I've got.

Thanks.


Then you can use ViewFlinger!

viewflinger this an android widget (extends ViewGroup) that allows to group a set of views that can be swiped horizontally. It offers a smoother transition that cannot be accomplished using ViewFlipper. This is based on the Workspace class on the iosched project, which is based in the class with the same name of the Launcher app.

Download: 1.0.2 | Sources | JavaDoc

If you use Maven, you can use it as an artifact from this repository: http://mvn.egoclean.com/. Also, you would want to look this video where I show how it looks like: http://www.youtube.com/watch?v=gqIXq5x7iLs (sorry for my accent which sucks)


I think what you wanted to do is create an apparently infinite list of layouts being flinged by either the ViewFlipper or Christian's ViewFlinger. And also you want to keep reusing views / layouts inside the Flinger / Flipper. Right ?

If yes, probably the following is what you wanted to do. I've done this based on Christian's ViewFlinger,

Here you go,

First add three layouts to the ViewFlinger:

<com.egoclean.android.widget.flinger.ViewFlinger
    android:id="@+id/calendarViewFlipper"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ScrollView
        android:id="@+id/calendarViewLayout0"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ScrollView>

    <ScrollView
        android:id="@+id/calendarViewLayout1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ScrollView>

    <ScrollView
        android:id="@+id/calendarViewLayout2"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ScrollView>
</com.egoclean.android.widget.flinger.ViewFlinger>

Then inside your activity, you take an array of three views so that you can access them directly through the array instead of searching every time inside the flinger,

private ViewFlinger viewFlinger;
private ViewGroup layouts[] = new ViewGroup[3];
private boolean userEvent = false;

@Override
public final void onCreateSub(Bundle savedInstanceState)
{
    setContentView(R.layout.your_layout);

    viewFlinger = (ViewFlinger) findViewById(R.id.calendarViewFlipper);
    layouts[0] = (ViewGroup) findViewById(R.id.calendarViewLayout0);
    layouts[1] = (ViewGroup) findViewById(R.id.calendarViewLayout1);
    layouts[2] = (ViewGroup) findViewById(R.id.calendarViewLayout2);

    viewFlinger.setOnScreenChangeListener(new ViewFlinger.OnScreenChangeListener()
    {
        @Override
        public void onScreenChanging(View newScreen, int newScreenIndex)
        {

        }

        @Override
        public void onScreenChanged(View newScreen, int newScreenIndex)
        {
            if (userEvent)
            {
                ViewGroup tempLayout = null;

                if (newScreenIndex != 1)
                {
                    // We don't want our actions to raise events and create a cyclic event chain
                    userEvent = false;

                    if (newScreenIndex == 2) // Scrolling towards right
                    {
                        tempLayout = layouts[0];

                        viewFlinger.removeViewFromFront();
                        viewFlinger.addViewToBack(tempLayout);
                        layouts[0] = layouts[1];
                        layouts[1] = layouts[2];
                        layouts[2] = tempLayout;

                        // Any other logic comes here...
                    }
                    else if (newScreenIndex == 0) // Scrolling towards left
                    {
                        tempLayout = layouts[2];

                        viewFlinger.removeViewFromBack();
                        viewFlinger.addViewToFront(tempLayout);
                        layouts[2] = layouts[1];
                        layouts[1] = layouts[0];
                        layouts[0] = tempLayout;

                        // Any other logic comes here...
                    }

                    // We switch the screen index back to 1 since the current screen index would change back to 1
                    viewFlinger.setCurrentScreenNow(1, false);

                    userEvent = true;

                    // And any other logic that you'd like to put when the swapping is complete May be fill the swapped view with the correct values based on its new location etc...
                    View result = refreshView(tempLayout.getChildAt(0));

                    if (result.getParent() != tempLayout)
                    {
                        ((ViewGroup) result.getParent()).removeView(result);

                        tempLayout.removeAllViews();
                        tempLayout.addView(result);
                    }
                }
            }
        }
    });
}

I hope this is clear to you and helps you with your problem. It is working very fine for me! Should work fine for you too.

P.S. Thanks @ Christian for the ViewFlinger, it is awesome. However it lacks some good onConfigurationChanged logic, if you get time do put something in :). The rest is the best !

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜