android – 用户点击动画时用动画更改背景

2023年12月3日 207次阅读

我在我的活动中使用了一个LinearLayout来更改两个视图.在这里,我使用了两个textviews.当用户点击线性布局时,我会根据我的要求更改视图. xml文件在这里,

<LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:background="@drawable/customswitchselector"
            android:textStyle="bold"
            android:layout_below="@+id/linearTab"
            android:layout_marginTop="20dp"
            android:layout_marginBottom="20dp"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
            android:showText="true"
            android:id="@+id/switch1"
            android:checked="false"
            android:weightSum="2">
            <TextView
                android:id="@+id/tv_switch1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:layout_gravity="center_vertical"
                android:layout_weight="1"
                android:paddingLeft="10dp"
                android:paddingRight="10dp"
                android:paddingTop="5dp"
                android:paddingBottom="5dp"
                android:textStyle="bold"
                android:textColor="#272351"
                style="bold" />
            <TextView
                android:id="@+id/tv_switch_2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:layout_weight="1"
                android:textStyle="bold"
                android:layout_gravity="center_vertical"
                android:paddingLeft="10dp"
                android:paddingRight="10dp"
                android:paddingTop="5dp"
                android:paddingBottom="5dp"
                android:textColor="#ffffff"
                style="bold"
                />
        </LinearLayout>

《android – 用户点击动画时用动画更改背景》《android – 用户点击动画时用动画更改背景》

这两个图像显示了我的两个条件.我已经做了足够的改变.现在我想做动画,而我正在改变布局点击的文本视图的背景.我已经检查了transitiondrawable示例,但它对我没有帮助.

customswitchselector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true">
        <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true">
            <gradient android:angle="270" android:endColor="#ffffff" android:startColor="#ffffff" />
            <corners android:radius="30dp" />
        </shape>
    </item>
    <item android:state_checked="false">
        <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true">
            <gradient android:angle="270" android:endColor="#ffffff" android:startColor="#ffffff" />
            <corners android:radius="30dp" />
        </shape>
    </item>
</selector>

custom_track.xml这用于带蓝色背景的textview

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:dither="true"
    android:shape="rectangle"
    android:useLevel="false"
    android:visible="true">
    <gradient
        android:angle="270"
        android:endColor="#292850"
        android:startColor="#292850" />
    <corners android:radius="30dp" />
    <size
        android:width="100dp"
        android:height="30dp" />

</shape>

最佳答案 可能的方法是将白色drawable设置为FrameLayout的背景,并为蓝色椭圆添加一个View,为其添加两个TextViews.

为了让视图完全占用容器的一半,你可以使用PercenFrameLayout(阅读更多关于它的内容in the official docu).要使用它,您需要将此依赖项添加到build.gradle：compile’c​​om.android.support:percent:25.2.0′

创建布局后,您只需从左到右或相反的方向为蓝色椭圆的重力设置动画.

所以你的布局看起来像这样：

<PercentFrameLayout
    android:id="@+id/container"
    android:animateLayoutChanges="true"
    android:background="@drawable/white_oval"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- blue oval -->
    <View
        android:id="@+id/blue_oval"
        android:gravity="start"
        android:background="@drawable/blue_oval"
        app:layout_widthPercent="50%"
        android:layout_height="wrap_content"
        android:transformPivotX="0dp" />

    <!--2 textviews-->
    <TextView
        app:layout_widthPercent="50%"
        android:layout_height="wrap_content" 
        android:text="left"
        android:gravity="start"/>

    <TextView
        app:layout_widthPercent="50%"
        android:layout_height="wrap_content"
        android:text="right"
        android:gravity="end"/>
</FrameLayout>

然后在你的代码中为蓝色椭圆的重力变化设置动画,如下所示：

private void animateGravity(int toGravity) {
    LayoutTransition layoutTransition = container.getLayoutTransition();
    layoutTransition.enableTransitionType(LayoutTransition.CHANGING);
    layoutTransition.setDuration(YOUR_ANIMATION_DURATION);
    layoutTransition.setInterpolator(LayoutTransition.CHANGING, new AccelerateDecelerateInterpolator());

    FrameLayout.LayoutParams layoutParams = (LayoutParams) blueOvalView.getLayoutParams();
    layoutParams.gravity = toGravity;
    blueOvalView.setLayoutParams(layoutParams);
}
点赞