|
class MainActivity : ComponentActivity() { |
|
override fun onCreate(savedInstanceState: Bundle?) { |
|
super.onCreate(savedInstanceState) |
|
enableEdgeToEdge() |
|
setContent { |
|
RotationButtonTheme { |
|
RotatableDraggableImage() |
|
} |
|
} |
|
} |
|
} |
|
|
|
@Composable |
|
fun RotatableDraggableImage() { |
|
var rotation by remember { mutableStateOf(0f) } |
|
var triangleScale by remember { mutableStateOf(1f) } |
|
|
|
Box( |
|
contentAlignment = Alignment.Center, |
|
modifier = Modifier |
|
.fillMaxSize() |
|
.background(Color.LightGray) |
|
) { |
|
Canvas(modifier = Modifier.fillMaxSize()) { |
|
val triangleSize = 100f * triangleScale |
|
|
|
val gradient = Brush.linearGradient( |
|
colors = listOf(Color.Black, Color.Gray), |
|
start = Offset(size.width / 2 - triangleSize, size.height / 2 + triangleSize), |
|
end = Offset(size.width / 2 + triangleSize, size.height / 2 + triangleSize) |
|
) |
|
|
|
val path = Path().apply { |
|
moveTo(size.width / 2, size.height / 2 - triangleSize) |
|
lineTo(size.width / 2 - triangleSize, size.height / 2 + triangleSize) |
|
lineTo(size.width / 2 + triangleSize, size.height / 2 + triangleSize) |
|
close() |
|
} |
|
|
|
drawPath(path, brush = gradient) |
|
} |
|
|
|
Image( |
|
painter = painterResource(id = R.drawable.draggable_button), |
|
contentDescription = "Sample Image", |
|
modifier = Modifier |
|
.padding(top = 500.dp) |
|
.graphicsLayer(rotationZ = rotation) |
|
.pointerInput(Unit) { |
|
detectDragGestures { change, _ -> |
|
val centerX = size.width / 2 |
|
val centerY = size.height / 2 |
|
val angle = -atan2( |
|
change.position.x - centerX, |
|
change.position.y - centerY |
|
) * (180f / Math.PI.toFloat()) |
|
|
|
rotation = (rotation + angle).roundToInt().toFloat() |
|
triangleScale = abs(sin(Math.toRadians(rotation.toDouble()))).toFloat() |
|
} |
|
} |
|
) |
|
} |
|
} |
