Пользовательский интерфейс искажается при запуске анимации

Question

Я создаю игру настольного типа. Настольная игра имеет круглые границы, содержащие 30 линейных макетов. Я использую пользовательский макет ограничения, чтобы изогнуть стороны этих макетов (по наследству). когда я анимирую любой вид макета, он искажается, и весь макет работает неправильно.

Это фактический макет, который я создал.

Фактическое расположение:

Во-первых, я использую Относительный макет (как круговая кривая), и он содержит линейные макеты. затем происходит это искажение, затем я изменяю пользовательский интерфейс с относительного макета на макет ограничения, но ничего не меняется.

Это вид макета после искаженного.

Искаженное расположение:

Другое искаженное изображение:

Я использую этот вид для создания изогнутого макета ограничения.

public class CircularConstraint extends ConstraintLayout {
    Path clipPath = new Path();

    private Paint paint = new Paint();

    public CircularConstraint(Context context) {
        super(context);
        setWillNotDraw(false);
    }

    public CircularConstraint(Context context, AttributeSet attrs) 
    {
        super(context, attrs);
        setWillNotDraw(false);
    }

    public CircularConstraint(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        setWillNotDraw(false);
    }


    @SuppressLint("ResourceAsColor")
    @Override
    protected void onDraw(Canvas canvas) {

        clipPath.addRoundRect(new RectF(canvas.getClipBounds()), 500, 500, Path.Direction.CW);
        canvas.clipPath(clipPath);
        super.onDraw(canvas);
    }
}

Если вы хотите что-то еще для решения этой проблемы. Я дам это тебе. Заранее спасибо.