Replace Material Icons with custom drawable resources (#908)

* Android: Remove Compose Material Icons libraries (#907)

Replace all androidx.compose.material.icons usages with manually-added
vector drawables and drop the material-icons-extended dependency (which
also transitively pulled material-icons-core). Per Google's guidance this
cuts build times and bundle size; the project uses material3, which does
not bundle the icons packages.

Shared control icons (add, remove, navigation, route, volume mute/up, plus
new close and keyboard_arrow_up) now live in the ui-shared module so both
ui-compose and car-app consume a single copy; the six icons previously
duplicated in car-app are moved there and InterfaceCarIcons now resolves
them from ui-shared. The demo-app-only my_location icon stays in demo-app.

Icons are rendered via painterResource + Icon(tint = ...), matching the
existing ManeuverImage pattern. New drawables use Material Symbols to match
the icons car-app already shipped.

Note: paparazzi snapshots for NavigationUIButtonTest, NavigatingInnerGridViewTest
and TripProgressViewTest (exit variant) must be re-recorded
(just record-android-snapshots) since the rendered glyphs change.

https://claude.ai/code/session_012TeDMkp8aF2XywjsNZR6H4

* Update snapshots

---------

Co-authored-by: Claude <noreply@anthropic.com>

Author: ianthetechie

android/car-app/src/main/java/com/stadiamaps/ferrostar/car/app/template/icons/InterfaceCarIcons.kt

@@ -3,7 +3,7 @@ package com.stadiamaps.ferrostar.car.app.template.icons
 import android.content.Context
 import androidx.car.app.model.CarIcon
 import androidx.core.graphics.drawable.IconCompat
-import com.stadiamaps.ferrostar.car.app.R
+import com.stadiamaps.ferrostar.ui.shared.R
 
 class InterfaceCarIcons(context: Context) {
   val add: CarIcon =

android/demo-app/build.gradle

@@ -63,7 +63,6 @@ dependencies {
     implementation libs.androidx.compose.ui.graphics
     implementation libs.androidx.compose.ui.tooling
     implementation libs.androidx.compose.material3
-    implementation libs.androidx.compose.material.icon.extended
 
     implementation libs.androidx.car.app
 

android/demo-app/src/main/java/com/stadiamaps/ferrostar/NotNavigatingOverlay.kt

@@ -4,8 +4,6 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.MyLocation
 import androidx.compose.material3.Button
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
@@ -20,6 +18,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Shadow
 import androidx.compose.ui.layout.boundsInRoot
 import androidx.compose.ui.layout.onGloballyPositioned
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
@@ -80,7 +79,7 @@ fun NotNavigatingOverlay(
               buttonSize = DpSize(48.dp, 48.dp),
           ) {
             Icon(
-                imageVector = Icons.Filled.MyLocation,
+                painter = painterResource(R.drawable.my_location_24px),
                 contentDescription = stringResource(R.string.center_on_my_location),
             )
           }

android/demo-app/src/main/res/drawable/my_location_24px.xml

@@ -0,0 +1,12 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="960"
+    android:viewportHeight="960"
+    android:tint="?attr/colorControlNormal">
+  <group android:translateY="960">
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M440-42v-80q-125-14-214.5-103.5T122-440H42v-80h80q14-125 103.5-214.5T440-838v-80h80v80q125 14 214.5 103.5T838-520h80v80h-80q-14 125-103.5 214.5T520-122v80h-80Zm40-158q116 0 198-82t82-198q0-116-82-198t-198-82q-116 0-198 82t-82 198q0 116 82 198t198 82Zm0-120q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47Zm0-80q33 0 56.5-23.5T560-480q0-33-23.5-56.5T480-560q-33 0-56.5 23.5T400-480q0 33 23.5 56.5T480-400Zm0-80Z"/>
+  </group>
+</vector>

android/gradle/libs.versions.toml

@@ -50,7 +50,6 @@ androidx-compose-ui-graphics = { group = "androidx.compose.ui", name = "ui-graph
 androidx-compose-ui-tooling = { group = "androidx.compose.ui", name = "ui-tooling" }
 androidx-compose-ui-tooling-preview = { group = "androidx.compose.ui", name = "ui-tooling-preview" }
 androidx-compose-material3 = { group = "androidx.compose.material3", name = "material3" }
-androidx-compose-material-icon-extended = { group = "androidx.compose.material", name = "material-icons-extended" }
 androidx-compose-ui-test-manifest = { group = "androidx.compose.ui", name = "ui-test-manifest" }
 # Car App Library (for car-app module)
 androidx-car-app = { group = "androidx.car.app", name = "app", version.ref = "androidx-car-app" }

android/ui-compose/build.gradle

@@ -47,7 +47,6 @@ dependencies {
     implementation libs.androidx.compose.ui.graphics
     implementation libs.androidx.compose.ui.tooling.preview
     implementation libs.androidx.compose.material3
-    implementation libs.androidx.compose.material.icon.extended
 
     implementation project(':core')
     implementation project(':ui-formatters')

android/ui-compose/src/main/java/com/stadiamaps/ferrostar/composeui/views/components/TripProgressView.kt

@@ -11,8 +11,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Icon
@@ -23,6 +21,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
@@ -39,6 +38,7 @@ import com.stadiamaps.ferrostar.ui.formatters.DurationFormatter
 import com.stadiamaps.ferrostar.ui.formatters.EstimatedArrivalDateTimeFormatter
 import com.stadiamaps.ferrostar.ui.formatters.LocalizedDistanceFormatter
 import com.stadiamaps.ferrostar.ui.formatters.LocalizedDurationFormatter
+import com.stadiamaps.ferrostar.ui.shared.R as SharedR
 import kotlin.time.Clock
 import kotlin.time.ExperimentalTime
 import kotlin.time.Instant
@@ -127,7 +127,7 @@ fun TripProgressView(
               contentPadding = PaddingValues(0.dp),
           ) {
             Icon(
-                imageVector = Icons.Filled.Close,
+                painter = painterResource(SharedR.drawable.close_24px),
                 contentDescription = stringResource(id = R.string.end_navigation),
                 tint = theme.exitIconColor,
             )

android/ui-compose/src/main/java/com/stadiamaps/ferrostar/composeui/views/components/controls/NavigationUIButton.kt

@@ -5,8 +5,6 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.FloatingActionButton
 import androidx.compose.material3.FloatingActionButtonDefaults
 import androidx.compose.material3.Icon
@@ -15,11 +13,13 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import com.stadiamaps.ferrostar.composeui.R
+import com.stadiamaps.ferrostar.ui.shared.R as SharedR
 
 /**
  * A FloatingActionButton styled for use in the navigation UI.
@@ -53,7 +53,10 @@ fun NavigationUIButton(
 fun NavigationUIButtonPreview() {
   Box(Modifier.background(Color.LightGray).padding(16.dp)) {
     NavigationUIButton({}, DpSize(56.dp, 56.dp)) {
-      Icon(Icons.Filled.Close, contentDescription = stringResource(id = R.string.end_navigation))
+      Icon(
+          painterResource(SharedR.drawable.close_24px),
+          contentDescription = stringResource(id = R.string.end_navigation),
+      )
     }
   }
 }

android/ui-compose/src/main/java/com/stadiamaps/ferrostar/composeui/views/components/controls/NavigationUIZoomButton.kt

@@ -8,9 +8,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Add
-import androidx.compose.material.icons.filled.Remove
 import androidx.compose.material3.FloatingActionButton
 import androidx.compose.material3.FloatingActionButtonDefaults
 import androidx.compose.material3.HorizontalDivider
@@ -21,11 +18,13 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import com.stadiamaps.ferrostar.composeui.R
+import com.stadiamaps.ferrostar.ui.shared.R as SharedR
 
 @Composable
 fun NavigationUIZoomButton(
@@ -48,7 +47,7 @@ fun NavigationUIZoomButton(
         elevation = elevation,
     ) {
       Icon(
-          imageVector = Icons.Filled.Add,
+          painter = painterResource(SharedR.drawable.add_24px),
           contentDescription = stringResource(id = R.string.zoom_in),
       )
     }
@@ -66,7 +65,7 @@ fun NavigationUIZoomButton(
         elevation = elevation,
     ) {
       Icon(
-          imageVector = Icons.Filled.Remove,
+          painter = painterResource(SharedR.drawable.remove_24px),
           contentDescription = stringResource(id = R.string.zoom_out),
       )
     }

android/ui-compose/src/main/java/com/stadiamaps/ferrostar/composeui/views/components/controls/PillDragHandle.kt

@@ -7,20 +7,20 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.rounded.KeyboardArrowUp
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.semantics.onClick
 import androidx.compose.ui.semantics.role
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import com.stadiamaps.ferrostar.ui.shared.R as SharedR
 
 @Composable
 fun PillDragHandle(
@@ -33,7 +33,7 @@ fun PillDragHandle(
   Box(modifier = modifier.fillMaxWidth().height(handleHeight).clickable(onClick = toggle)) {
     if (isExpanded) {
       Icon(
-          Icons.Rounded.KeyboardArrowUp,
+          painterResource(SharedR.drawable.keyboard_arrow_up_24px),
           modifier = Modifier.align(Alignment.Center),
           contentDescription = "Show upcoming maneuvers",
           tint = iconTintColor,