android – 下拉菜单或幻灯片上的视图

我想知道是否有人可以指导我如何完成以下操作,

当用户拿着标题栏并向下拖动时,用户有一个标题栏;它向用户显示不同的视图.这是驻留在tabhost中的视图.

它类似于android的默认状态栏.

您应该尝试使用带有RelativeLayout子级的ViewFlipper并在标头上附加OnTouchListeners来完成此操作(类似AccordionView的行为).它对我有用.

样品申请

main.xml //在res / layouts中

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent">
    <ViewFlipper android:id="@+id/flipper" 
        android:layout_width="fill_parent" android:layout_height="fill_parent">
        <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent">
            <TextView android:id="@+id/txt_states" android:text="First panel" 
                android:layout_centerHorizontal="true"
                android:textSize="18dp" android:textStyle="bold" android:textColor="@android:color/white"
                android:layout_width="wrap_content" android:layout_height="wrap_content" />
            <Button android:id="@+id/btn_next" android:text="@string/goto_second"
                android:layout_width="fill_parent" android:layout_height="wrap_content" 
                android:gravity="center_horizontal" android:layout_centerHorizontal="true" android:layout_alignParentBottom="true"/>
            <TextView android:id="@+id/txt_content1" android:text="@string/loremipsum1" 
                 android:layout_width="fill_parent" android:layout_height="fill_parent" 
                 android:layout_below="@id/txt_states" android:layout_above="@id/btn_next" 
                 android:layout_marginTop="10dp" />
        </RelativeLayout>
        <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent">
            <Button android:id="@+id/btn_prev" android:text="@string/goto_first"
                android:layout_width="fill_parent" android:layout_height="wrap_content"
                android:gravity="center_horizontal" android:layout_centerHorizontal="true" />
            <TextView android:id="@+id/txt_commands" android:text="Second panel" 
                android:layout_centerHorizontal="true"
                android:textSize="18dp" android:textStyle="bold" android:textColor="@android:color/white"
                android:layout_width="wrap_content" android:layout_height="wrap_content" 
                android:layout_below="@id/btn_prev" />
            <TextView android:id="@+id/txt_content2" android:text="@string/loremipsum2" 
                 android:layout_width="fill_parent" android:layout_height="fill_parent"
                 android:layout_below="@id/txt_commands" android:layout_marginTop="10dp" />
        </RelativeLayout>
    </ViewFlipper>
</RelativeLayout>

androidManifest.xml //仅限活动声明

<activity android:name=".AccordionSample" android:label="@string/app_name">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

AccordionSample.java //您的主要活动

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Button;
import android.widget.ViewFlipper;

public class AccordionSample extends Activity implements View.OnTouchListener 
{
    private float oldTouchValue;
    private ViewFlipper flipper;
    private Button currentButton;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        flipper = (ViewFlipper)findViewById(R.id.flipper);
        findViewById(R.id.btn_prev).setOnTouchListener(this);
        findViewById(R.id.btn_next).setOnTouchListener(this);
    }

    private boolean onButtonTouchEvent(MotionEvent touchevent)
    {
        if (currentButton == null)
            return false;
        switch (touchevent.getAction())
        {
            case MotionEvent.ACTION_DOWN:
            {
                oldTouchValue = touchevent.getY();
                break;
            }
            case MotionEvent.ACTION_UP:
            {
                float currentY = touchevent.getY();
                final float diff = oldTouchValue - currentY;
                if ((diff < -100) && (currentButton.getId() == R.id.btn_prev))
                {
                    //Up --> Bottom
                    flipper.setInAnimation(AccordionAnimation.inFromTopAnimation());
                    flipper.setOutAnimation(AccordionAnimation.outToBottomAnimation());
                    flipper.showNext();
                }
                else if ((diff > 100) && (currentButton.getId() == R.id.btn_next))
                {
                    //Bottom --> Up
                    flipper.setInAnimation(AccordionAnimation.inFromBottomAnimation());
                    flipper.setOutAnimation(AccordionAnimation.outToTopAnimation());
                    flipper.showPrevious();
                }
                break;
            }
        }
        currentButton = null;
        return true;
    }

    @Override
    public boolean onTouch(View v, MotionEvent event)
    {
        currentButton = (Button)v;
        final boolean result = this.onButtonTouchEvent(event);
        return result;
    }
}

AccordionAnimation.java //用于向上和向下滑动

import android.view.animation.AccelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;

public class AccordionAnimation
{
    public static Animation inFromBottomAnimation()
    {
        Animation inFromBottom =
                new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
                        Animation.RELATIVE_TO_PARENT, +1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
        inFromBottom.setDuration(350);
        inFromBottom.setInterpolator(new AccelerateInterpolator());
        return inFromBottom;
    }

    public static Animation outToTopAnimation()
    {
        Animation outtoTop =
                new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
                        Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, -1.0f);
        outtoTop.setDuration(350);
        outtoTop.setInterpolator(new AccelerateInterpolator());
        return outtoTop;
    }

    public static Animation inFromTopAnimation()
    {
        Animation inFromTop =
                new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
                        Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
        inFromTop.setDuration(350);
        inFromTop.setInterpolator(new AccelerateInterpolator());
        return inFromTop;
    }

    public static Animation outToBottomAnimation()
    {
        Animation outtoBottom =
                new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
                        Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, +1.0f);
        outtoBottom.setDuration(350);
        outtoBottom.setInterpolator(new AccelerateInterpolator());
        return outtoBottom;
    }
}

strings.xml // res / values内部

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="goto_first">Slide down to see the first panel</string>
    <string name="goto_second">Slide up to see the second panel</string>
    <string name="loremipsum1">Lorem ipsum dolor sit amet...</string>
    <string name="loremipsum2">Sed ut perspiciatis unde omnis iste...</string>
    <string name="app_name">AccordionSample</string>
</resources>

编辑
如果您想将不同的视图拆分为不同的布局xmls,请说

> first_view.xml和
>第二个view.xml,

你应该修改你的onCreate方法：

flipper = (ViewFlipper)findViewById(R.id.flipper);
LayoutInflater inflater = getLayoutInflater();

final View firstView = inflater.inflate(R.layout.first_view, flipper, false);
flipper.addView(firstView);

final View secondView = inflater.inflate(R.layout.second_view, flipper, false);
flipper.addView(secondView);

firstView.findViewById(R.id.btn_next).setOnTouchListener(this);
secondView.findViewById(R.id.btn_prev).setOnTouchListener(this);

编辑
或者更优雅高效,只需将您为不同视图创建的布局xmls包含到main.xml中：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent">
    <ViewFlipper android:id="@+id/flipper" 
        android:layout_width="fill_parent" android:layout_height="fill_parent">
        <include android:id="@+id/flipping_view_1" layout="@layout/flipping_view_1" />
        <include android:id="@+id/flipping_view_2" layout="@layout/flipping_view_2" />
    </ViewFlipper>
</RelativeLayout>

哪里

> layout / flipping_view_1.xml
包含第一个RelativeLayout,
和
> layout / flipping_view_2.xml
包含第二个RelativeLayout

在原始main.xml中的ViewFlipper.

要了解有关Android布局的可重用性以及整体布局技术的更多信息,您应该查看Romain Guy’s great post covering layout tricks.