Skip to content

Commit 035c113

Browse files
JolandaVerhoefJolandaVerhoef
authored
[Jetsnack] Replace Material Icons with drawable resources (#1592)
Migrates icons from Material Icons Extended to local drawable resources. This change removes the `androidx.compose.material.iconsExtended` dependency and replaces `ImageVector` instances with `@DrawableRes` integers throughout the codebase.
2 parents 1fbc2c2 + 381d9f0 commit 035c113

23 files changed

+161
-52
lines changed

‎Jetsnack/app/build.gradle.kts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,6 @@ dependencies {
125125
implementation(libs.androidx.compose.ui.util)
126126
implementation(libs.androidx.compose.material3)
127127
implementation(libs.androidx.compose.animation)
128-
implementation(libs.androidx.compose.material.iconsExtended)
129128
implementation(libs.androidx.compose.ui.tooling.preview)
130129
debugImplementation(libs.androidx.compose.ui.tooling)
131130

‎Jetsnack/app/src/main/java/com/example/jetsnack/model/Filter.kt

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -16,16 +16,13 @@
1616

1717
package com.example.jetsnack.model
1818

19-
import androidx.compose.material.icons.Icons
20-
import androidx.compose.material.icons.filled.Android
21-
import androidx.compose.material.icons.filled.SortByAlpha
22-
import androidx.compose.material.icons.filled.Star
19+
import androidx.annotation.DrawableRes
2320
import androidx.compose.runtime.Stable
2421
import androidx.compose.runtime.mutableStateOf
25-
import androidx.compose.ui.graphics.vector.ImageVector
22+
import com.example.jetsnack.R
2623

2724
@Stable
28-
class Filter(val name: String, enabled: Boolean = false, val icon: ImageVector? = null) {
25+
class Filter(val name: String, enabled: Boolean = false, @DrawableRes val icon: Int? = null) {
2926
val enabled = mutableStateOf(enabled)
3027
}
3128

@@ -43,9 +40,9 @@ val priceFilters = listOf(
4340
Filter(name = "$$$$"),
4441
)
4542
val sortFilters = listOf(
46-
Filter(name = "Android's favorite (default)", icon = Icons.Filled.Android),
47-
Filter(name = "Rating", icon = Icons.Filled.Star),
48-
Filter(name = "Alphabetical", icon = Icons.Filled.SortByAlpha),
43+
Filter(name = "Android's favorite (default)", icon = R.drawable.ic_android),
44+
Filter(name = "Rating", icon = R.drawable.ic_star),
45+
Filter(name = "Alphabetical", icon = R.drawable.ic_sort_by_alpha),
4946
)
5047

5148
val categoryFilters = listOf(

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/components/Filters.kt

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,6 @@ import androidx.compose.foundation.lazy.LazyRow
3535
import androidx.compose.foundation.lazy.items
3636
import androidx.compose.foundation.selection.toggleable
3737
import androidx.compose.foundation.shape.CircleShape
38-
import androidx.compose.material.icons.Icons
39-
import androidx.compose.material.icons.rounded.FilterList
4038
import androidx.compose.material3.Icon
4139
import androidx.compose.material3.IconButton
4240
import androidx.compose.material3.MaterialTheme
@@ -48,6 +46,7 @@ import androidx.compose.ui.Alignment
4846
import androidx.compose.ui.Modifier
4947
import androidx.compose.ui.graphics.Color
5048
import androidx.compose.ui.graphics.Shape
49+
import androidx.compose.ui.res.painterResource
5150
import androidx.compose.ui.res.stringResource
5251
import androidx.compose.ui.tooling.preview.Preview
5352
import androidx.compose.ui.unit.dp
@@ -82,7 +81,7 @@ fun FilterBar(
8281
),
8382
) {
8483
Icon(
85-
imageVector = Icons.Rounded.FilterList,
84+
painterResource(R.drawable.ic_filter_list),
8685
tint = JetsnackTheme.colors.brand,
8786
contentDescription = stringResource(R.string.label_filters),
8887
modifier = Modifier.diagonalGradientBorder(

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/components/GradientTintedIconButton.kt

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,13 @@
1717
package com.example.jetsnack.ui.components
1818

1919
import android.content.res.Configuration
20+
import androidx.annotation.DrawableRes
2021
import androidx.compose.foundation.background
2122
import androidx.compose.foundation.clickable
2223
import androidx.compose.foundation.interaction.MutableInteractionSource
2324
import androidx.compose.foundation.interaction.collectIsPressedAsState
2425
import androidx.compose.foundation.layout.padding
2526
import androidx.compose.foundation.shape.CircleShape
26-
import androidx.compose.material.icons.Icons
27-
import androidx.compose.material.icons.filled.Add
2827
import androidx.compose.material3.Icon
2928
import androidx.compose.material3.Surface
3029
import androidx.compose.runtime.Composable
@@ -34,14 +33,15 @@ import androidx.compose.ui.Modifier
3433
import androidx.compose.ui.draw.clip
3534
import androidx.compose.ui.graphics.BlendMode
3635
import androidx.compose.ui.graphics.Color
37-
import androidx.compose.ui.graphics.vector.ImageVector
36+
import androidx.compose.ui.res.painterResource
3837
import androidx.compose.ui.tooling.preview.Preview
3938
import androidx.compose.ui.unit.dp
39+
import com.example.jetsnack.R
4040
import com.example.jetsnack.ui.theme.JetsnackTheme
4141

4242
@Composable
4343
fun JetsnackGradientTintedIconButton(
44-
imageVector: ImageVector,
44+
@DrawableRes iconResourceId: Int,
4545
onClick: () -> Unit,
4646
contentDescription: String?,
4747
modifier: Modifier = Modifier,
@@ -89,7 +89,7 @@ fun JetsnackGradientTintedIconButton(
8989
color = Color.Transparent,
9090
) {
9191
Icon(
92-
imageVector = imageVector,
92+
painter = painterResource(id = iconResourceId),
9393
contentDescription = contentDescription,
9494
modifier = modifierColor,
9595
)
@@ -102,7 +102,7 @@ fun JetsnackGradientTintedIconButton(
102102
private fun GradientTintedIconButtonPreview() {
103103
JetsnackTheme {
104104
JetsnackGradientTintedIconButton(
105-
imageVector = Icons.Default.Add,
105+
iconResourceId = R.drawable.ic_add,
106106
onClick = {},
107107
contentDescription = "Demo",
108108
modifier = Modifier.padding(4.dp),

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/components/QuantitySelector.kt

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,9 +21,6 @@ import androidx.compose.animation.Crossfade
2121
import androidx.compose.foundation.layout.Row
2222
import androidx.compose.foundation.layout.padding
2323
import androidx.compose.foundation.layout.widthIn
24-
import androidx.compose.material.icons.Icons
25-
import androidx.compose.material.icons.filled.Add
26-
import androidx.compose.material.icons.filled.Remove
2724
import androidx.compose.material3.MaterialTheme
2825
import androidx.compose.material3.Text
2926
import androidx.compose.runtime.Composable
@@ -54,7 +51,7 @@ fun QuantitySelector(count: Int, decreaseItemCount: () -> Unit, increaseItemCoun
5451
.align(Alignment.CenterVertically),
5552
)
5653
JetsnackGradientTintedIconButton(
57-
imageVector = Icons.Default.Remove,
54+
iconResourceId = R.drawable.ic_remove,
5855
onClick = decreaseItemCount,
5956
contentDescription = stringResource(R.string.label_decrease),
6057
modifier = Modifier.align(Alignment.CenterVertically),
@@ -74,7 +71,7 @@ fun QuantitySelector(count: Int, decreaseItemCount: () -> Unit, increaseItemCoun
7471
)
7572
}
7673
JetsnackGradientTintedIconButton(
77-
imageVector = Icons.Default.Add,
74+
iconResourceId = R.drawable.ic_add,
7875
onClick = increaseItemCount,
7976
contentDescription = stringResource(R.string.label_increase),
8077
modifier = Modifier.align(Alignment.CenterVertically),

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/home/DestinationBar.kt

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,6 @@ import androidx.compose.animation.slideOutVertically
2525
import androidx.compose.foundation.layout.Column
2626
import androidx.compose.foundation.layout.Row
2727
import androidx.compose.foundation.layout.WindowInsets
28-
import androidx.compose.material.icons.Icons
29-
import androidx.compose.material.icons.outlined.ExpandMore
3028
import androidx.compose.material3.ExperimentalMaterial3Api
3129
import androidx.compose.material3.Icon
3230
import androidx.compose.material3.IconButton
@@ -37,6 +35,7 @@ import androidx.compose.material3.TopAppBarDefaults
3735
import androidx.compose.runtime.Composable
3836
import androidx.compose.ui.Alignment
3937
import androidx.compose.ui.Modifier
38+
import androidx.compose.ui.res.painterResource
4039
import androidx.compose.ui.res.stringResource
4140
import androidx.compose.ui.text.style.TextAlign
4241
import androidx.compose.ui.text.style.TextOverflow
@@ -87,7 +86,7 @@ fun DestinationBar(modifier: Modifier = Modifier) {
8786
modifier = Modifier.align(Alignment.CenterVertically),
8887
) {
8988
Icon(
90-
imageVector = Icons.Outlined.ExpandMore,
89+
painter = painterResource(id = R.drawable.ic_expand_more),
9190
tint = JetsnackTheme.colors.brand,
9291
contentDescription =
9392
stringResource(R.string.label_select_delivery),

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/home/FilterScreen.kt

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818

1919
package com.example.jetsnack.ui.home
2020

21+
import androidx.annotation.DrawableRes
2122
import androidx.compose.animation.AnimatedVisibility
2223
import androidx.compose.animation.AnimatedVisibilityScope
2324
import androidx.compose.animation.ExperimentalSharedTransitionApi
@@ -43,9 +44,6 @@ import androidx.compose.foundation.layout.wrapContentSize
4344
import androidx.compose.foundation.rememberScrollState
4445
import androidx.compose.foundation.selection.selectable
4546
import androidx.compose.foundation.verticalScroll
46-
import androidx.compose.material.icons.Icons
47-
import androidx.compose.material.icons.filled.Close
48-
import androidx.compose.material.icons.filled.Done
4947
import androidx.compose.material3.Icon
5048
import androidx.compose.material3.IconButton
5149
import androidx.compose.material3.MaterialTheme
@@ -62,7 +60,7 @@ import androidx.compose.ui.Alignment
6260
import androidx.compose.ui.Modifier
6361
import androidx.compose.ui.draw.clip
6462
import androidx.compose.ui.graphics.Color
65-
import androidx.compose.ui.graphics.vector.ImageVector
63+
import androidx.compose.ui.res.painterResource
6664
import androidx.compose.ui.res.stringResource
6765
import androidx.compose.ui.text.font.FontWeight
6866
import androidx.compose.ui.text.style.TextAlign
@@ -131,7 +129,7 @@ fun FilterScreen(sharedTransitionScope: SharedTransitionScope, animatedVisibilit
131129
Row(modifier = Modifier.height(IntrinsicSize.Min)) {
132130
IconButton(onClick = onDismiss) {
133131
Icon(
134-
imageVector = Icons.Filled.Close,
132+
painter = painterResource(id = R.drawable.ic_close),
135133
contentDescription = stringResource(id = R.string.close),
136134
)
137135
}
@@ -280,14 +278,14 @@ fun FilterTitle(text: String) {
280278
}
281279

282280
@Composable
283-
fun SortOption(text: String, icon: ImageVector?, onClickOption: () -> Unit, selected: Boolean) {
281+
fun SortOption(text: String, @DrawableRes icon: Int?, onClickOption: () -> Unit, selected: Boolean) {
284282
Row(
285283
modifier = Modifier
286284
.padding(top = 14.dp)
287285
.selectable(selected) { onClickOption() },
288286
) {
289287
if (icon != null) {
290-
Icon(imageVector = icon, contentDescription = null)
288+
Icon(painter = painterResource(id = icon), contentDescription = null)
291289
}
292290
Text(
293291
text = text,
@@ -298,7 +296,7 @@ fun SortOption(text: String, icon: ImageVector?, onClickOption: () -> Unit, sele
298296
)
299297
if (selected) {
300298
Icon(
301-
imageVector = Icons.Filled.Done,
299+
painter = painterResource(id = R.drawable.ic_check),
302300
contentDescription = null,
303301
tint = JetsnackTheme.colors.brand,
304302
)

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/home/Home.kt

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616

1717
package com.example.jetsnack.ui.home
1818

19+
import androidx.annotation.DrawableRes
1920
import androidx.annotation.FloatRange
2021
import androidx.annotation.StringRes
2122
import androidx.compose.animation.AnimatedContentScope
@@ -39,11 +40,6 @@ import androidx.compose.foundation.layout.padding
3940
import androidx.compose.foundation.layout.wrapContentSize
4041
import androidx.compose.foundation.selection.selectable
4142
import androidx.compose.foundation.shape.RoundedCornerShape
42-
import androidx.compose.material.icons.Icons
43-
import androidx.compose.material.icons.outlined.AccountCircle
44-
import androidx.compose.material.icons.outlined.Home
45-
import androidx.compose.material.icons.outlined.Search
46-
import androidx.compose.material.icons.outlined.ShoppingCart
4743
import androidx.compose.material3.Icon
4844
import androidx.compose.material3.MaterialTheme
4945
import androidx.compose.material3.Text
@@ -58,13 +54,13 @@ import androidx.compose.ui.graphics.Color
5854
import androidx.compose.ui.graphics.Shape
5955
import androidx.compose.ui.graphics.TransformOrigin
6056
import androidx.compose.ui.graphics.graphicsLayer
61-
import androidx.compose.ui.graphics.vector.ImageVector
6257
import androidx.compose.ui.layout.Layout
6358
import androidx.compose.ui.layout.MeasureResult
6459
import androidx.compose.ui.layout.MeasureScope
6560
import androidx.compose.ui.layout.Placeable
6661
import androidx.compose.ui.layout.layoutId
6762
import androidx.compose.ui.platform.LocalConfiguration
63+
import androidx.compose.ui.res.painterResource
6864
import androidx.compose.ui.res.stringResource
6965
import androidx.compose.ui.tooling.preview.Preview
7066
import androidx.compose.ui.unit.Dp
@@ -157,11 +153,11 @@ fun NavGraphBuilder.addHomeGraph(onSnackSelected: (Long, String, NavBackStackEnt
157153
}
158154
}
159155

160-
enum class HomeSections(@StringRes val title: Int, val icon: ImageVector, val route: String) {
161-
FEED(R.string.home_feed, Icons.Outlined.Home, "home/feed"),
162-
SEARCH(R.string.home_search, Icons.Outlined.Search, "home/search"),
163-
CART(R.string.home_cart, Icons.Outlined.ShoppingCart, "home/cart"),
164-
PROFILE(R.string.home_profile, Icons.Outlined.AccountCircle, "home/profile"),
156+
enum class HomeSections(@StringRes val title: Int, @DrawableRes val icon: Int, val route: String) {
157+
FEED(R.string.home_feed, R.drawable.ic_home, "home/feed"),
158+
SEARCH(R.string.home_search, R.drawable.ic_search, "home/search"),
159+
CART(R.string.home_cart, R.drawable.ic_shopping_cart, "home/cart"),
160+
PROFILE(R.string.home_profile, R.drawable.ic_account_circle, "home/profile"),
165161
}
166162

167163
@Composable
@@ -209,7 +205,7 @@ fun JetsnackBottomBar(
209205
JetsnackBottomNavigationItem(
210206
icon = {
211207
Icon(
212-
imageVector = section.icon,
208+
painter = painterResource(id = section.icon),
213209
tint = tint,
214210
contentDescription = text,
215211
)

‎Jetsnack/app/src/main/java/com/example/jetsnack/ui/home/cart/Cart.kt

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,6 @@ import androidx.compose.foundation.layout.wrapContentWidth
4343
import androidx.compose.foundation.lazy.LazyColumn
4444
import androidx.compose.foundation.lazy.items
4545
import androidx.compose.foundation.shape.RoundedCornerShape
46-
import androidx.compose.material.icons.Icons
47-
import androidx.compose.material.icons.filled.Close
48-
import androidx.compose.material.icons.filled.DeleteForever
4946
import androidx.compose.material3.Icon
5047
import androidx.compose.material3.IconButton
5148
import androidx.compose.material3.MaterialTheme
@@ -60,6 +57,7 @@ import androidx.compose.ui.graphics.RectangleShape
6057
import androidx.compose.ui.graphics.graphicsLayer
6158
import androidx.compose.ui.layout.LastBaseline
6259
import androidx.compose.ui.platform.LocalContext
60+
import androidx.compose.ui.res.painterResource
6361
import androidx.compose.ui.res.stringResource
6462
import androidx.compose.ui.text.style.TextAlign
6563
import androidx.compose.ui.text.style.TextOverflow
@@ -259,7 +257,7 @@ private fun SwipeDismissItemBackground(progress: Float) {
259257
)
260258

261259
Icon(
262-
imageVector = Icons.Filled.DeleteForever,
260+
painter = painterResource(id = R.drawable.ic_delete_forever),
263261
modifier = Modifier
264262
.size(32.dp)
265263
.graphicsLayer(alpha = iconAlpha),
@@ -345,7 +343,7 @@ fun CartItem(
345343
.padding(top = 12.dp),
346344
) {
347345
Icon(
348-
imageVector = Icons.Filled.Close,
346+
painter = painterResource(id = R.drawable.ic_close),
349347
tint = JetsnackTheme.colors.iconSecondary,
350348
contentDescription = stringResource(R.string.label_remove),
351349
)

‎Jetsnack/app/src/main/res/drawable/ic_account_circle.xml

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:width="24dp"
3+
android:height="24dp"
4+
android:viewportWidth="960"
5+
android:viewportHeight="960">
6+
<path
7+
android:fillColor="@android:color/white"
8+
android:pathData="M234,684Q285,645 348,622.5Q411,600 480,600Q549,600 612,622.5Q675,645 726,684Q761,643 780.5,591Q800,539 800,480Q800,347 706.5,253.5Q613,160 480,160Q347,160 253.5,253.5Q160,347 160,480Q160,539 179.5,591Q199,643 234,684ZM480,520Q421,520 380.5,479.5Q340,439 340,380Q340,321 380.5,280.5Q421,240 480,240Q539,240 579.5,280.5Q620,321 620,380Q620,439 579.5,479.5Q539,520 480,520ZM480,880Q397,880 324,848.5Q251,817 197,763Q143,709 111.5,636Q80,563 80,480Q80,397 111.5,324Q143,251 197,197Q251,143 324,111.5Q397,80 480,80Q563,80 636,111.5Q709,143 763,197Q817,251 848.5,324Q880,397 880,480Q880,563 848.5,636Q817,709 763,763Q709,817 636,848.5Q563,880 480,880ZM480,800Q533,800 580,784.5Q627,769 666,740Q627,711 580,695.5Q533,680 480,680Q427,680 380,695.5Q333,711 294,740Q333,769 380,784.5Q427,800 480,800ZM480,440Q506,440 523,423Q540,406 540,380Q540,354 523,337Q506,320 480,320Q454,320 437,337Q420,354 420,380Q420,406 437,423Q454,440 480,440ZM480,380Q480,380 480,380Q480,380 480,380Q480,380 480,380Q480,380 480,380Q480,380 480,380Q480,380 480,380Q480,380 480,380Q480,380 480,380ZM480,740Q480,740 480,740Q480,740 480,740Q480,740 480,740Q480,740 480,740Q480,740 480,740Q480,740 480,740Q480,740 480,740Q480,740 480,740Z"/>
9+
</vector>

0 commit comments

Comments
 (0)