Update emoji menu popup

This commit is contained in:
Aleksandras Kostarevas 2024-04-22 11:46:28 -04:00
parent 5b42876fc9
commit b4f198944f

View File

@ -1,13 +1,13 @@
package org.futo.inputmethod.latin.uix.actions package org.futo.inputmethod.latin.uix.actions
import android.content.Context import android.content.Context
import android.util.Log
import android.view.LayoutInflater import android.view.LayoutInflater
import android.view.View import android.view.View
import android.view.ViewGroup import android.view.ViewGroup
import android.view.accessibility.AccessibilityEvent import android.view.accessibility.AccessibilityEvent
import android.widget.TextView import android.widget.TextView
import androidx.annotation.UiThread import androidx.annotation.UiThread
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.Canvas import androidx.compose.foundation.Canvas
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
@ -44,6 +44,7 @@ import androidx.compose.ui.draw.clipToBounds
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.drawscope.translate import androidx.compose.ui.graphics.drawscope.translate
import androidx.compose.ui.graphics.toArgb import androidx.compose.ui.graphics.toArgb
import androidx.compose.ui.input.pointer.PointerEventPass
import androidx.compose.ui.input.pointer.PointerEventType import androidx.compose.ui.input.pointer.PointerEventType
import androidx.compose.ui.input.pointer.pointerInput import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.layout.onSizeChanged import androidx.compose.ui.layout.onSizeChanged
@ -216,6 +217,7 @@ fun Emojis(
} }
var activePopup: PopupInfo? by rememberSaveable { mutableStateOf(null) } var activePopup: PopupInfo? by rememberSaveable { mutableStateOf(null) }
var popupIsActive by rememberSaveable { mutableStateOf(false) }
val color = LocalContentColor.current val color = LocalContentColor.current
@ -223,7 +225,10 @@ fun Emojis(
EmojiGridAdapter( EmojiGridAdapter(
emojis, emojis,
onClick, onClick,
onSelectSkinTone = { activePopup = it }, onSelectSkinTone = {
activePopup = it
popupIsActive = true
},
emojiWidth, emojiWidth,
color color
) )
@ -255,65 +260,74 @@ fun Emojis(
(it.layoutManager as GridLayoutManager).spanCount = viewWidth / emojiWidth (it.layoutManager as GridLayoutManager).spanCount = viewWidth / emojiWidth
} }
}, },
modifier = Modifier.fillMaxSize() modifier = Modifier
.fillMaxSize()
.clipToBounds() .clipToBounds()
.onSizeChanged { .onSizeChanged {
viewWidth = it.width viewWidth = it.width
viewHeight = it.height viewHeight = it.height
}.pointerInput(Unit) { }
.pointerInput(Unit) {
awaitPointerEventScope { awaitPointerEventScope {
while (true) { while (true) {
val event = awaitPointerEvent() val event = awaitPointerEvent(PointerEventPass.Initial)
if(event.type == PointerEventType.Press) { if (event.type == PointerEventType.Press && popupIsActive) {
activePopup = null popupIsActive = false
event.changes.firstOrNull()?.consume()
} else if(event.type == PointerEventType.Move && popupIsActive) {
event.changes.firstOrNull()?.consume()
} }
} }
} }
} }
) )
activePopup?.let { popupInfo -> val posX = (activePopup?.x ?: 0) - popupSize.width / 2
val posX = popupInfo.x - popupSize.width / 2 val posY = (activePopup?.y ?: 0) - popupSize.height
val posY = popupInfo.y - popupSize.height
// Calculate the maximum possible x and y values // Calculate the maximum possible x and y values
val maxX = viewWidth - popupSize.width val maxX = viewWidth - popupSize.width
val maxY = viewHeight - popupSize.height val maxY = viewHeight - popupSize.height
// Calculate the x and y values, clamping them to the maximum values if necessary // Calculate the x and y values, clamping them to the maximum values if necessary
val x = min(maxX, max(0, posX)) val x = min(maxX, max(0, posX))
val y = min(maxY, max(0, posY)) val y = min(maxY, max(0, posY))
Box(modifier = Modifier.onSizeChanged { AnimatedVisibility(visible = popupIsActive, modifier = Modifier
.onSizeChanged {
popupSize = it popupSize = it
}.absoluteOffset { }
.absoluteOffset {
IntOffset(x, y) IntOffset(x, y)
}) { }) {
Surface( activePopup?.let { popupInfo ->
color = MaterialTheme.colorScheme.primaryContainer, Box {
shape = RoundedCornerShape(8.dp) Surface(
) { color = MaterialTheme.colorScheme.primaryContainer,
Row { shape = RoundedCornerShape(8.dp)
generateSkinToneVariants(popupInfo.emoji.emoji, emojiMap).map { emoji -> ) {
IconButton( Row {
onClick = { generateSkinToneVariants(popupInfo.emoji.emoji, emojiMap).map { emoji ->
onClick( IconButton(
EmojiItem( onClick = {
emoji = emoji, onClick(
description = popupInfo.emoji.description, EmojiItem(
category = popupInfo.emoji.category, emoji = emoji,
skinTones = false, description = popupInfo.emoji.description,
aliases = listOf(), category = popupInfo.emoji.category,
tags = listOf() skinTones = false,
aliases = listOf(),
tags = listOf()
)
) )
) popupIsActive = false
activePopup = null }, modifier = Modifier
}, modifier = Modifier .width(42.dp)
.width(42.dp) .height(42.dp)
.height(42.dp) ) {
) { Box {
Box { Text(emoji, modifier = Modifier.align(Alignment.Center))
Text(emoji, modifier = Modifier.align(Alignment.Center)) }
} }
} }
} }
@ -353,10 +367,10 @@ fun BottomRowKeyboardNavigation(onExit: () -> Unit, onBackspace: () -> Unit, onS
// IconButton(onClick = { onBackspace() }) { // IconButton(onClick = { onBackspace() }) {
Box(modifier = Modifier Box(modifier = Modifier
.minimumInteractiveComponentSize() .minimumInteractiveComponentSize()
.repeatablyClickableAction { onBackspace() } .repeatablyClickableAction { onBackspace() }
.size(40.dp) .size(40.dp)
.clip(RoundedCornerShape(100)), .clip(RoundedCornerShape(100)),
contentAlignment = Alignment.Center) contentAlignment = Alignment.Center)
{ {
val icon = painterResource(id = R.drawable.delete) val icon = painterResource(id = R.drawable.delete)