点击

时间:2015-05-20 20:40:58

标签: android android-animation

我希望在其父布局点击上滑动/向上滑动嵌套布局。

即父布局将有一个隐藏的孩子。点击后,我希望父母的高度向下动画(向下滑动)以适合子布局。再次点击,我希望孩子动画起来(向上滑动)。基本上只是让父母的高度动起来显示/隐藏孩子。

我发现这看起来很有用,但似乎有很多代码:

http://gmariotti.blogspot.com/2013/09/expand-and-collapse-animation.html

我已经看到很多使用'animateLayoutChanges'来制作动画的东西,但是我无法让它工作。

我试过这个:

<LinearLayout android:id="@+id/parent"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <LinearLayout android:id="@+id/child"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone"
        android:animateLayoutChanges="true">

        <TextView android:id="@+id/message"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Some text to show/hide"/>
    </LinearLayout>

</LinearLayout>

然后在代码中:

    LinearLayout parent = (LinearLayout)findViewById(R.id.parent);
    parent.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
           LinearLayout child = (LinearLayout)findViewById(R.id.child);
           child.setVisibility(child.getVisibility() == View.VISIBLE ? View.GONE : View.VISIBLE);
        }
    });

正确设置子视图的可见性,但绝对没有动画。

3 个答案:

答案 0 :(得分:3)

好吧,首先android:animateLayoutChanges会影响子元素。因此,显然,如果要更改元素本身的属性,则不会对其进行动画处理。

我认为您可以通过启用LayoutTransition.CHANGING动画来完成您在API 16中尝试的操作。

<LinearLayout android:id="@+id/parent"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:animateLayoutChanges="true">
    <TextView android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Title"/>
    <TextView android:id="@+id/message"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:text="Some text to show/hide"/>
</LinearLayout>
LinearLayout parent = (LinearLayout)findViewById(R.id.parent);
parent.getLayoutTransition().enableTransitionType(LayoutTransition.CHANGING);

View text = findViewById(R.id.text);
text.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        View message = findViewById(R.id.message);
        ViewGroup.LayoutParams params = message.getLayoutParams();

        params.height = params.height == 0 ? ViewGroup.LayoutParams.WRAP_CONTENT : 0;

        message.setLayoutParams(params);
    }
});

答案 1 :(得分:0)

尝试使用 SlidingDrawer

使用此代码

xml layout sideupdown.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <Button
            android:id="@+id/bopen"
            android:layout_width="90sp"
            android:layout_height="wrap_content"
            android:text="open" />

        <Button
            android:id="@+id/btogg"
            android:layout_width="90sp"
            android:layout_height="wrap_content"
            android:text="change" />

        <Button
            android:id="@+id/bclose"
            android:layout_width="90sp"
            android:layout_height="wrap_content"
            android:text="close" />
    </LinearLayout>

    <SlidingDrawer
        android:id="@+id/slidingDrawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:content="@+id/content"
        android:handle="@+id/handle" >

        <Button
            android:id="@+id/handle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Handle" />

        <LinearLayout
            android:id="@+id/content"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <CheckBox
                android:id="@+id/chkbok"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:checked="false"
                android:text="On/Off" />
        </LinearLayout>
    </SlidingDrawer>

</FrameLayout>

java class SlideUpDown.java

public class SlideUpDown extends Activity implements OnClickListener,
        OnCheckedChangeListener, OnDrawerOpenListener, OnDrawerCloseListener {
    Button opn, cloz, chng, hndl;
    CheckBox chkbox;
    SlidingDrawer sd;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.sideupdown);
        refference();
        opn.setOnClickListener(this);
        cloz.setOnClickListener(this);
        chng.setOnClickListener(this);
        chkbox.setOnCheckedChangeListener(this);
        sd.setOnDrawerOpenListener(this);
        sd.setOnDrawerCloseListener(this);

    }

    private void refference() {
        opn = (Button) findViewById(R.id.bopen);
        cloz = (Button) findViewById(R.id.bclose);
        chng = (Button) findViewById(R.id.btogg);
        chkbox = (CheckBox) findViewById(R.id.chkbok);
        sd = (SlidingDrawer) findViewById(R.id.slidingDrawer);
        hndl = (Button) findViewById(R.id.handle);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
        case R.id.bopen:
            sd.open();
            break;
        case R.id.bclose:
            sd.close();
            break;
        case R.id.btogg:
            sd.toggle();
            break;
        }

    }

    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        if (chkbox.isChecked()) {
            sd.lock();
            hndl.setEnabled(false);
        } else {
            sd.unlock();
            hndl.setEnabled(true);
        }
    }


    @Override
    public void onDrawerOpened() {

    }


    @Override
    public void onDrawerClosed() {

    }

    @Override
    protected void onDestroy() {
        super.onDestroy();

    }
}

答案 2 :(得分:0)

在我们的一个应用程序中,我们隐藏并显示页眉和页脚。我们通过更改视图的高度和可见性来实现此目的。

它看起来像这样

        ValueAnimator va;

        if (show)
            va = ValueAnimator.ofInt(0, px);
        else
            va = ValueAnimator.ofInt(px, 0);

        va.setDuration(400);
        va.setInterpolator(new DecelerateInterpolator(2));


        va.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            public void onAnimationUpdate(ValueAnimator animation) {

                Integer value = (Integer) animation.getAnimatedValue();
                topicNavBar.getLayoutParams().height = value;

                topicNavBar.requestLayout();

                if (value == 0) {
                    if (show)
                        topicNavBar.setVisibility(View.VISIBLE);
                    else
                        topicNavBar.setVisibility(View.GONE);
                }

                if (show && value == px) {
                    animationInProgress = false;
                }

                if (!show && value == 0) {
                    animationInProgress = false;
                }

            }
        });


        va.start();

希望这有帮助