Julian/Gitnuro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Close tab button is hidden if the tab is not selected or hovered

Browse Source
This commit is contained in:
Abdelilah El Aissaoui 2022-10-03 22:29:25 +02:00
parent fad8a2779e
commit e0bdc52409
1 changed files with 26 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/main/kotlin/com/jetpackduba/gitnuro/ui/components/RepositoriesTabPanel.kt
View File

@ -3,6 +3,9 @@
package com.jetpackduba.gitnuro.ui.components package com.jetpackduba.gitnuro.ui.components
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.hoverable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.interaction.collectIsHoveredAsState
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyListScope import androidx.compose.foundation.lazy.LazyListScope
import androidx.compose.foundation.lazy.LazyRow import androidx.compose.foundation.lazy.LazyRow
@ -55,7 +58,7 @@ fun RepositoriesTabPanel(
items(items = tabs) { tab -> items(items = tabs) { tab ->
Tab( Tab(
title = tab.tabName, title = tab.tabName,
selected = tab.key == selectedTabKey, isSelected = tab.key == selectedTabKey,
onClick = { onClick = {
onTabSelected(tab.key) onTabSelected(tab.key)
}, },
@ -109,7 +112,7 @@ fun TabPanel(
this.tabs() this.tabs()
item { item {
Box (modifier = Modifier.fillMaxSize()) { Box(modifier = Modifier.fillMaxSize()) {
IconButton( IconButton(
onClick = onNewTabClicked, onClick = onNewTabClicked,
modifier = Modifier modifier = Modifier
@ -129,17 +132,21 @@ fun TabPanel(
} }
@Composable @Composable
fun Tab(title: MutableState<String>, selected: Boolean, onClick: () -> Unit, onCloseTab: () -> Unit) { fun Tab(title: MutableState<String>, isSelected: Boolean, onClick: () -> Unit, onCloseTab: () -> Unit) {
Box { Box {
val backgroundColor = if (selected) val backgroundColor = if (isSelected)
MaterialTheme.colors.surface MaterialTheme.colors.surface
else else
MaterialTheme.colors.background MaterialTheme.colors.background
val hoverInteraction = remember { MutableInteractionSource() }
val isHovered by hoverInteraction.collectIsHoveredAsState()
Box( Box(
modifier = Modifier modifier = Modifier
.width(180.dp) .width(180.dp)
.fillMaxHeight() .fillMaxHeight()
.hoverable(hoverInteraction)
.handMouseClickable { onClick() } .handMouseClickable { onClick() }
.background(backgroundColor), .background(backgroundColor),
) { ) {
@ -158,17 +165,24 @@ fun Tab(title: MutableState<String>, selected: Boolean, onClick: () -> Unit, onC
style = MaterialTheme.typography.body2, style = MaterialTheme.typography.body2,
maxLines = 1, maxLines = 1,
) )
IconButton(
onClick = onCloseTab, if (isHovered || isSelected) {
modifier = Modifier IconButton(
.padding(horizontal = 8.dp) onClick = onCloseTab,
.size(14.dp) modifier = Modifier
) { .padding(horizontal = 8.dp)
Icon(Icons.Default.Close, contentDescription = null, tint = MaterialTheme.colors.primaryTextColor) .size(14.dp)
) {
Icon(
Icons.Default.Close,
contentDescription = null,
tint = MaterialTheme.colors.primaryTextColor
)
}
} }
} }
if (selected) { if (isSelected) {
Box( Box(
modifier = Modifier modifier = Modifier
.align(Alignment.BottomCenter) .align(Alignment.BottomCenter)