如何在Jetpack Compose单Activity应用中实现Musixmatch式屏幕悬浮窗？

用户问题：

我希望为我的应用创建一个屏幕悬浮窗来显示文本内容，但找不到可行的实现示例。请问在单Activity的Jetpack Compose应用中能否实现屏幕悬浮窗？我不知道该从何处着手。

可以实现，以下是具体步骤： #

1. 申请悬浮窗权限 #

Android系统对悬浮窗有严格的权限要求，首先在AndroidManifest.xml中声明权限：

<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />

针对Android 6.0及以上系统，还需要动态引导用户开启权限：

if (!Settings.canDrawOverlays(context)) {
    val intent = Intent(
        Settings.ACTION_MANAGE_OVERLAY_PERMISSION,
        Uri.parse("package:${context.packageName}")
    )
    startActivity(intent)
}

2. 用Compose构建悬浮窗内容 #

通过ComposeView将Compose布局嵌入系统悬浮窗，核心代码示例：

fun showFloatingTextWindow(context: Context) {
    val windowManager = context.getSystemService(Context.WINDOW_SERVICE) as WindowManager
    val layoutParams = WindowManager.LayoutParams().apply {
        type = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            WindowManager.LayoutParams.TYPE_APPLICATION_OVERLAY
        } else {
            WindowManager.LayoutParams.TYPE_PHONE
        }
        flags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE or WindowManager.LayoutParams.FLAG_LAYOUT_IN_SCREEN
        width = WindowManager.LayoutParams.WRAP_CONTENT
        height = WindowManager.LayoutParams.WRAP_CONTENT
        gravity = Gravity.TOP or Gravity.START
        x = 100
        y = 100
    }

    val composeView = ComposeView(context).apply {
        setContent {
            Surface(
                modifier = Modifier
                    .background(Color.White.copy(alpha = 0.8f))
                    .padding(horizontal = 16.dp, vertical = 8.dp),
                shape = RoundedCornerShape(8.dp)
            ) {
                Text(
                    text = "悬浮窗文本内容",
                    color = Color.Black,
                    fontSize = 16.sp
                )
            }
        }
    }

    windowManager.addView(composeView, layoutParams)
}

3. 处理生命周期避免内存泄漏 #

在Activity销毁时，记得移除悬浮窗视图：

// 提前持有composeView和windowManager的引用
override fun onDestroy() {
    super.onDestroy()
    runCatching {
        windowManager.removeView(composeView)
    }
}

4. 可选：添加拖拽功能 #

如果需要悬浮窗支持拖拽移动，给Compose根元素添加拖拽逻辑：

// 在setContent内部添加
var offset by remember { mutableStateOf(Offset(layoutParams.x.toFloat(), layoutParams.y.toFloat())) }

Surface(
    modifier = Modifier
        .background(Color.White.copy(alpha = 0.8f))
        .padding(horizontal = 16.dp, vertical = 8.dp)
        .offset { IntOffset(offset.x.roundToInt(), offset.y.roundToInt()) }
        .pointerInput(Unit) {
            detectDragGestures { change, dragAmount ->
                change.consume()
                offset += dragAmount
                layoutParams.x = offset.x.roundToInt()
                layoutParams.y = offset.y.roundToInt()
                windowManager.updateViewLayout(composeView, layoutParams)
            }
        },
    shape = RoundedCornerShape(8.dp)
) {
    Text(text = "可拖拽悬浮窗", color = Color.Black)
}

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