Skip to content

getImageSource error in android materialSymbol is not working #507

@monilraycha

Description

@monilraycha

Before submitting a new issue

  • I tested using the latest version of the library, as the bug might be already fixed.
  • I tested using a supported version of react native.
  • I checked for possible duplicate issues, with possible answers.

Bug summary

I tested in ios it is working sf symbol but in android it throws error

Image

Library version

0.84.1

Environment info

info Fetching system and libraries information...
System:
  OS: macOS 26.3.1
  CPU: (8) arm64 Apple M2
  Memory: 99.41 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 25.8.1
    path: /opt/homebrew/bin/node
  Yarn: Not Found
  npm:
    version: 11.11.0
    path: /opt/homebrew/bin/npm
  Watchman:
    version: 2026.03.16.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /Users/monilraycha/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 25.2
      - iOS 26.2
      - macOS 26.2
      - tvOS 26.2
      - visionOS 26.2
      - watchOS 26.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2025.3 AI-253.30387.90.2532.14935130
  Xcode:
    version: 26.3/17C529
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.18
    path: /usr/bin/javac
  Ruby:
    version: 3.2.2
    path: /Users/monilraycha/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 20.1.0
    wanted: 20.1.0
  react:
    installed: 19.2.3
    wanted: 19.2.3
  react-native:
    installed: 0.84.1
    wanted: 0.84.1
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: true

Steps to reproduce

   <Tab.Screen
    name="Home"
    component={Home}
    // options={{ tabBarImage: { systemName: 'house.fill' } }}
    options={{
      tabBarIcon: Platform.select({
        ios: {
          type: 'sfSymbol',
          name: 'house',
        },
        android: {
          type: 'materialSymbol',
          name: 'home',
          variant: 'filled',  // ← required
          weight: 400,
        },

        default:{
          type:'materialSymbol',
          name:'home',
          variant: 'filled',  // ← required
    weight: 400,
        }
      }),
    }}
  />

Reproducible sample code

<Tab.Screen
        name="Home"
        component={Home}
        // options={{ tabBarImage: { systemName: 'house.fill' } }}
        options={{
          tabBarIcon: Platform.select({
            ios: {
              type: 'sfSymbol',
              name: 'house',
            },
            android: {
              type: 'materialSymbol',
              name: 'home',
              variant: 'filled',  // ← required
              weight: 400,
            },

            default:{
              type:'materialSymbol',
              name:'home',
              variant: 'filled',  // ← required
        weight: 400,
            }
          }),
        }}
      />

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions