Android左滑动画LayoutParams异常：背景随按钮移动问题求助

现状说明 #

• 右滑动画效果正常：滑动时call按钮从左向右展开，背景跟随按钮延伸，符合预期。
• 左滑动画异常：滑动时straddle按钮左移，但它的黑色背景会向右移动，需求是背景固定位置，仅按钮可交互区域/文字移动。

右滑正常实现代码 #

Java逻辑 #

if(direction == RIGHT){
    if(distance < 217) {
        layoutParams.leftMargin = (int) distance + startLeftMargin;
        layoutParams.topMargin = startTopMargin;
        call.setVisibility(View.VISIBLE);
        straddle.setVisibility(View.GONE);
        bet.setVisibility(View.GONE);
        fold.setVisibility(View.GONE);
        
        ViewGroup.LayoutParams callLayoutParams = call.getLayoutParams();
        callLayoutParams.width = (int) getResources().getDisplayMetrics().density * ((int) distance);
        call.setLayoutParams(callLayoutParams);
    }
}

call按钮布局 #

<TextView
    android:id="@+id/call"
    android:layout_width="1dp"
    android:layout_height="96dp"
    android:layout_marginStart="68dp"
    android:layout_marginTop="50dp"
    android:background="@drawable/call"
    android:gravity="center|start"
    android:paddingStart="@dimen/default_gap"
    android:text="Call"
    android:textColor="@color/white"
    android:textSize="25sp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

左滑异常代码 #

Java逻辑 #

} else if(direction == LEFT){
    if(distance < 217) {
        layoutParams.leftMargin = (int) (-distance) + startLeftMargin;
        layoutParams.topMargin = startTopMargin;
        call.setVisibility(View.GONE);
        straddle.setVisibility(View.VISIBLE);
        bet.setVisibility(View.GONE);
        fold.setVisibility(View.GONE);

        ViewGroup.LayoutParams straddleLayoutParams = straddle.getLayoutParams();
        straddleLayoutParams.width = (int) getResources().getDisplayMetrics().density * (int) distance;
        straddle.setLayoutParams(straddleLayoutParams);
    }
}

straddle按钮布局 #

<TextView
    android:id="@+id/straddle"
    android:layout_width="1dp"
    android:layout_height="96dp"
    android:layout_marginStart="68dp"
    android:layout_marginTop="50dp"
    android:background="@drawable/straddle"
    android:gravity="center|end"
    android:paddingEnd="@dimen/default_gap"
    android:text="Str."
    android:textColor="@color/white"
    android:textSize="25sp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

问题原因 #

左滑时的核心矛盾：

1. straddle的布局约束是左侧对齐父布局，当增加它的宽度时，View会向右侧扩展（因为左侧固定）。
2. 同时设置了负的leftMargin让整个View左移，两种操作叠加后，就出现了背景向右“跑”的视觉异常。

解决方案 #

步骤1：修改straddle布局约束，让右侧固定 #

把straddle的对齐方式改成右侧对齐父布局，这样宽度增加时会向左延伸，符合左滑的视觉逻辑：

<TextView
    android:id="@+id/straddle"
    android:layout_width="1dp"
    android:layout_height="96dp"
    android:layout_marginEnd="68dp"
    android:layout_marginTop="50dp"
    android:background="@drawable/straddle"
    android:gravity="center|end"
    android:paddingEnd="@dimen/default_gap"
    android:text="Str."
    android:textColor="@color/white"
    android:textSize="25sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

步骤2：调整左滑Java逻辑，移除错误的margin设置 #

不需要修改leftMargin，依靠右侧固定的约束，宽度增加自然向左延伸；如果需要按钮整体偏移，用translationX替代margin（更适合动画场景）：

} else if(direction == LEFT){
    if(distance < 217) {
        call.setVisibility(View.GONE);
        straddle.setVisibility(View.VISIBLE);
        bet.setVisibility(View.GONE);
        fold.setVisibility(View.GONE);

        ViewGroup.LayoutParams straddleLayoutParams = straddle.getLayoutParams();
        straddleLayoutParams.width = (int) getResources().getDisplayMetrics().density * (int) distance;
        straddle.setLayoutParams(straddleLayoutParams);
        
        // 若需要按钮整体向左偏移（可选，根据需求调整）
        // straddle.setTranslationX(-distance);
    }
}

额外优化 #

• 初始状态下给straddle设置android:visibility="gone"，避免布局加载时的闪烁。
• 滑动结束后，记得重置View的状态（宽度、translationX等），避免影响后续交互。

内容的提问来源于stack exchange，提问作者OPerator