2021年6月30日水曜日

Jetpack Compose : キーボードが表示されたときに scrollable な Column 内の TextField が見えるようにスクロールする

1. accompanist-insets を入れる implementation "com.google.accompanist:accompanist-insets:$accompanist_version" 2. Activity に android:windowSoftInputMode="adjustResize" をセットする

* accompanist-insets がちゃんと動くために必要 <activity android:name=".RelocationRequesterSampleActivity" android:windowSoftInputMode="adjustResize"> 3. Activity で WindowCompat.setDecorFitsSystemWindows(window, false) する

* accompanist-insets がちゃんと動くために必要 class RelocationRequesterSampleActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) WindowCompat.setDecorFitsSystemWindows(window, false) setContent { MaterialTheme { ProvideWindowInsets { RelocationRequesterSample() } } } } } 4. RelocationRequester を使う @OptIn(ExperimentalComposeUiApi::class) @Composable fun RelocationRequesterSample() { Column( modifier = Modifier .fillMaxSize() .statusBarsPadding() .navigationBarsWithImePadding() .verticalScroll(rememberScrollState()) .padding(24.dp) ) { Spacer( modifier = Modifier .fillMaxSize() .height(600.dp) .background(color = Color.LightGray) ) Spacer(modifier = Modifier.height(24.dp)) val relocationRequester = remember { RelocationRequester() } val interactionSource = remember { MutableInteractionSource() } val isFocused by interactionSource.collectIsFocusedAsState() val ime = LocalWindowInsets.current.ime if (ime.isVisible && !ime.animationInProgress && isFocused) { LaunchedEffect(Unit) { relocationRequester.bringIntoView() } } var value by remember { mutableStateOf("") } OutlinedTextField( value = value, onValueChange = { value = it }, interactionSource = interactionSource, modifier = Modifier.relocationRequester(relocationRequester) ) } }
ちなみに、 relocationRequester.bringIntoView() 部分をコメントアウトするとこうなる



参考


0 件のコメント:

コメントを投稿