Skip to content

Instantly share code, notes, and snippets.

@rizky201008
Created May 20, 2024 15:26
Show Gist options
  • Save rizky201008/4ea0bba95cf09f6358b12c1e04b2593a to your computer and use it in GitHub Desktop.
Save rizky201008/4ea0bba95cf09f6358b12c1e04b2593a to your computer and use it in GitHub Desktop.
How to fix hidden component by virtual keyboard when virtual keyboard showed
import androidx.compose.animation.core.tween
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.foundation.text2.BasicTextField2
import androidx.compose.foundation.text2.input.TextFieldLineLimits
import androidx.compose.foundation.text2.input.TextFieldState
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalConfiguration
import androidx.compose.ui.platform.LocalFocusManager
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.vixiloc.guessnumber.presentation.components.rememberImeState
@OptIn(ExperimentalFoundationApi::class)
@Composable
fun GameScreen(modifier: Modifier = Modifier) {
val focusManager = LocalFocusManager.current
val imeState = rememberImeState()
val scrollState = rememberScrollState()
LaunchedEffect(key1 = imeState.value) {
if (imeState.value) {
scrollState.animateScrollTo(scrollState.maxValue, tween(300))
}
}
Box(
modifier = Modifier,
contentAlignment = Alignment.Center
) {
var value by remember {
mutableStateOf(TextFieldState(""))
}
BasicTextField2(
state = value,
modifier = Modifier,
textStyle = MaterialTheme.typography.bodyLarge.copy(
color = Color.White,
fontSize = 40.sp,
textAlign = TextAlign.Center
),
lineLimits = TextFieldLineLimits.SingleLine,
keyboardOptions = KeyboardOptions(
imeAction = ImeAction.Done,
keyboardType = KeyboardType.Number
),
keyboardActions = KeyboardActions(onDone = {
focusManager.clearFocus()
})
)
}
if (imeState.value) {
Spacer(modifier = Modifier.height(300.dp))
}
}
import android.view.ViewTreeObserver
import androidx.compose.runtime.Composable
import androidx.compose.runtime.DisposableEffect
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.platform.LocalView
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat
@Composable
fun rememberImeState(): State<Boolean> {
val imeState = remember {
mutableStateOf(false)
}
val view = LocalView.current
DisposableEffect(view) {
val listener = ViewTreeObserver.OnGlobalLayoutListener {
val isKeyboardOpen = ViewCompat.getRootWindowInsets(view)
?.isVisible(WindowInsetsCompat.Type.ime()) ?: true
imeState.value = isKeyboardOpen
}
view.viewTreeObserver.addOnGlobalLayoutListener(listener)
onDispose {
view.viewTreeObserver.removeOnGlobalLayoutListener(listener)
}
}
return imeState
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment