Develop Reference

Flutter setState() not updating the view after Invoking Flutter Code From Native Side

I am trying to implement invoking Flutter Code From Native Side using method channel and working as expected. But having issue with rendering the view after trying to set the state. Can any one help to fix the issue?
Actually the SimSlotInfo is calling from the below widget,
List<Step> getSteps() {
return <Step>[
Step(
state: currentStep > 0 ? StepState.complete : StepState.indexed,
isActive: currentStep >= 0,
title: const Text("Send SMS"),
content: Column(
children: [
SimSlotInfo()
],
),
),
];
}
SimSlotInfo dart class
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutterdemo/model/device_slot.dart';
class SimSlotInfo extends StatefulWidget {
//callback function
final void Function(String) callBackFunction;
const SimSlotInfo(this.callBackFunction, {super.key});
//const SimSlotInfo({Key? key}) : super(key: key);
#override
State<SimSlotInfo> createState() => _SimSlotInfoState();
}
class _SimSlotInfoState extends State<SimSlotInfo> {
final platformMethodChannel = const MethodChannel('common_lib_plugin');
List<SimDetails> simDetailsObj = [];
//execute the below code while page loading
#override
void initState() {
super.initState();
platformMethodChannel.setMethodCallHandler(handleNativeMethodCall);
}
Future<void> handleNativeMethodCall(MethodCall call) async {
// do some processing
switch(call.method) {
case "deviceInfo":
var simData = call.arguments;
var arrayObjsText = '[{"slot":0,"simno":"89911017061","deviceid":"3518920","carrierName":"Vodafone"},{"slot":1,"simno":"89101706","deviceid":"3511643","carrierName":"JIO"}]';
List simObjsJson = jsonDecode(arrayObjsText) as List;
simDetailsObj = simObjsJson.map((tagJson) => SimDetails.fromJson(tagJson)).toList();
setState(() {
simDetailsObj = simDetailsObj;
});
}
}
#override
Widget build(BuildContext context) {
return Column(
children:
simDetailsObj.map((data) => RadioListTile(
dense: true,
contentPadding: EdgeInsets.zero,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"${data.carrierName}",
style: const TextStyle(color: Colors.black, fontSize: 18),
),
],
),
groupValue: _selectedSim,
value: data.simno,
onChanged: (val) {
},
)).toList()
);
}
}

First, you are trying to assign List to List so your code is getting brake there. to solve that loop the object with SimDetails object. and that will do the trick
ParentWidget
class _ParentWidgetState extends State<ParentWidget> {
#override
Widget build(BuildContext context) {
return ChildWidget( // <---- child widget
callSetState: (list) { // <--- callback Function
print(list);
setState(() {
// <---
});
},
);
}
}
In Child widget
class ChildWidget extends StatefulWidget {
const ChildWidget({Key? key, required this.callSetState}) : super(key: key);
final Function(List<SimDetails>) callSetState; // <-- declare callback function here
#override
State<ChildWidget> createState() => _ChildWidgetState();
}
and replace your setState with widget.callSetState
Future<void> handleNativeMethodCall(MethodCall methodCall) async {
switch (call.method) {
case 'deviceInfo':
var simData = call.arguments;
var arrayObjsText =
'[{"slot":0,"simno":"89911017061","deviceid":"3518920","carrierName":"Vodafone"},{"slot":1,"simno":"89101706","deviceid":"3511643","carrierName":"JIO"}]';
for (var data in jsonDecode(arrayObjsText)) {
simDetailsObj.add(
SimDetails(
slot: data['slot'],
simno: data['simno'],
deviceid: data['deviceid'],
carrierName: data['carrierName'],
),
);
}
/// setState(() {});
widget.callSetState(simDetailsObj);
break;
default:
}}

how to get and update Rangeslider values from database?

I want to update the RangeSlider values from the database. but I don't know how to do this please help to show and update the RangeSlider values from the database. I have two values from the database for RangeSlider to start and end which i set in getData() data but when I initialize the values in Rnageslider it gives me the error The argument type 'RangeValues?' can't be assigned to the parameter type 'RangeValues'. and also in RangeLabels(_currentRangeValues.start.round().toString(),_currentRangeValues.end.round().toString(),)
In RangeLabels it gives me an error:- The property 'start' can't be unconditionally accessed because the receiver can be 'null'. Try making the access conditional (using '?.') or adding a null check to the target ('!'). and same for end
values:- _currentRangeValues = RangeValues(data[0]['age1'], data[0]['age2']);
values which comes from databse:- 20 60 in getDData() function
here is my code:-
class Age extends StatefulWidget {
Age({Key? key}) : super(key: key);
#override
_Age createState() => _Age();
}
class _Age extends State<Age >{
var UsrID = Auth.prefs?.getString('usrid');
var data;
RangeValues? _currentRangeValues;
#override
void initState() {
super.initState();
getData();
}
getData() async{
var res = await http.get(Uri.https('www.*******.com',
'/index.php',{'act':'profile','UsrID': '${UsrID}'}));
data = jsonDecode(res.body);
print(data);
_currentRangeValues = RangeValues(data[0]['age1'], data[0]['age2']);
setState(() {});
print(res.body);
}
//RangeValues _currentRangeValues = RangeValues(30, 70);
#override
Widget build(BuildContext context){
return Scaffold(
Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Age',
style: TextStyle(
color: Color(0xff2c3531),
),
),
addVerticalSpace(10),
RangeSlider(
activeColor: Color(0xff8f9df2),
inactiveColor: Color(0xff9a9a9a),
values: _currentRangeValues!,
max: 100,
divisions: 5,
labels: RangeLabels(
_currentRangeValues!.start.round().toString(),
_currentRangeValues!.end.round().toString(),
),
onChanged: (RangeValues? values) {
setState(() {
_currentRangeValues = values;
});
},
),
],
),
)
}
Anyone, please help how to initialize dynamic data in `RangeValues
Here is error in RangeSlider() widget :-

You have to use Nullable types to avoid this issue.
change RangeValue to RangeValue?.
and you have to use ! at _currentRangeValue!.start.round().toString()
you can find more info on null safety Here

Flutter The method 'map' was called on null. Receiver: null error

I'm having this super annoying issue of being unable to grab and display a table from my server hosted on PhpmyAdmin. (I've managed to grab the data and have it printed in the console, but now that I'm trying to display it in a table I can't seem to get it working)
I've tried nulling my variables but I'm not really sure what the main culprit for this error is. Any help would be greatly appreciated.
Image of Error
data.dart File
class dataListing extends StatefulWidget {
const dataListing({Key? key}) : super(key: key);
#override
State<dataListing> createState() => _dataListingState();
}
class _dataListingState extends State<dataListing> {
#override
Widget build(BuildContext context) {
return Container();
}
}
class listingData{
String? ListingID, listingName, listingDescription, address, suburbName, phoneNumber, openingHours, Email, Website;
listingData({
this.ListingID,
this.listingName,
this.listingDescription,
this.address,
this.suburbName,
this.phoneNumber,
this.openingHours,
this.Email,
this.Website,
});
//constructor
List<listingData> datalist = [];
factory listingData.fromJSON(Map<String, dynamic> json){
return listingData(
ListingID: json["ListingID"],
listingName: json["listingName"],
listingDescription: json["listingDescription"],
address: json["address"],
suburbName: json["suburbName"],
phoneNumber: json["phoneNumber"],
openingHours: json["openingHours"],
Email: json["Email"],
Website: json["Website"],
);
}
}
Directory.dart file
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:app/pages/data.dart';
class directoryPage extends StatefulWidget {
#override
State<directoryPage> createState() => _directoryPageState();
}
class _directoryPageState extends State<directoryPage> {
// List serviceListing = [];
//
// getAllListing()async{
// String url = "URL HERE";
// var response = await http.get(Uri.parse(url));
// if (response.statusCode == 200){
// setState (() {
// serviceListing = json.decode(response.body);
// });
// print (serviceListing);
// return serviceListing;
// }
// }
bool error = false, dataloaded = false;
var data;
String dataurl = "URL HERE";
#override
void initState (){
loaddata();
super.initState();
// getAllListing();
}
void loaddata() {
Future.delayed(Duration.zero,() async {
var res = await http.post(Uri.parse(dataurl));
if (res.statusCode == 200) {
setState(() {
data = json.decode(res.body);
dataloaded = true;
});
}
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Directory'),
centerTitle: true,
elevation: 0,
backgroundColor: Color(0xFFA30B32),
//WSU Appbar Icon
leading: Padding(
padding: const EdgeInsets.all(8.0),
child: Image.asset("assets/wsulogo.png", scale: 8.0),
),
),
body: Container(
padding: EdgeInsets.all(15),
child:dataloaded?datalist():
Center(
child:CircularProgressIndicator()
),
)
);
}
Widget datalist(){
if(data["error"]) {
return Text(data["errmsg"]);
}else{
List<listingData> datalist = List<listingData>.from(data["data"].map((i){
return listingData.fromJSON(i);
})
);
return Table( //if data is loaded then show table
border: TableBorder.all(width:1, color:Colors.black45),
children: datalist.map((listingdata){
return TableRow( //return table row in every loop
children: [
//table cells inside table row
TableCell(child: Padding(
padding: EdgeInsets.all(5),
child:Text(listingdata.ListingID!)
)
),
TableCell(child: Padding(
padding: EdgeInsets.all(5),
child:Text(listingdata.listingName!)
)
),
TableCell(child: Padding(
padding: EdgeInsets.all(5),
child:Text(listingdata.listingDescription!)
)
),
TableCell(child: Padding(
padding: EdgeInsets.all(5),
child:Text(listingdata.address!)
)
),
]
);
}).toList(),
);
}
}
}

Looks like the issue was actually unrelated to the dart side of things, the php code wasn't properly structuring the data. Cannot have underscores or spaces.
Correct-> $json["dballlisting"] = array (); (I renamed it to just "data" later)
Incorrect->$json["db_all_listing"] = array ();

The error seems to be originating from this line, the data['data'] is null which is expected to be an Array.
List<listingData> datalist = List<listingData>.from(data["data"].map((i){
return listingData.fromJSON(i);
})
You need to investigate your API call to make sure why it is happening. If the null value is expected then you need to add safeguards in your code to make sure it won't break when it encounter such scenarios. You can add null safety checks for that one way to do it would be to
List<listingData> datalist = List<listingData>.from((data["data"] ?? []).map((i){
return listingData.fromJSON(i);
})

How to run a function and get a value and add it in text in Flutter

I have written the following code below in Flutter
import 'dart:ui';
import 'package:flutter/material.dart';
import 'dart:io';
import 'package:geolocator/geolocator.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
void main() => runApp(Myapp());
class Myapp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Hello World'),
centerTitle: true,
backgroundColor: Colors.blueAccent,
),
body: Center(child: MyStatefulWidget(),
),
)
);
}
}
class Weather extends StatefulWidget {
UpdateTextState createState() => UpdateTextState();
}
class UpdateTextState extends State {
// var textHolder = 'Getting';
weath() async {
Position position = await Geolocator().getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
print(position.latitude);
print(position.longitude);
var url = 'https://api.openweathermap.org/data/2.5/weather?lat=${position.latitude}&lon=${position.longitude}&appid=myapiid';
print(url);
var response = await http.get(url);
var dart = json.decode(response.body);
var dartt = dart['main'];
var climate = dartt['temp'];
var weather = climate - 32 * 5/9;
// print('Response status: ${response.statusCode}');
// print('Response body: ${json.decode(response.body)}');
// print(dart['main']);
// print(dartt['temp']);
var textHolder = '${weather.toString()}C';
return textHolder;
}
#override
Widget build(BuildContext context) {
var c = weath();
//print(textHolder);
//changeText();
return Scaffold(
body: Center(child: Column(
children: <Widget>[
Container(
padding: EdgeInsets.fromLTRB(20, 20, 20, 20),
child: Text(c),
),
]))
);
}
}
if I run this program this is the output I am getting Please refer to This image actually I want the weather that I get from the API which is text holder variable please Help me guys I have even tried without return statement too also I have tried adding the function directly which also didn't work out well basically is there any alternate way or did I make any mistake in the code

It's a Future so you can call it in your initState and use setState to update the c variable. or you can use FutureBuilder.
class Weather extends StatefulWidget {
UpdateTextState createState() => UpdateTextState();
}
class UpdateTextState extends State {
var c = 'Getting';
weath() async {
Position position = await Geolocator().getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
print(position.latitude);
print(position.longitude);
var url = 'https://api.openweathermap.org/data/2.5/weather?lat=${position.latitude}&lon=${position.longitude}&appid=myapiid';
print(url);
var response = await http.get(url);
var dart = json.decode(response.body);
var dartt = dart['main'];
var climate = dartt['temp'];
var weather = climate - 32 * 5/9;
// print('Response status: ${response.statusCode}');
// print('Response body: ${json.decode(response.body)}');
// print(dart['main']);
// print(dartt['temp']);
var textHolder = '${weather.toString()}C';
setState(() {
c = textHolder;
});
}
#override
void initState() {
super.initState();
weath();
}
#override
Widget build(BuildContext context) {
var c = weath();
//print(textHolder);
//changeText();
return Scaffold(
body: Center(child: Column(
children: <Widget>[
Container(
padding: EdgeInsets.fromLTRB(20, 20, 20, 20),
child: Text(c),
),
]))
);
}
}

Just use setState((){}). Don't use return weath(), because async is a background thread and textView need UI.
var c = "";
#override
void initState() {
super.initState();
weath()
}
weath() async {
Position position = await Geolocator().getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
var url = 'https://api.openweathermap.org/data/2.5/weather?lat=${position.latitude}&lon=${position.longitude}&appid=myapiid';
print(url);
var response = await http.get(url);
var dart = json.decode(response.body);
var dartt = dart['main'];
var climate = dartt['temp'];
var weather = climate - 32 * 5/9;
setState(() {
c = '${weather}C'; } );
}

Add Future as return type, as you are returning the value inside async function
Future<String> weath() async {
Modify the Build method like
Widget build(BuildContext context) {
return FutureBuilder(
future: weath(),
builder: (ctx, snapshot) {
return Scaffold(
body: Center(
child: Column(children: <Widget>[
Container(
padding: EdgeInsets.fromLTRB(20, 20, 20, 20),
child: Text(snapshot.data.toString()),
),
])));
});
}

Arguments error while trying to load a widget

I'm configuring sqflite into my app so that I can be able to perform crud operations. I've been working on this for days.
Everything seems fine but when I try to load a widget in routes so that I can try to experiment crud operations I keep getting errors relating to arguments when calling a widget class.
This may be a simple problem but because I'm new to flutter and dart I failing to figure this out.
Below is the main.dart file.
import 'package:flutter/material.dart';
import 'home.dart';
import 'package:com.example.simple_app/pages/create_account/create_account_page.dart';
import 'package:com.example.simple_app/pages/add_person/add_person.dart';
import 'package:com.example.simple_app/models/user.dart';
void main() => runApp(SimpleApp());
final routes = {
'/': (BuildContext context) => new CreateAccountPage(),
class SimpleApp extends StatefulWidget {
#override
_SimpleAppState createState() => _SimpleAppState();
}
class _SimpleAppState extends State<SimpleApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Simple App',
theme: ThemeData(
primarySwatch: Colors.blueGrey,
),
initialRoute: '/',
routes: routes,
);
}
}
Below is the create_account_page.dart file
import 'package:flutter/material.dart';
import 'package:com.example.money_lender_app/models/user.dart';
class CreateAccountPage extends StatefulWidget {
final User user;
CreateAccountPage(this.user);
#override
CreateAccountPageState createState() => CreateAccountPageState(this.user);
}
//class controller
class CreateAccountPageState extends State<CreateAccountPage> {
User user;
CreateAccountPageState(this.user);
TextEditingController nameController = TextEditingController();
#override
Widget build(BuildContext context) {
//kondisi
if (user != null) {
nameController.text = user.name;
}
//rubah
return Scaffold(
appBar: AppBar(
title: user == null ? Text('Tambah') : Text('Rubah'),
leading: Icon(Icons.keyboard_arrow_left),
),
body: Padding(
padding: EdgeInsets.only(top: 15.0, left:10.0, right:10.0),
child: ListView(
children: <Widget> [
// nama
Padding (
padding: EdgeInsets.only(top:20.0, bottom:20.0),
child: TextField(
controller: nameController,
keyboardType: TextInputType.text,
decoration: InputDecoration(
labelText: 'Nama Lengkap',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
onChanged: (value) {
//
},
),
),
// tombol button
Padding (
padding: EdgeInsets.only(top:20.0, bottom:20.0),
child: Row(
children: <Widget> [
// tombol simpan
Expanded(
child: RaisedButton(
color: Theme.of(context).primaryColorDark,
textColor: Theme.of(context).primaryColorLight,
child: Text(
'Save',
textScaleFactor: 1.5,
),
onPressed: () {
// current datetime
var currentDate = new DateTime.now();
if (user == null) {
// tambah data
user = User(nameController.text, currentDate, currentDate);
} else {
// ubah data
user.name = nameController.text;
user.created_at = currentDate;
user.updated_at = currentDate;
}
// kembali ke layar sebelumnya dengan membawa objek user
Navigator.pop(context, user);
},
),
),
Container(width: 5.0,),
// tombol batal
Expanded(
child: RaisedButton(
color: Theme.of(context).primaryColorDark,
textColor: Theme.of(context).primaryColorLight,
child: Text(
'Cancel',
textScaleFactor: 1.5,
),
onPressed: () {
Navigator.pop(context);
},
),
),
],
),
),
],
),
)
);
}
}
below is the db_helper.dart file.
import 'package:sqflite/sqflite.dart';
import 'dart:async';
//mendukug pemrograman asinkron
import 'dart:io';
//bekerja pada file dan directory
import 'package:path_provider/path_provider.dart';
import 'package:com.example.simple_app/models/user.dart';
//pubspec.yml
class DbHelper {
static DbHelper _dbHelper;
static Database _database;
DbHelper._createObject();
factory DbHelper() {
if (_dbHelper == null) {
_dbHelper = DbHelper._createObject();
}
return _dbHelper;
}
Future<Database> initDb() async {
Directory directory = await getApplicationDocumentsDirectory();
String path = directory.path + 'simpleapp.db';
//create, read databases
var todoDatabase = openDatabase(path, version: 1, onCreate: _createDb);
return todoDatabase;
}
void _createDb(Database db, int version) async {
await db.execute('''
CREATE TABLE user (
id INTEGER PRIMARY KEY AUTOINCREMENT,
name TEXT,
created_at DATETIME,
updated_at DATETIME
)
''');
}
Future<Database> get database async {
if (_database == null) {
_database = await initDb();
}
return _database;
}
Future<List<Map<String, dynamic>>> select() async {
Database db = await this.database;
var mapList = await db.query('user', orderBy: 'name');
return mapList;
}
//create databases
Future<int> insert(User object) async {
Database db = await this.database;
int count = await db.insert('user', object.toMap());
return count;
}
//update databases
Future<int> update(User object) async {
Database db = await this.database;
int count = await db.update('user', object.toMap(),
where: 'id=?',
whereArgs: [object.id]);
return count;
}
//delete databases
Future<int> delete(int id) async {
Database db = await this.database;
int count = await db.delete('user',
where: 'id=?',
whereArgs: [id]);
return count;
}
Future<List<User>> getUserList() async {
var userMapList = await select();
int count = userMapList.length;
List<User> userList = List<User>();
for (int i=0; i<count; i++) {
userList.add(User.fromMap(userMapList[i]));
}
return userList;
}
}
Below is the user.dart file. It is in the model folder.
class User {
int _id;
String _name;
String _username;
DateTime _created_at;
DateTime _updated_at;
// konstruktor versi 1
User(this._name, this._created_at, this._updated_at);
// konstruktor versi 2: konversi dari Map ke User
User.fromMap(Map<String, dynamic> map) {
this._id = map['id'];
this._name = map['name'];
this._created_at = map['created_at'];
this._updated_at = map['updated_at'];
}
// getter
int get id => _id;
String get name => _name;
DateTime get created_at => _created_at;
DateTime get updated_at => _updated_at;
// setter
set name(String value) {
_name = value;
}
set created_at(DateTime value) {
_created_at = value;
}
set updated_at(DateTime value) {
_updated_at = value;
}
Map<String, dynamic> toMap() {
Map<String, dynamic> map = Map<String, dynamic>();
map['id'] = this._id;
map['name'] = name;
map['created_at'] = created_at;
map['updated_at'] = updated_at;
return map;
}
}
The pubspec.yaml file has the following dependencies.
cupertino_icons: ^0.1.2
flutter_launcher_icons: ^0.7.4
sqflite: any
path_provider: ^1.5.1
The error log I'm getting in the debug console is this:
lib/main.dart:11:55: Error: Too few positional arguments: 1 required, 0 given.
'/': (BuildContext context) => new CreateAccountPage(),
^
lib/pages/create_account/create_account_page.dart:5:7: Context: Found this candidate, but the arguments don't match.
CreateAccountPage(this.user);
^^^^^^^^^^^^^^^^^
lib/main.dart:16:69: Error: Too few positional arguments: 1 required, 0 given.
'/create_account': (BuildContext context) => new CreateAccountPage(),
^
lib/pages/create_account/create_account_page.dart:5:7: Context: Found this candidate, but the arguments don't match.
CreateAccountPage(this.user);
^^^^^^^^^^^^^^^^^
I very much need to be able to pass the right argument inside the CreateAccountPage().
I'm expecting this code to work without any argument errors. Thank you!

The error says you are missing an argument when you are calling CreateAccountPage().
Its constructor is CreateAccountPage(this.user), so you need either provide a User object when you're creating the account page, or remove the parameter from the constructor.