enter image description here

how i configure floatActionButton docking corner radius and sizes jetpack compose

how i configure floatActionButton docking corner radius and sizes in jetpack compose.if it is not possible to do it how i draw this with Canvas

enter image description here https://i.sstatic.net/ADVoF.png

@SuppressLint("SuspiciousIndentation")

@Composable fun FabBox() {

val mFirstCurveStartPoint = Point()
val mFirstCurveEndPoint = Point()
val mFirstCurveControlPoint1 = Point()
val mFirstCurveControlPoint2 = Point()

//the coordinates of the second curve

//the coordinates of the second curve
var mSecondCurveStartPoint = Point()
val mSecondCurveEndPoint = Point()
val mSecondCurveControlPoint1 = Point()
val mSecondCurveControlPoint2 = Point()
var mNavigationBarWidth: Int = 0
var mNavigationBarHeight =0

    Canvas(
        modifier = Modifier
            .size(fabBoxSize_100)

    ) {
        val width = size.width
        val height = size.height
        val CURVE_CIRCLE_RADIUS = (size.width.toInt()+20)/2;

        mNavigationBarWidth = width.toInt();
        mNavigationBarHeight = height.toInt();
        // the coordinates (x,y) of the start point before curve
        mFirstCurveStartPoint.set(
            (mNavigationBarWidth / 2) - (CURVE_CIRCLE_RADIUS * 2) - (CURVE_CIRCLE_RADIUS / 3),
            0
        );
        // the coordinates (x,y) of the end point after curve
        mFirstCurveEndPoint.set(
            mNavigationBarWidth / 2,
            CURVE_CIRCLE_RADIUS + (CURVE_CIRCLE_RADIUS / 4)
        );
        // same thing for the second curve
        mSecondCurveStartPoint = mFirstCurveEndPoint;
        mSecondCurveEndPoint.set(
            (mNavigationBarWidth / 2) + (CURVE_CIRCLE_RADIUS * 2) + (CURVE_CIRCLE_RADIUS / 3),
            0
        );

        // the coordinates (x,y)  of the 1st control point on a cubic curve
        mFirstCurveControlPoint1.set(
            mFirstCurveStartPoint.x + CURVE_CIRCLE_RADIUS + (CURVE_CIRCLE_RADIUS / 4),
            mFirstCurveStartPoint.y
        );
        // the coordinates (x,y)  of the 2nd control point on a cubic curve
        mFirstCurveControlPoint2.set(
            mFirstCurveEndPoint.x - (CURVE_CIRCLE_RADIUS * 2) + CURVE_CIRCLE_RADIUS,
            mFirstCurveEndPoint.y
        );

        mSecondCurveControlPoint1.set(
            mSecondCurveStartPoint.x + (CURVE_CIRCLE_RADIUS * 2) - CURVE_CIRCLE_RADIUS,
            mSecondCurveStartPoint.y
        );
        mSecondCurveControlPoint2.set(
            mSecondCurveEndPoint.x - (CURVE_CIRCLE_RADIUS + (CURVE_CIRCLE_RADIUS / 4)),
            mSecondCurveEndPoint.y
        );


        val path = Path().apply {
            reset();
            moveTo(0.toFloat(), 0.toFloat());
            lineTo(mFirstCurveStartPoint.x.toFloat(), mFirstCurveStartPoint.y.toFloat());

            cubicTo(
                mFirstCurveControlPoint1.x.toFloat(), mFirstCurveControlPoint1.y.toFloat(),
                mFirstCurveControlPoint2.x.toFloat(), mFirstCurveControlPoint2.y.toFloat(),
                mFirstCurveEndPoint.x.toFloat(), mFirstCurveEndPoint.y.toFloat()
            );

            cubicTo(
                mSecondCurveControlPoint1.x.toFloat(), mSecondCurveControlPoint1.y.toFloat(),
                mSecondCurveControlPoint2.x.toFloat(), mSecondCurveControlPoint2.y.toFloat(),
                mSecondCurveEndPoint.x.toFloat(), mSecondCurveEndPoint.y.toFloat()
            );
            
            close();
        }
        drawPath(path = path, color = backgroundColor)
    }

}

Row(
        modifier = Modifier
            .height(70.dp)
            .background(bottomBarColor)
            .fillMaxWidth(),
        horizontalArrangement = Arrangement.SpaceAround,
        verticalAlignment = Alignment.CenterVertically
    ) {
        IconButton(
            onClick = {},
            colors = IconButtonDefaults.iconButtonColors(contentColor = colorWhite)
        ) {
            Icon(
                painter = painterResource(id = R.drawable.location),
                contentDescription = "report",
            )
        }
        FabBox()
        IconButton(
            onClick = {},
            colors = IconButtonDefaults.iconButtonColors(contentColor = colorWhite)
        ) {
            Icon(
                painter = painterResource(id = R.drawable.menu),
                contentDescription = "menu"
            )
        }
    }

enter image description here