Skip to content

Commit 6d2e477

Browse files
authored
feat: tooltip for icons (#1214)
1 parent 279adbe commit 6d2e477

File tree

3 files changed

+51
-68
lines changed

3 files changed

+51
-68
lines changed

app/src/main/kotlin/li/songe/gkd/ui/component/AnimatedIcon.kt

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@ import androidx.annotation.DrawableRes
44
import androidx.compose.animation.graphics.res.animatedVectorResource
55
import androidx.compose.animation.graphics.res.rememberAnimatedVectorPainter
66
import androidx.compose.animation.graphics.vector.AnimatedImageVector
7-
import androidx.compose.material3.Icon
8-
import androidx.compose.material3.LocalContentColor
7+
import androidx.compose.material3.*
98
import androidx.compose.runtime.Composable
109
import androidx.compose.ui.Modifier
1110
import androidx.compose.ui.graphics.Color
@@ -24,12 +23,21 @@ fun AnimatedIcon(
2423
animation,
2524
atEnd,
2625
)
27-
Icon(
28-
modifier = modifier,
29-
painter = painter,
30-
contentDescription = contentDescription,
31-
tint = tint,
32-
)
26+
TooltipBox(
27+
tooltip = { PlainTooltip { Text(text = contentDescription.orEmpty()) } },
28+
state = rememberTooltipState(),
29+
enableUserInput = !contentDescription.isNullOrEmpty(),
30+
positionProvider = TooltipDefaults.rememberTooltipPositionProvider(
31+
TooltipAnchorPosition.Start
32+
)
33+
) {
34+
Icon(
35+
modifier = modifier,
36+
painter = painter,
37+
contentDescription = contentDescription,
38+
tint = tint,
39+
)
40+
}
3341
}
3442

