I have this list of maps, and i need to get the 'transactions' value:
final assets = [
{
"name": "BRL", "balance": 150.2,
"transactions" : Transaction(from: "someone", amount: 1)
},
{
"name": "US", "balance": 1100.2,
"transactions" : Transaction(from: "someone", amount: 5)
},
];
i tried to do assets[0]['transactions'], but all i got was null or Instance of 'Transaction'
the class:
class Transaction {
final String id = Random().toString();
final String from;
final double amount;
Transaction({
required this.from,
required this.amount,
});
}
im kinda newbie, then pls help me :)
You can use this dartpad example to view this in an app
Assuming you would like to show your data in a list (since this is a list of maps per the question)
class MyWidget extends StatelessWidget {
#override
Widget build(BuildContext context) {
return ListView.builder(
shrinkWrap: true,
itemCount: assets.length,
itemBuilder: (context, index) {
Transaction data = assets[index]['transactions'];
return
ListTile(
leading: Text(data.amount.toString()),
title: Text(data.from.toString()));
});
}
}
Related
I'm Trying to apply BLoC pattern on my code which is simply generate categories to grid View , but some how it's not working although I did the same in this article but without using api instead I used local Json File.
here is the Category_Model
class CategoryModel {
List<_Category> _Categories = [];
CategoryModel.fromJson(Map<String, dynamic> parsedJson) {
print(parsedJson['Categories'].length);
List<_Category> temp = [];
for (int i = 0; i < parsedJson['Categories'].length; i++) {
//_Category is the constructor of _Category Class line number 21
_Category category = _Category(parsedJson['Categories'][i]);
temp.add(category);
}
_Categories = temp;
}
List<_Category> get categories => _Categories;
}
class _Category {
int _id;
String _name;
String _iconPath;
_Category(category) {
_id = category['id'];
_name = category['name'];
_iconPath = category['iconPath'];
}
int get id => _id;
String get name => _name;
String get iconPath => _iconPath;
}
and here where it's comming null
Future<CategoryModel> fetchCategoryList() async {
final jsonCategory = await rootBundle.loadString("assets/CategoryList.json");
final mapJsonCategory = Map.from(jsonDecode(jsonCategory));
return CategoryModel.fromJson(mapJsonCategory);
}
here is the Category_List.dart
import 'package:flutter/material.dart';
import '../blocs/category_bloc.dart';
import '../models/category_model.dart';
class CategoryList extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return CategoryListState();
}
}
class CategoryListState extends State<CategoryList> {
#override
void initState() {
super.initState();
bloc.fetchAllCategoryList();
}
#override
void dispose() {
bloc.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Mazaya'),
),
body: StreamBuilder(
stream: bloc.allCategories,
builder: (context, AsyncSnapshot<CategoryModel> snapshot) {
if (snapshot.hasData) {
return buildList(snapshot);
} else if (snapshot.hasError) {
return Text(snapshot.error.toString());
}
return Center(child: CircularProgressIndicator());
},
),
);
}
Widget buildList(AsyncSnapshot<CategoryModel> snapshot) {
return GridView.builder(
itemCount: snapshot.data.categories.length,
);
}
}
JSON FILE
{
"Categories": [
{
"id": 1,
"name": "Restruants",
"iconPath": " "
},
{
"id": 2,
"name": "Car Rental",
"iconPath": " "
},
{
"id": 3,
"name": "Furniture",
"iconPath": " "
},
{
"id": 4,
"name": "cars",
"iconPath": " "
},
{
"id": 5,
"name": "Maintenance",
"iconPath": " "
},
{
"id": 6,
"name": "Education",
"iconPath": " "
},
{
"id": 7
"name": "Finess",
"iconPath": " "
},
{
"id": 8,
"name": "Electronics",
"iconPath": " "
},
{
"id": 9,
"name": "Medical",
"iconPath": " "
},
{
"id": 10,
"name": "Entirtainment",
"iconPath": " "
}
]
}
I expected the result will lock like the app in this article https://medium.com/flutterpub/architecting-your-flutter-project-bd04e144a8f1
Hi First of all correct your json by adding comma after number 7 like this => "id": 7,
Then change fetchMovieList() method in MovieApiProvider as below where we get file from asset with the help of "DefaultAssetBundle":
Future<ItemModel> fetchMovieList(BuildContext context) async {
// final jsonCategory = await rootBundle.loadString("assets/CategoryList.json");
final jsonCategory = await DefaultAssetBundle
.of(context)
.loadString('assets/CategoryList.json');
print(jsonCategory);
final mapJsonCategory = Map<String, dynamic>.from(jsonDecode(jsonCategory));
print(mapJsonCategory);
return ItemModel.fromJson(mapJsonCategory);
}
Then declare your json file in pubspec.yaml as below:
# The following section is specific to Flutter.
flutter:
# The following line ensures that the Material Icons font is
# included with your application, so that you can use the icons in
# the material Icons class.
uses-material-design: true
assets:
- assets/CategoryList.json
Then change buildList method in your dart file as below:
Widget buildList(AsyncSnapshot<ItemModel> snapshot) {
return GridView.builder(
itemCount: snapshot.data.categories.length,
gridDelegate:
new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
itemBuilder: (BuildContext context, int index) {
return Text(snapshot.data.categories[index].name);
});
}
It will work :)
If you make a new Flutter project and include the dependencies and then replace your main.dart file you should be where I am on this question.
I left the original load: with Future.delayed but it doesn't seem to matter. I know partially what my problem is but am unable to come up with a better solution.
1) I don't seem to be using my snapshot.data and instead I am just making a empty List with str and then i just addAll into it and use that. So i'd love to not do that, i originally was using snapshot.data but ran into problems when I tried to "pull to load more data" which happens after you scroll to the bottom of the list.
The problem with my current method of doing this is that if you pull to load more users and then try to pull again before the users have loaded, The app breaks and doesn't wait for the data to properly load. I believe that I need to be doing that all in the load: of this library easy_refresh... but I am not sure how to rewrite my code to accomplish that.
How can I get my data to load with snapshot.data and then when I pull to refresh, I append 100 more users to that list but the UI waits for the list to update before it finishes the load. Would I be better off just putting a Blocking UI element and after the str list updates? and when new users are loaded I unblock the UI? which sorta feels hackish and not the correct way to solve this. The plugin itself should be able to do the loading and when its ready it stops the spinner under the list and says "finished".
pubspec.yaml
dependencies:
flutter:
sdk: flutter
flutter_easyrefresh: ^1.2.7
http: ^0.12.0+2
main.dart
import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:convert';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:http/http.dart' as http;
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
backgroundColor: Colors.white
),
home: DuelLeaderBoards(),
);
}
}
class DuelLeaderBoards extends StatefulWidget {
#override
_DuelLeaderBoardsState createState() => _DuelLeaderBoardsState();
}
class _DuelLeaderBoardsState extends State<DuelLeaderBoards> {
List<Entry> str = [];
GlobalKey<EasyRefreshState> _easyRefreshKey = new GlobalKey<EasyRefreshState>();
GlobalKey<RefreshHeaderState> _headerKey = new GlobalKey<RefreshHeaderState>();
GlobalKey<RefreshHeaderState> _connectorHeaderKey = new GlobalKey<RefreshHeaderState>();
GlobalKey<RefreshFooterState> _footerKey = new GlobalKey<RefreshFooterState>();
GlobalKey<RefreshFooterState> _connectorFooterKey = new GlobalKey<RefreshFooterState>();
Future<LeaderBoards> getLeaderBoards(start) async {
String apiURL = 'https://stats.quake.com/api/v2/Leaderboard?from=$start&board=duel&season=current';
final response = await http.get(apiURL);
if (response.statusCode == 200) {
final responseBody = leaderBoardsFromJson(response.body);
return responseBody;
} else {
throw Exception('Failed to load Data');
}
}
void updateLeaderBoardList(e) async {
setState(() {
str.addAll(e.entries);
});
}
#override
void initState() {
getLeaderBoards(0).then((onValue) => str = onValue.entries );
super.initState();
}
#override
Widget build(BuildContext context) {
Widget header = ClassicsHeader(
key: _headerKey,
refreshText: "pullToRefresh",
refreshReadyText: "releaseToRefresh",
refreshingText: "refreshing...",
refreshedText: "refreshed",
moreInfo: "updateAt",
bgColor: Colors.transparent,
textColor: Colors.white,
);
Widget footer = ClassicsFooter(
key: _footerKey,
loadHeight: 50.0,
loadText: "pushToLoad",
loadReadyText: "releaseToLoad",
loadingText: "loading",
loadedText: "loaded",
noMoreText: "Finished",
moreInfo: "updateAt",
bgColor: Colors.transparent,
textColor: Colors.white,
);
return FutureBuilder(
future: getLeaderBoards(0),
builder:
(BuildContext context, AsyncSnapshot<LeaderBoards> snapshot) {
if (!snapshot.hasData) {
return Center(
child: CircularProgressIndicator(),
);
} else {
return Builder(builder: (BuildContext context) {
return Center(
child: new EasyRefresh(
key: _easyRefreshKey,
behavior: ScrollOverBehavior(),
refreshHeader: ConnectorHeader(
key: _connectorHeaderKey,
header: header,
),
refreshFooter: ConnectorFooter(
key: _connectorFooterKey,
footer: footer,
),
child: CustomScrollView(
semanticChildCount: str.length,
slivers: <Widget>[
SliverList(
delegate: SliverChildListDelegate(<Widget>[header]),
),
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) {
return new Container(
height: 70.0,
child: Card(
child: new Text(
'${index+1}: ${str[index].userName}',
style: new TextStyle(fontSize: 18.0),
),
));
},
childCount: str.length,
)),
SliverList(
delegate: SliverChildListDelegate(<Widget>[footer]),
)
],
),
onRefresh: () async {
await new Future.delayed(const Duration(seconds: 0), () {
setState(() {});
});
},
loadMore: () async {
getLeaderBoards(str.length).then((onValue) => {
updateLeaderBoardList(onValue)
});
},
// loadMore: () async {
// await new Future.delayed(const Duration(seconds: 0), () {
// getLeaderBoards(str.length).then((onValue) => {
// updateLeaderBoardList(onValue)
// });
// });
// },
)
);
});
}
});
}
}
LeaderBoards leaderBoardsFromJson(String str) {
final jsonData = json.decode(str);
return LeaderBoards.fromJson(jsonData);
}
String leaderBoardsToJson(LeaderBoards data) {
final dyn = data.toJson();
return json.encode(dyn);
}
class LeaderBoards {
String boardType;
List<Entry> entries;
int totalEntries;
LeaderBoards({
this.boardType,
this.entries,
this.totalEntries,
});
factory LeaderBoards.fromJson(Map<String, dynamic> json) => new LeaderBoards(
boardType: json["boardType"] == null ? null : json["boardType"],
entries: json["entries"] == null ? null : new List<Entry>.from(json["entries"].map((x) => Entry.fromJson(x))),
totalEntries: json["totalEntries"] == null ? null : json["totalEntries"],
);
Map<String, dynamic> toJson() => {
"boardType": boardType == null ? null : boardType,
"entries": entries == null ? null : new List<dynamic>.from(entries.map((x) => x.toJson())),
"totalEntries": totalEntries == null ? null : totalEntries,
};
}
class Entry {
String userName;
int eloRating;
String profileIconId;
String namePlateId;
Entry({
this.userName,
this.eloRating,
this.profileIconId,
this.namePlateId,
});
factory Entry.fromJson(Map<String, dynamic> json) => new Entry(
userName: json["userName"] == null ? null : json["userName"],
eloRating: json["eloRating"] == null ? null : json["eloRating"],
profileIconId: json["profileIconId"] == null ? null : json["profileIconId"],
namePlateId: json["namePlateId"] == null ? null : json["namePlateId"],
);
Map<String, dynamic> toJson() => {
"userName": userName == null ? null : userName,
"eloRating": eloRating == null ? null : eloRating,
"profileIconId": profileIconId == null ? null : profileIconId,
"namePlateId": namePlateId == null ? null : namePlateId,
};
}
I looked at the documentation of loadMore. Since it says that the body of the function assigned to loadMore should be async, you do not need to use then:
loadMore: () async {
final result = await getLeaderBoards(str.length);
updateLeaderboardList(result);
},
loadMore: () async {
await getLeaderBoards(str.length).then((onValue) => {
updateLeaderboardList(onValue)
});
},
but putting "await" my loader waits for the function to complete before it finishes the animation.
I need to change application locale programmatically when button pressed
my code :
MaterialApp(
localizationsDelegates: [
_newLocaleDelegate,
const AppTranslationsDelegate(),
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
],
supportedLocales: [
const Locale('en', ''),
const Locale('ar', ''),
],
locale: mylocale,
title: appTitle,
home: Scaffold(
body: new MyCustomForm(),
),
debugShowCheckedModeBanner: false
);
new MaterialButton(
onPressed: () {
setState(() {
mylocale=Locale("ar","");
_newLocaleDelegate = AppTranslationsDelegate(newLocale:mylocale);
});
},
),
translation code :
AppTranslations.of(context).text("text")
AppTranslations Class:
class AppTranslations {
Locale locale;
static Map<dynamic, dynamic> _localisedValues;
AppTranslations(Locale locale) {
this.locale = locale;
_localisedValues = null;
}
static AppTranslations of(BuildContext context) {
return Localizations.of<AppTranslations>(context, AppTranslations);
}
static Future<AppTranslations> load(Locale locale) async {
AppTranslations appTranslations = AppTranslations(locale);
String jsonContent =
await rootBundle.loadString("assets/locale/localization_${locale.languageCode}.json");
_localisedValues = json.decode(jsonContent);
return appTranslations;
}
get currentLanguage => locale.languageCode;
String text(String key) {
print(key);
if(_localisedValues!=null)
return _localisedValues[key] ?? "$key";
else
return key;
}
}
my problem :
when Locale change page direction changed without translation ,
to get effect translation need to refresh page or go to another page and return back,
any help
Could you try wrapping your MaterialApp in an AnimatedSwitcher like so:
AnimatedSwitcher(
// Following two fields for your reference
// duration: const Duration(milliseconds: 500),
// transitionBuilder: (Widget child, Animation<double> animation) {
// return ScaleTransition(child: child, scale: animation);
// },
child: MaterialApp(
// As before, the same code, however:
key: ValueKey<Locale>(mylocale),
)
)
BTW, good practice to prefix private variables with an underscore, e.g. _myLocale.
I have a JSON app calling users but I am having problems dealing with null Maps.
This is the Json file.
MemberInfo.json
{
"Dependents": [
{
"Name": "Kim",
"Relationship": "Parent",
"Entitlements": {
"GP": {
"Entitlement": "10000",
"Utilisation": "500",
"Balance": "9500"
},
"OPS": {
"Entitlement": "10000",
"Utilisation": "500",
"Balance": "9500"
},
"IP": {
"Entitlement": "50000",
"Utilisation": "17000",
"Balance": "33000"
}
}
},
{
"Name": "Tim",
"Relationship": "Spouse",
"Entitlements": {
"GP": {
"Entitlement": "10000",
"Utilisation": "500",
"Balance": "9500"
},
"OPS": {
"Entitlement": "10000",
"Utilisation": "500",
"Balance": "9500"
},
"IP": {
}
}
}
]
}
And the dart file is as follows:
import 'package:flutter/material.dart';
import 'dart:convert';
import 'dart:async';
import 'package:http/http.dart' as http;
final String url = "http://crm.emastpa.com.my/MemberInfo.json";
final String url2 = "http://crm.emastpa.com.my/MemberInfo2.json";
class Dependents extends StatelessWidget {
Dependents({Key key, this.index, this.name, this.page}) : super(key:key);
final int index;
final String name;
final int page;
Future<String> jsonContent() async {
var res = await http.get(
Uri.encodeFull(url2),
headers: {"Accept": "application/json"});
return res.body;
}
#override
Widget build(BuildContext context) {
Widget fifthBody = new Container(
child: new Center(
child: new FutureBuilder<String>(
future: jsonContent(),
builder: (context, snapshot){
if(snapshot.hasData){
List<Widget> widgets = [];
//get snapshot data from JSON tree
var jsondecode = json.decode(snapshot.data);
//[]->Entitlements
var jsonEntData = jsondecode["Dependents"][index]["Entitlements"];
//Everything under Entitlements
var jsonEntDataGP = jsonEntData["GP"];
var jsonEntDataOPS = jsonEntData["OPS"];
var jsonEntDataIP = jsonEntData["IP"];
//GP Branch
var gp_ent = jsonEntDataGP["Entitlement"];
var gp_util = jsonEntDataGP["Utilisation"];
var gp_bal = jsonEntDataGP["Balance"];
//OPS branch
var ops_ent = jsonEntDataOPS["Entitlement"];
var ops_util = jsonEntDataOPS["Utilisation"];
var ops_bal = jsonEntDataOPS["Balance"];
//IP branch
var ip_ent = jsonEntDataIP["Entitlement"];
var ip_util = jsonEntDataIP["Utilisation"];
var ip_bal = jsonEntDataIP["Balance"];
jsonEntDataGP != null?
widgets.add(new ExpansionTile(
title: new Text("GP"),
children: <Widget>[
new ListTile(
title: new Text("Entitlement"),
trailing: new Text(gp_ent),
)
],
))
: new Center();
jsonEntDataOPS != null?
widgets.add(new ExpansionTile(
title: new Text("OPS"),
children: <Widget>[
new ListTile(
title: new Text("Entitlement"),
trailing: new Text(ops_ent),
)
]))
: new Center();
jsonEntDataIP != null?
widgets.add(new ExpansionTile(
title: new Text("IP"),
children: <Widget>[
new ListTile(
title: new Text("Entitlement"),
trailing: new Text(ip_ent),
)
]))
: new Center();
return new Column(
children: widgets,
);
}else if(snapshot.hasError){
return new Text(snapshot.error);
}
//loading the page
return new Center(
child: new CircularProgressIndicator(),
);
}),
),
);
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("$name + index: $index"),
),
body: fifthBody
),
);
}
}
This is the error I am getting:
I/flutter ( 8842): The following assertion was thrown building FutureBuilder<String>(dirty, state:
I/flutter ( 8842): _FutureBuilderState<String>#f9262):
I/flutter ( 8842): 'package:flutter/src/widgets/text.dart': Failed assertion: line 230 pos 15: 'data != null': is not
I/flutter ( 8842): true.
I am trying to build a list of the user's entitlements but I am not so sure as to how to deal with a null key such as "IP". The app works as long as the key has values inside but will return the exception if the key is null.
How should I deal with this problem?
IP is empty JsonObject
"IP": {},
So when you try to access data of IP object it returns null & passing that to textview later gives data is null error.
You are trying to get data from json object without keys as
var ip_ent = jsonEntDataIP["Entitlement"];
And using later as
new Text(ip_ent)
To overcome this you need to assign default value in case of variable is null or can hide that view as your requirement.
To assign default value in case of null, please do this.
var ip_ent = jsonEntDataIP["Entitlement"] ?? '';
var jsonEntDataIP = jsonEntData["IP"] ?? '';
I've following Json stored inside Assets/JSON/example.json
[
{"optiontext" : "One", "optionvalue" : "One"},
{"optiontext" : "Two", "optionvalue" : "Two"},
{"optiontext" : "Three", "optionvalue" : "Three"}
]
I want to read JSON from this file & convert it to MyObject.
Have to use it in Flutter App
Here is sample code snippet for your case. Basically, we can use dartson package for converting.
import 'package:dartson/dartson.dart';
void main(List<String> args) {
String jsonString = '[{"optiontext" : "One", "optionvalue" : "One"},{"optiontext" : "Two", "optionvalue" : "Two"},{"optiontext" : "Three", "optionvalue" : "Three"}]';
var dson = new Dartson.JSON();
List<MyObject> result = dson.decode(jsonString, new MyObject(), true);
print(result[1].optionValue);
}
#Entity()
class MyObject {
#Property(name:"optiontext")
String optionText;
#Property(name:"optionvalue")
String optionValue;
}
As you can't use dartson in flutter due to some issue, the below code snippet can be used with the help of dart:convert
import 'dart:convert';
void main(List<String> args) {
String jsonString = '[{"optiontext" : "One", "optionvalue" : "Value"},{"optiontext" : "Two", "optionvalue" : "Two"},{"optiontext" : "Three", "optionvalue" : "Three"}]';
List<Map> parsedJson = JSON.decode(jsonString);
List<MyObject> result = parsedJson.map((item) => new MyObject.fromJson(item)).toList();
print(result[0].optionText);
print(result[0].optionValue);
}
class MyObject {
String optionText;
String optionValue;
MyObject.fromJson(Map jsonMap)
: optionText = jsonMap['optiontext'],
optionValue = jsonMap['optionvalue'];
}
Here is my solution
I have the following json
[
{
"name": "Abhijit Sawant",
"age": "23",
"height":"180",
"gender": "male",
"hair_color": "black"
},
{
"name": "Akku Sawant",
"age": "23",
"height":"150",
"gender": "male",
"hair_color": "brown"
},
{
"name": "Pikki Sawant",
"age": "23",
"height":"120",
"gender": "male",
"hair_color": "grey"
},
{
"name": "Chikki Sawant",
"age": "23",
"height":"100",
"gender": "female",
"hair_color": "white"
}
]
Following is my Flutter Code
class HomePage extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return HomePageState();
}
}
class HomePageState extends State<HomePage>{
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Loading Json"),),
body: Container(
child: Center(
child: FutureBuilder(builder: (context,snapshot){
var myData = json.decode(snapshot.data.toString());
return new ListView.builder(
itemCount: myData == null ? 0: myData.length,
itemBuilder: (BuildContext context,int index){
return Card(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Text("Name: "+myData[index]["name"]),
Text("Age: "+myData[index]["age"]),
Text("Height: "+myData[index]["height"]),
Text("Gender: "+myData[index]["gender"]),
],
),
);
},);
},
future: DefaultAssetBundle.of(context).loadString("person.json"),),
),
),
);
}
}