https://kotlinlang.org logo
#compose-ios
Title
# compose-ios
j

Joel Denke

02/23/2024, 8:17 AM
As of example when using the Search bar in Material 3, you ofc get IME action search. But in iOS not possible to get focus in another Compose element. And iOS for some stupid reason dont have back button or gesture back or any button on keyboard to close it. Whats the standard solution to this? My so far pretty odd solution is to make sure having ime action = DONE or Next, to give user option to manually close keyboard from that. But is this a bug in CMP or missing feature need to deal with? Feels very odd to me, both Apple UX but CMP behaviour of keyboard in general on iOS. Any ideas is welcome. And no this doesnt work at all to change focus outside of software keyboard:
Copy code
@Composable
fun ClearFocusBox(modifier: Modifier = Modifier, content: @Composable () -> Unit) {
    val focusManager = LocalFocusManager.current
    Box(
        modifier.focusable().pointerInput(Unit) {
            detectTapGestures {
               focusManager.clearFocus(force = true)
            }
        },
    ) {
        content()
    }
}
d

Dima Avdeev

02/23/2024, 10:39 AM
Hello! You can try following solution:
Copy code
@Composable
private fun ClearFocusBox(content: @Composable () -> Unit) {
    val focusManager = LocalFocusManager.current
    Box(
        Modifier.fillMaxSize()
            .pointerInput(Unit) {
                detectTapGestures {
                    focusManager.clearFocus(force = true)
                }
            },
    ) {
        content()
    }
}
Pay attention to Modifier.fillMaxSize()
j

Joel Denke

02/23/2024, 10:42 AM
I used that with fillMaxSize as input Modifier, not working, at least not in Bottomsheets or scrollable lists. Doesnt shift focus for me in iOS. Also could you clarify how to use it, maybe I added it in the wrong place, or missed some settings required to make it happen? Do I need to add it as the outer layer in my top root COmposable? I think the pointerInput is intercepted by other things like scroll events if touch on scrollable elements, which basically my entire app is?
d

Dima Avdeev

02/23/2024, 12:27 PM
We added this ClearFocusBox in fullscreen of ComposeApp to catch focus after TextField
👍 1
j

Joel Denke

02/23/2024, 1:27 PM
Cool will try it out again and see if helps put most other place. Could be that Circuit overlay intercept focus maybe, not sure.
@Dima Avdeev Just FYI it works in Android but not in iOS for me. Quite annoying as I only want the behaviour to work in iOS 😛
d

Dima Avdeev

02/26/2024, 9:50 AM
j

Joel Denke

02/26/2024, 10:39 AM
Hmm yeah ok, seems like partly working depending on where I use it. In basic screen like sample provided above it works, but not more complex scenario with like Circuit overlay + bottomsheet from M3.
8 Views