Home > Software design >  How to style my text widget dynamically in flutter
How to style my text widget dynamically in flutter

Time:08-01

I am new to flutter and I have an issue to change text style dynamically.

I fetch data from firestore database in map like this

Map data = {"amount": "", "type": ""}

Example data1

data = { "amount": "3000", "type": "income" }

Example data2

data = { "amount": "3000", "type": "expense" }

I want to print this data in text widget like

Text('$ : ${data['amount']', style: $data['type'])"

my style.dart

final textStyle income = TextStyle {
    color: Colors.blue,
    fontSize: 24,
}

final textStyle expense = TextStyle {
    color: Colors.red,
    fontSize: 24
}

Can anyone suggest how I can do that?

CodePudding user response:

You can do a condition check to change based on type like

Text('${data['ammount']}', style: data['type'] == "expense" ? TextStyle(fontSize: 20, color: Colors.red) : TextStyle(fontSize: 12, color: Colors.blue)),
  • Related