Jetpack?Compose?DropdownMenu手指跟隨點擊顯示
更新時間：2022年11月17日 14:09:17 作者：九狼
這篇文章主要為大家介紹了Jetpack?Compose?DropdownMenu手指跟隨點擊位置顯示實現(xiàn)方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
引言
DropdownMenu顯示時默認(rèn)會避開點擊的view 通常默認(rèn)顯示在左下方
本篇文章教你實現(xiàn)跟隨手指按下位置顯示
效果圖
實現(xiàn)方法
首先要獲取到點擊的位置之后計算偏移量
先分析兩種offset參數(shù)
1使用DropdownMenu的offset參數(shù)
獲取到點擊的位置之后計算偏移量， DropdownMenu的offset參數(shù)
@Composable
fun DropdownMenu(
...
offset: DpOffset = DpOffset(0.dp, 0.dp)
...
)
這種方法比較麻煩，要反向計算偏移量，因為初始位置（x，y）軸的原點在左下角,而不是左上角
2Modifier.offset
將DropdownMenu嵌套在Box里面,調(diào)用BoxD的Modifier.offset()改變DropdownMenu的顯示位置
這種方案的的初始位置（x，y）軸的原點在左上角
點擊的位置就是DropdownMenu的偏移量，
獲取到點擊的位置
層級結(jié)構(gòu)
Box{
card()
Box{
DropdownMenu()
}
}
Box創(chuàng)建用于監(jiān)聽點擊事件修飾符
在最外層的Box創(chuàng)建一個用于監(jiān)聽點擊事件的修飾符，來捕獲點擊位置
val animatedOffset = remember { Animatable(Offset(0f, 0f), Offset.VectorConverter) }
Box(
modifier = Modifier
.fillMaxWidth()
.pointerInput(Unit) {
coroutineScope {
while (true) {
//獲取點擊位置
val boxOffset = awaitPointerEventScope {
awaitFirstDown().position
}
//顯示DropdownMenu
expanded = true
launch {
animatedOffset.animateTo(
boxOffset,
animationSpec = spring(stiffness = Spring.StiffnessLow)
)
}
}
}
}
)
DropdownMenu外層的Box()設(shè)置偏移量
Box(modifier = Modifier.offset {
IntOffset(
animatedOffset.value.x.roundToInt(),
animatedOffset.value.y.roundToInt()
)
} ) {
DropdownMenu()
}
完整代碼
@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun FullContent(
modifier: Modifier,
context: String
) {
var expanded by remember { mutableStateOf(false) }
val animatedOffset = remember { Animatable(Offset(0f, 0f), Offset.VectorConverter) }
Box(
modifier = Modifier
.fillMaxWidth()
.pointerInput(Unit) {
coroutineScope {
while (true) {
//獲取點擊位置
val boxOffset = awaitPointerEventScope {
awaitFirstDown().position
}
expanded = true
launch {
animatedOffset.animateTo(
boxOffset,
animationSpec = spring(stiffness = Spring.StiffnessLow)
)
}
}
}
}
) {
Card(modifier = modifier
.fillMaxWidth(),
border = BorderStroke(2.dp, CustomTheme.colors.divider)
) {
Text(
text = context,
modifier = Modifier.padding(6.dp),
fontSize = 17.sp,
fontWeight = FontWeight.Normal,
)
}
Box(modifier = Modifier.offset {
IntOffset(
animatedOffset.value.x.roundToInt(),
animatedOffset.value.y.roundToInt()
)
} ) {
DropdownMenu(
expanded = expanded,
onDismissRequest = { expanded = false }
) {
DropdownMenuItem(
text = {
Text(stringResource(id = R.string.app_copy))
},
onClick = {
})
DropdownMenuItem(
text = {
Text(stringResource(id = R.string.app_copy))
},
onClick = {
})
Divider()
DropdownMenuItem(
text = {
Text(stringResource(id = R.string.app_copy))
},
onClick = {
})
}
}
}
}
使用方法
FullContent(
modifier = Modifier.fillMaxWidth(),
context = "悄悄的我走了，
正如我悄悄的來；
我揮一揮衣袖，
不帶走一片云彩。"
)以上就是Jetpack Compose DropdownMenu手指跟隨點擊顯示的詳細(xì)內(nèi)容，更多關(guān)于Jetpack Compose DropdownMenu的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
Android編程實現(xiàn)設(shè)置按鈕背景透明與半透明及圖片背景透明的方法
這篇文章主要介紹了Android編程實現(xiàn)設(shè)置按鈕背景透明與半透明及圖片背景透明的方法,結(jié)合實例形式較為詳細(xì)的分析了Button及ImageButton的背景屬性設(shè)置技巧,非常簡單實用,需要的朋友可以參考下2015-12-12
Android實現(xiàn)可播放GIF動畫的ImageView
這篇文章主要為大家詳細(xì)介紹了Android實現(xiàn)可播放GIF動畫的ImageView,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-09-09
Android DynamicGrid實現(xiàn)拖曳交換位置功能
這篇文章主要為大家詳細(xì)介紹了Android DynamicGrid實現(xiàn)拖曳交換位置功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-06-06
Android音視頻開發(fā)之MediaExtactor使用教程
MediaExtactor在Android音視頻開發(fā)中負(fù)責(zé)提取音視頻信息和數(shù)據(jù)流的功能，可以通過該類實現(xiàn)從多媒體文件中剝離得到音頻和視頻的能力。本文將詳細(xì)為大家介紹一下它的使用，感興趣的可以了解一下2022-04-04
這篇文章主要為大家介紹了內(nèi)存泄漏檢測工具LeakCanary源碼解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-01-01
Kotlin協(xié)程操作之創(chuàng)建啟動掛起恢復(fù)詳解
本文的定位是協(xié)程的創(chuàng)建、啟動、掛起、恢復(fù)，也會示例一些簡單的使用，這里不對suspend講解，，也不對協(xié)程的高級用法做闡述（熱數(shù)據(jù)通道Channel、冷數(shù)據(jù)流Flow...），本文主要講協(xié)程稍微深入的全面知識2022-08-08
Android創(chuàng)建外部lib庫及自定義View的圖文教程
這篇文章主要給大家介紹了關(guān)于Android創(chuàng)建外部lib庫及自定義View的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
輕松實現(xiàn)可擴展自定義的Android滾輪時間選擇控件
這篇文章主要為大家詳細(xì)介紹了可擴展自定義的Android滾輪時間選擇控件，結(jié)合WheelView實現(xiàn)滾輪選擇日期操作，感興趣的小伙伴們可以參考一下2016-07-07
Android 仿微博的點贊功能的實現(xiàn)原理(持續(xù)點贊再取消)
經(jīng)常玩微博的同志都知道，微博的持續(xù)點贊再取消功能，下面小編給大家?guī)砹薃ndroid 仿微博的點贊功能的實現(xiàn)原理(持續(xù)點贊再取消)，感興趣的朋友跟隨腳本之家小編一起看看吧2018-03-03
這篇文章主要為大家詳細(xì)介紹了Android studio實現(xiàn)菜單操作，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10