Flutter Icons Call From Database - flutter

Question

I have icon-name in my database called (for example) "favorite", "people, "home", etc. The code :
Icon(Icons.favorite, size: 25)
How can I replace that to string? I have tried flutter_icons, material_design_icons_flutter, etc.
Icon(Icons.icon.name, size: 25) //icon.name is the method to call the string from API database
Hope you get what I was trying to explain.

Answer 1

You can copy paste run full code below
You can use getIconUsingPrefix of package https://pub.dev/packages/icons_helper and FutureBuilder
Demo code simulate retrieve DB dealy
Future<String> iconName() async {
await Future.delayed(Duration(seconds: 5), () {});
return Future.value("favorite");
}
...
FutureBuilder(
future: _future,
builder: (context, AsyncSnapshot<String> snapshot) {
switch (snapshot.connectionState) {
...
case ConnectionState.done:
if (snapshot.hasError) {
...
} else {
return Icon(getIconUsingPrefix(name: snapshot.data),
size: 25.0);
}
}
})
working demo
full code
import 'package:flutter/material.dart';
import 'package:icons_helper/icons_helper.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo + Icon Helper Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
Future<String> _future;
Future<String> iconName() async {
await Future.delayed(Duration(seconds: 5), () {});
return Future.value("favorite");
}
#override
void initState() {
_future = iconName();
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
FutureBuilder(
future: _future,
builder: (context, AsyncSnapshot<String> snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.none:
return Text('none');
case ConnectionState.waiting:
return Center(child: CircularProgressIndicator());
case ConnectionState.active:
return Text('');
case ConnectionState.done:
if (snapshot.hasError) {
return Text(
'${snapshot.error}',
style: TextStyle(color: Colors.red),
);
} else {
return Icon(getIconUsingPrefix(name: snapshot.data),
size: 25.0);
}
}
}),
],
),
),
);
}
}

Answer 2

you need to create a map with 'iconName' as key, and IconData as value. and after fetching iconName from db use it to get IconData;