【问题标题】:Android - TranslateAnimation update dynamically the size of the LayoutAndroid - TranslateAnimation 动态更新 Layout 的大小
【发布时间】:2013-10-20 21:54:13
【问题描述】:

我正在尝试制作这样的动画:

上下文:

我有两个EditText 我需要当你点击一个时,另一个从第一个后面出来。在这里,您有一些图片可以得到我想要的图像。

显然,要做到这一点,我需要一个 TranslateAnimation 以便将第二个 EditText 从第一个后面移动。

我的方法:

我能想到的第一件事是使用FrameLayoutEditText 放在另一个上,然后在第一个的onTouch 事件中对第二个执行TranslateAnimation。这样做的问题是,如果我在wrap_content 中有FrameLayout 高度,那么用户将看不到动画。如果我在运行时更改FrameLayout 的高度,我将在第一个EditText 下方留下一个空白,正如您在这张图片中看到的那样:

我认为的第二种解决方案是将AnimationListener 添加到TranslateAnimation 并在onAnimationStart 方法中更改FrameLayout 的高度。但这样做的问题是FrameLayout 的高度变化太突然。我要保持动画流畅。

我的问题:

如何从第一个EditText 后面获得第二个EditText 的平滑动画,随着第二个EditText 向下移动改变FrameLayout 的高度?

谢谢!

更新:

我将FrameLayout 更改为RelativeLayout 我搜索过,这种情况没有区别。我尝试缩放这个包含EditTextAnimationScaleRelativeLayout,以便平滑地显示动画,但没有奏效。这是我的代码:

    protected void expanse() {
        Log.d("Accordion", "expandAccordion");
        //Translate the top of the second EditText to its bottom
        TranslateAnimation translateSecond = new TranslateAnimation(second.getLeft(), second.getLeft(), 
                second.getTop(), second.getBottom());
        translateSecond.setDuration(1000);
        //Scale the relative layout to show the both of them
        ScaleAnimation scaleContainer = new ScaleAnimation(container.getLeft(),  container.getLeft(), 
                container.getTop(), second.getBottom());
        scaleContainer.setDuration(1000);
        //At the end of the scaling, change the height of the relative layout
        scaleContainer.setAnimationListener(new AnimationListenerAdapter() {

            @Override
            public void onAnimationEnd(Animation animation) {
                RelativeLayout.LayoutParams params = (LayoutParams) container.getLayoutParams();
                params.height = second.getBottom();
                container.setLayoutParams(params);
                super.onAnimationEnd(animation);
            }

        });
        container.startAnimation(scaleContainer);
        second.startAnimation(translateSecond);
    }

顺便说一句,我可以保证,如果我硬编码一些像 350dp 这样的大高度,动画会正确显示。

更新:

我尝试移动两者,第二个 EditText 和下面的布局。这是代码。顺便说一句,由于另一个原因,我将ListView 更改为自定义ViewPager,这并没有改变任何东西。

  public class MainActivity extends FragmentActivity {

    private EditText first;
    private EditText second;
    private HoboViewPager pager;

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

        pager = (HoboViewPager) findViewById(R.id.pager);
        pager.setPageTransformer(true, new RotationPageTransformer());
        pager.setAdapter(new SampleAdapter(this, getSupportFragmentManager()));

        first = (EditText) findViewById(R.id.location_search_field);
        second = (EditText) findViewById(R.id.term_search_field);
        first.setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                expanseSecondField();
                return true;
            }
        });
    }

    protected void expanseSecondField() {
        TranslateAnimation translateSecondField = new TranslateAnimation(second.getLeft(), second.getLeft(), 
                second.getTop(), second.getBottom());
        translateSecondField.setFillAfter(true);
        translateSecondField.setDuration(1000);
                    TranslateAnimation translateContainer = new TranslateAnimation(pager.getLeft(), pager.getLeft(), 
                pager.getTop(), pager.getTop() + second.getBottom());
        translateContainer.setFillAfter(true);
        translateContainer.setDuration(1000);
                    pager.startAnimation(translateContainer);
        second.startAnimation(translateSecondField);
    }
}

这不起作用,因为容器的 TranslateAnimation 立即执行。结果与我在动画结束时尝试更改容器的大小时相同。

【问题讨论】:

    标签: java android animation android-framelayout translate-animation


    【解决方案1】:

    如何使用第二个选项并尝试同时执行两个翻译动画:一个在 EditText 上,然后一个在 FrameLayout 上?给他们完全相同的增量和持续时间。这样FrameLayout就会平滑的向下移动,然后在动画结束的时候,改变FrameLayout的高度。

    希望这会有所帮助:)

    【讨论】:

    • 不错的想法。我会试一试,如果可行,我会接受你的回答。谢谢!
    • 我认为这个解决方案不起作用,因为当我在FrameLayout 中执行动画时,视图会失效,我看不到EditText 的动画。检查我的更新。
    • 您需要创建 2 个单独的 TranslateAnimation 实例 - 您在这样做吗?
    • EditText 的 TranslateAnimation 和容器的一个 ScaleAnimation(现在是RelativeLayout)。我不明白 TranslateAnimation 将如何帮助我调整容器的大小。
    • 不要做 ScaleAnimation - 这会使容器看起来像是在挤压。据我了解,底部的容器延伸到屏幕的整个高度。如果是这种情况,TranslateAnimation 会将其向下推,并且由于用户看不到屏幕底部的下方,因此看起来高度会变小。
    猜你喜欢
    • 1970-01-01
    • 2016-10-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-11-30
    • 1970-01-01
    相关资源
    最近更新 更多