Recently i was able to dynamically load Material Design Icons in Flutter by using the flutter_icons/flutter_icons.dart
// First Approach
Icon icon = new Icon(Icons.settings);
// Second Approach
icon = new Icon(MaterialIcons.getIconData(Model.dynamic_icon_name);
This got me thinking if i could do something similar using a native android approach, with something like
// Glide Theoretical Example
Glide.with(context.getApplicationContext())
.asBitmap()
.load(MaterialIcons.getIconData(Model.dynamic_icon_name))
.apply(new RequestOptions().fitCenter())
.into(iconView);
I think it would be interesting to know, since i think could provide some advantage that a developer would not need to bundle those assets with the app
There was no effective way of handling this natively on Android, so the solution i ended up going with was having the server host these icons and i could just serve them down using Glide like this.
Step 1: Backend setup
thumbs_up
icon from this Material Icons linkLaravel
backend. In the end my icons resided in the path public/material-icons/thumb_up_black.png
and made sure to keep a consistent naming convention public/material-icons/{icon_name_color}.png
this was the vital point since i needed to reference these assets again.Server side
...
// Creating the item
new Item::create([
'name' => 'Like-able item',
'icon' => 'thumb_up_black',
]);
...
List items API endpoint result
[
{
"name": "Like-able item",
"icon_url": "https//server-name.fancy/thumb_up_black.png"
},
{
"name": "Like-able item #2",
"icon_url": "https//server-name.fancy/thumb_up_black.png"
},
....
]
Step 2: Client Setup (Android app)
Glide
to accomplish this.
ItemModel item = new ItemModel(itemDataFromServer);
Glide.with(context.getApplicationContext())
.asBitmap()
.load(MaterialIcons.getIconData(item.icon_url))
.apply(new RequestOptions().fitCenter())
.into(iconView);
This was finally how i was able to solve this problem, the nice thing with this implementation was that from our three client apps (Android, iOs and Web) we could use the same if not similar method to display accordingly.