So, i’m using HorizontalPager, but i’m struggling ...

# compose

[mattinger]

So, i’m using HorizontalPager, but i’m struggling with the accessibility end of it. In particular what to do as i switch visible pages. I would like it to announce the text field that i’m putting in there. However, it’s announcing the “Close” button at first, and then when i switch pages, it doesn’t announce anything. I’ve tried using a focusRequester, but that hasn’t really done anything. code in 🧵

[mattinger]

@OptIn(ExperimentalPagerApi::class)
@Preview
@Composable
fun CarouselPreview() {
    MaterialTheme {
        Scaffold(
            topBar = {
                TopAppBar(
                    title = { },
                    actions = {
                        IconButton(onClick = { }) {
                            Icon(imageVector = Icons.Default.Close, contentDescription = "Close")
                        }
                    }
                )
            }
        ) {
            Column(
                modifier = Modifier
                    .padding(it)
                    .fillMaxSize(),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = spacedBy(16.dp),
            ) {
                val pagerState = rememberPagerState()
                val focusRequesters = remember {
                    (0 until 6).map {
                        FocusRequester()
                    }
                }
                val flow = snapshotFlow { pagerState.currentPage }

                LaunchedEffect(key1 = pagerState) {
                    flow.collect { index ->
                        focusRequesters[index].requestFocus()
                    }
                }

                HorizontalPager(
                    modifier = Modifier
                        .weight(1.0f, true)
                        .fillMaxWidth(),
                    count = 6,
                    state = pagerState
                ) { index ->
                    Box(s
                        contentAlignment = Alignment.Center
                    ) {
                        Text(
                            modifier = Modifier
                                .focusable(true)
                                .focusRequester(focusRequesters[index]),
                            text = "Page ${index}"
                        )
                    }
                }

                HorizontalPagerIndicator(pagerState = pagerState)
            }
        }
    }
}