Questions tagged [android-jetpack-compose-canvas]

79 questions
1
vote
1 answer

How to animate drawPath() on jetpack compose canvas

I have drawn a heart using path.cubicTo() method Canvas(modifier = Modifier.size(100.dp)) { val path = Path() path.moveTo(0f, size.height / 3) path.cubicTo(0f, 0f, size.width / 2, 0f, size.width / 2, size.height…
1
vote
1 answer

compose modifiy icon set part of the color

I have an icon to indicate sequence. My requirement is that when the order is reversed, the lower half of the icon turns blue; when the order is turned, the upper half of the icon turns blue. I found a related question, but it conflicts with my…
1
vote
1 answer

How to make vertical dash/dotted in jetpack compose

I want to make dashed/dotted vertical line in canvas. I tried to use this answer 1. It works but not perfect. I'll show you my code, what I am tried. @Composable fun DrawProgressBar() { val rangeComposition = RangeComposition() val itemLst =…
1
vote
1 answer

How to draw vertical line in canvas jetpack compose

I have value in Percentage from 0 to 100% which is in Float type . I am drawing vertical lines, I am using Offset which value is also in Float type. So how can I convert values in pixel values? Values are Pixel in size 996.0 2023-02-12…
1
vote
1 answer

How to make rounded corner in drawLine in jetpack compose

I am using Canvas Api to draw something. I want to draw line with rounded corner. Line is draw without any problem. But I cannot figure out which attribute for corner radius. val boxSize = 30.dp Box(modifier = Modifier …
1
vote
1 answer

How to apply a ripple to an rectangle drawn in Jetpack compose's canvas?

I have a sample composable function that's contains a rectangle drawn in a Canvas composable. The detectTapGestures within the pointerInput Modifier is used to detect whenever any point in the Canvas is touched, specifically within the rectangle…
1
vote
2 answers

How draw a line between 2 circles with canvas in jetpack compose?

I want draw a line between circles in the screen, I have start offset but I can not find end Offset? How can I find that? thank you I add a hard code number (59.dp.toPx()) but I want to find left offset of next circle my code: @Composable fun…
1
vote
1 answer

How do I design an adventure path with curved line in Jetpack Compose?

I want to design an adventure path for educational levels in Jetpack Compose Android, where each level is connected to the next and previous level by a curved line. Each level is a circular view for example an image that can be clicked.
1
vote
1 answer

Why the compose canvas draw things only show at preview function but not display on the running screen

Descript I want to draw a line at the compose with the compose canvas inside a compose widget,but it's just show at the preview! If just copy the canvas part code,it can Correct display! The compose code Card( elevation = 6.dp, shape…
1
vote
1 answer
1
vote
1 answer

Why isn't conversion from dp to px precise?

I'm trying to draw a black rectangle that covers the yellow Box composable, After converting the size to pixels. The Box is still slightly visible underneath. Is there a way around this? val size = 50.dp Box( modifier = Modifier …
1
vote
1 answer

Gap between two drawings in Jetpack compose Canvas

I am trying to make a rectangle and an arc attached to rectangle's bottom. I have used the size provided by the drawScope to lay the drawings on screen but I am unable to get why there is an unnecessary gap between the two drawings even if the…
1
vote
0 answers

How to create a Path will out fill in Jetpack Compose?

I have a Black box out of which I want to take away a specific path. Code @Composable fun PathDiff() { Canvas( modifier = Modifier .fillMaxSize(), ) { val rect1 = Path().apply { …
1
vote
1 answer

Confusing behaviour by the 'rotate' transformation of Compose Canvas

I have a simple Composable Canvas that draws a shape multiple times in different positions, and I wish to apply rotation to each iteration of the shape as per a particular algorithm. However, I am unable to fully control the positioning of the…
1
vote
1 answer

How to add arc for rounded corner for cut off area in jetpack compose?

I wanted the rounded curve around the corner of triangle in left and right. I tried to add arc but I don't know it's not working maybe the coordinate are wrong . Or any other methods ? @Composable fun NavBarCustomShape() { Canvas(modifier =…