11package shop.itbug.flutterx.widget
22
3+ import androidx.compose.foundation.background
4+ import androidx.compose.foundation.clickable
5+ import androidx.compose.foundation.horizontalScroll
6+ import androidx.compose.foundation.layout.Arrangement
7+ import androidx.compose.foundation.layout.Row
8+ import androidx.compose.foundation.layout.padding
9+ import androidx.compose.foundation.rememberScrollState
10+ import androidx.compose.foundation.shape.RoundedCornerShape
311import androidx.compose.runtime.Composable
4- import androidx.compose.runtime.remember
512import androidx.compose.ui.Modifier
6- import org.jetbrains.jewel.foundation.ExperimentalJewelApi
13+ import androidx.compose.ui.draw.clip
14+ import androidx.compose.ui.graphics.Color
15+ import androidx.compose.ui.text.style.TextOverflow
16+ import androidx.compose.ui.unit.dp
717import org.jetbrains.jewel.foundation.theme.JewelTheme
8- import org.jetbrains.jewel.ui.component.SimpleTabContent
9- import org.jetbrains.jewel.ui.component.TabData
10- import org.jetbrains.jewel.ui.component.TabStrip
18+ import org.jetbrains.jewel.ui.component.Text
1119import org.jetbrains.jewel.ui.component.styling.TabStyle
1220import org.jetbrains.jewel.ui.theme.editorTabStyle
21+ import org.jetbrains.jewel.ui.theme.simpleListItemStyle
1322
1423/* *
1524 * 自定义的 TabRow 容器。
@@ -19,27 +28,39 @@ import org.jetbrains.jewel.ui.theme.editorTabStyle
1928 * @param modifier 应用于整个组件的 Modifier。
2029 * @param onTabClick 当一个 Tab 被点击时的回调,返回被点击的 Tab 索引。
2130 */
22- @OptIn(ExperimentalJewelApi ::class )
2331@Composable
32+ @Suppress(" UNUSED_PARAMETER" )
2433fun CustomTabRow (
2534 selectedTabIndex : Int ,
2635 tabs : List <String >,
2736 modifier : Modifier = Modifier ,
2837 onTabClick : (Int ) -> Unit ,
2938 style : TabStyle = JewelTheme .editorTabStyle
3039) {
31- val tabs = remember(selectedTabIndex,tabs) {
32- tabs.mapIndexed { index, string ->
33- TabData .Default (
34- selected = index == selectedTabIndex,
35- content = { SimpleTabContent (string,it) },
36- closable = false ,
37- onClick = { onTabClick(index) }
40+ Row (
41+ modifier = modifier
42+ .horizontalScroll(rememberScrollState())
43+ .padding(horizontal = 6 .dp, vertical = 4 .dp),
44+ horizontalArrangement = Arrangement .spacedBy(6 .dp)
45+ ) {
46+ tabs.forEachIndexed { index, title ->
47+ val selected = index == selectedTabIndex
48+ val backgroundColor =
49+ if (selected) JewelTheme .simpleListItemStyle.colors.backgroundSelectedActive else Color .Transparent
50+ val textColor =
51+ if (selected) JewelTheme .globalColors.text.normal else JewelTheme .globalColors.text.info
52+
53+ Text (
54+ text = title,
55+ color = textColor,
56+ maxLines = 1 ,
57+ overflow = TextOverflow .Ellipsis ,
58+ modifier =
59+ Modifier .clip(RoundedCornerShape (6 .dp))
60+ .background(backgroundColor)
61+ .clickable { onTabClick(index) }
62+ .padding(horizontal = 12 .dp, vertical = 6 .dp)
3863 )
3964 }
4065 }
41- TabStrip (
42- tabs, style = style,
43- modifier = modifier,
44- )
4566}
0 commit comments