3543
private fun getIconDesc(@DrawableRes id: Int, atEnd: Boolean): String? = when (id) {

app/src/main/kotlin/li/songe/gkd/ui/component/PerfIcon.kt

Lines changed: 34 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -2,56 +2,12 @@ package li.songe.gkd.ui.component
22

33
import androidx.annotation.DrawableRes
44
import androidx.compose.material.icons.Icons
5-
import androidx.compose.material.icons.automirrored.filled.ArrowBack
6-
import androidx.compose.material.icons.automirrored.filled.ArrowForward
7-
import androidx.compose.material.icons.automirrored.filled.FormatListBulleted
8-
import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight
9-
import androidx.compose.material.icons.automirrored.filled.Sort
5+
import androidx.compose.material.icons.automirrored.filled.*
106
import androidx.compose.material.icons.automirrored.outlined.HelpOutline
117
import androidx.compose.material.icons.automirrored.outlined.OpenInNew
12-
import androidx.compose.material.icons.filled.Android
13-
import androidx.compose.material.icons.filled.Apps
14-
import androidx.compose.material.icons.filled.Autorenew
15-
import androidx.compose.material.icons.filled.Block
16-
import androidx.compose.material.icons.filled.CenterFocusWeak
17-
import androidx.compose.material.icons.filled.Close
18-
import androidx.compose.material.icons.filled.History
19-
import androidx.compose.material.icons.filled.Memory
20-
import androidx.compose.material.icons.filled.MoreVert
21-
import androidx.compose.material.icons.filled.Share
22-
import androidx.compose.material.icons.filled.UnfoldMore
23-
import androidx.compose.material.icons.filled.WarningAmber
24-
import androidx.compose.material.icons.outlined.Add
25-
import androidx.compose.material.icons.outlined.Api
26-
import androidx.compose.material.icons.outlined.ArrowDownward
27-
import androidx.compose.material.icons.outlined.AutoMode
28-
import androidx.compose.material.icons.outlined.Check
29-
import androidx.compose.material.icons.outlined.ContentCopy
30-
import androidx.compose.material.icons.outlined.DarkMode
31-
import androidx.compose.material.icons.outlined.Delete
32-
import androidx.compose.material.icons.outlined.Eco
33-
import androidx.compose.material.icons.outlined.Edit
34-
import androidx.compose.material.icons.outlined.Equalizer
35-
import androidx.compose.material.icons.outlined.Home
36-
import androidx.compose.material.icons.outlined.Image
37-
import androidx.compose.material.icons.outlined.Info
38-
import androidx.compose.material.icons.outlined.Layers
39-
import androidx.compose.material.icons.outlined.LightMode
40-
import androidx.compose.material.icons.outlined.Lock
41-
import androidx.compose.material.icons.outlined.Notifications
42-
import androidx.compose.material.icons.outlined.RocketLaunch
43-
import androidx.compose.material.icons.outlined.Save
44-
import androidx.compose.material.icons.outlined.Settings
45-
import androidx.compose.material.icons.outlined.TextFields
46-
import androidx.compose.material.icons.outlined.Title
47-
import androidx.compose.material.icons.outlined.ToggleOff
48-
import androidx.compose.material.icons.outlined.ToggleOn
49-
import androidx.compose.material.icons.outlined.VerifiedUser
50-
import androidx.compose.material3.Icon
51-
import androidx.compose.material3.IconButton
52-
import androidx.compose.material3.IconButtonColors
53-
import androidx.compose.material3.IconButtonDefaults
54-
import androidx.compose.material3.LocalContentColor
8+
import androidx.compose.material.icons.filled.*
9+
import androidx.compose.material.icons.outlined.*
10+
import androidx.compose.material3.*
5511
import androidx.compose.runtime.Composable
5612
import androidx.compose.ui.Modifier
5713
import androidx.compose.ui.graphics.Color
@@ -66,12 +22,21 @@ fun PerfIcon(
6622
modifier: Modifier = Modifier,
6723
tint: Color = LocalContentColor.current,
6824
contentDescription: String? = getDefaultDesc(imageVector),
69-
) = Icon(
70-
imageVector = imageVector,
71-
modifier = modifier,
72-
contentDescription = contentDescription,
73-
tint = tint
74-
)
25+
) = TooltipBox(
26+
tooltip = { PlainTooltip { Text(text = contentDescription.orEmpty()) } },
27+
state = rememberTooltipState(),
28+
enableUserInput = !contentDescription.isNullOrEmpty(),
29+
positionProvider = TooltipDefaults.rememberTooltipPositionProvider(
30+
TooltipAnchorPosition.Start
31+
)
32+
) {
33+
Icon(
34+
imageVector = imageVector,
35+
modifier = modifier,
36+
contentDescription = contentDescription,
37+
tint = tint
38+
)
39+
}
7540

7641
@Composable
7742
fun PerfIconButton(
@@ -106,12 +71,21 @@ fun PerfIcon(
10671
modifier: Modifier = Modifier,
10772
tint: Color = LocalContentColor.current,
10873
contentDescription: String? = null,
109-
) = Icon(
110-
painter = painterResource(id),
111-
modifier = modifier,
112-
contentDescription = contentDescription,
113-
tint = tint
114-
)
74+
) = TooltipBox(
75+
tooltip = { PlainTooltip { Text(text = contentDescription.orEmpty()) } },
76+
state = rememberTooltipState(),
77+
enableUserInput = !contentDescription.isNullOrEmpty(),
78+
positionProvider = TooltipDefaults.rememberTooltipPositionProvider(
79+
TooltipAnchorPosition.Start
80+
)
81+
) {
82+
Icon(
83+
painter = painterResource(id),
84+
modifier = modifier,
85+
contentDescription = contentDescription,
86+
tint = tint
87+
)
88+
}
11589

11690
@Composable
11791
fun PerfIconButton(

app/src/main/kotlin/li/songe/gkd/ui/home/ControlPage.kt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,7 @@ fun useControlPage(): ScaffoldExt {
8484
PerfIconButton(
8585
imageVector = PerfIcon.RocketLaunch,
8686
onClickLabel = "前往无障碍授权页面",
87+
contentDescription = "无障碍授权",
8788
onClick = throttle {
8889
mainVm.navigatePage(AuthA11YPageDestination)
8990
},

0 commit comments

Comments
 (0)