[Android] 036. Pager

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun PagerScreen(modifier: Modifier = Modifier) {
    val coroutineScope = rememberCoroutineScope()
    var tabIndex by remember { mutableStateOf(0) }
    val category = remember { mutableStateListOf<String>() }
    var pagerState = rememberPagerState(pageCount = {
        if (category.size == 0) 1
        else category.size
    })

    LaunchedEffect(pagerState) {
        snapshotFlow { pagerState.currentPage }.collect { page ->
            tabIndex = page
        }
    }

    Column(modifier) {
        ScrollableTabRow(selectedTabIndex = tabIndex) {
            category.forEachIndexed { index, title ->
                LeadingIconTab(
                    selected = tabIndex == index,
                    onClick = {
                        tabIndex = index
                        coroutineScope.launch {
                            //pagerState.scrollToPage(index)
                            pagerState.animateScrollToPage(index, animationSpec = tween(400))
                        }
                    },
                    text = {
                        val max = LocalConfiguration.current.screenWidthDp.dp * (1F / 3F)
                        Text(title, overflow = TextOverflow.Ellipsis, maxLines = 1, modifier = Modifier.widthIn(max = max))
                    },
                    icon = {}
                )
            }
            // 固定Tab
            LeadingIconTab(
                selected = false,
                onClick = {
                    category.add("ページ ${category.size + 1}")
                },
                text = { Text("＋ タブ追加") },
                icon = {}
            )
        }

        HorizontalPager(
            state = pagerState,
        ) { page ->
            if (category.size == 0) {
                Text("まだ何も登録されていません", modifier = Modifier.fillMaxSize())
            }
            else {
                Text("${category[page]}", modifier = Modifier.fillMaxSize())
            }
        }
    }
}