Question

我正在编写一个视图，我需要从下到上显示另一个全屏叠加视图。

查看状态：

最初覆盖视图的状态为隐藏，
然后可以看到10％的视图
然后是20％，依此类推，达到100％。

因此，只有视图的可见性才能从下到上推动视图。我正在使用以下内容：

<translate
        android:duration="500"
        android:fillAfter="true"
        android:fromYDelta="75%p"
        android:toYDelta="0%p" />

但它会推送视图而不是显示。

编辑添加了布局

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/fmParent"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:id="@+id/txtGameLevel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="@string/fake_percentage"
        android:textColor="@color/theme_blue"
        android:textSize="@dimen/txt_header_size" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        android:layout_marginBottom="@dimen/txt_bottom_margin"
        android:text="@string/connecting"
        android:textColor="@color/theme_blue" />

    <FrameLayout
        android:id="@+id/fmOverlay"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/theme_blue"
        android:clipToPadding="true"
        android:visibility="invisible" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="@string/fake_percentage"
            android:textColor="@color/theme_white"
            android:textSize="@dimen/txt_header_size" />
    </FrameLayout>

</FrameLayout>

解决：Vikarm解决方案对我很有用https://stackoverflow.com/a/25436139/2624806：）

Answer 1

我不能说我完全明白你在寻找什么。你想从头到尾透露'主要内容'吗？喜欢这个？

enter image description here

如果这是您的想法，请使用ObjectAnimator为bottom布局容器的overlay属性设置动画。如果您需要更多帮助，可以发表评论。

修改

每当你想要动画显示时，请调用此方法：

public void animateReveal() { // We need this value to reset framelayout's bottom value once // the animation is done running - in case we need to run the // animation again final int originalBottomValue = fmOverlay.getBottom(); // Animator - animated the bottom property of the FrameLayout ObjectAnimator anim = ObjectAnimator.ofInt(fmOverlay, "bottom", fmOverlay.getBottom(), 0); // Duration is currently set to 3000ms - 3 seconds anim.setDuration(3000L); // Add a listener to the animation anim.addListener(new AnimatorListenerAdapter() { @Override public void onAnimationEnd(Animator animation) { super.onAnimationEnd(animation); // Set framelayout to be invisible fmOverlay.setVisibility(View.INVISIBLE); // Restore the `bottom` value fmOverlay.setBottom(originalBottomValue); } }); // Start animation anim.start(); }

Answer 2

您可以在XML文件中使用alpha标记，例如

<alpha android:fromAlpha="0.0" 
   android:toAlpha="1.0"  
   android:duration="1500"/>

或在您的Java文件中，您可以使用

AlphaAnimation alphaAnimation = new AlphaAnimation(0,1);
alphaAnimation.setDuration(1500);
view.startAnimation(alphaAnimation);

其中view是您想要显示的View。

确保您使用要显示的View高于另一个View

Answer 3

我前一段时间遇到过类似的问题。

我将解释我的解决方案 - 希望你可以根据自己的需要进行操作。

一切都是关于操纵其他观点。在我的主视图中，我创建了两个覆盖整个视图的白色Rectangles。 One Rec底部为alpha = 1，顶部为0（渐变）。第二个Rec是相反的 - 顶部的alpha = 1到底部的0％。

您可以像这样创建渐变效果：

创建文件：res / drawable / gradient_shape1.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
            android:startColor="#00FFFFFF"
            android:endColor="#FFFFFFFF"
            android:type="linear" />
</shape>

创建文件：res / drawable / gradient_shape2.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
            android:startColor="#FFFFFFFF"
            android:endColor="#00FFFFFF"
            android:type="linear" />
</shape>

现在，你有3层 - 第1层是你的视图，第2层是一个Rec，第3层是第二个Rec。因此，当两个Recs以完全alpha显示时 - 您可以在视图上看到完整的白色视图（看到它们重叠）。

所以，我现在所做的，使用AlphaAnimation和postDelayed - 我将第一个Rec的Alpha设置为0（例如，持续时间为2000ms），并在此之后（设置为postDelayed）我开始将第二个Rec淡化为0 alpha。

我没有达到你想要的确切效果，但我得到了一个很好的效果让我高兴。我敢肯定，如果你使用渐变和计时器玩得更多，你可能得到你想要的东西。

通过动画提高全屏视图的可见性

3 个答案: