I am new to flutter and I am trying to call api data in listview builder inside future builder. But I am getting null data in snapshot.
My code is below:
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:shared_preferences/shared_preferences.dart';
String token;
SharedPreferences sharedPreferences;
class ContinueW extends StatefulWidget {
#override
_ContinueWState createState() => _ContinueWState();
}
class _ContinueWState extends State<ContinueW> {
Future getTokenValue() async {
SharedPreferences espf = await SharedPreferences.getInstance();
token = espf.getString('tokenvalue');
return token;
}
Future createUser() async {
String url ='http://3.137.182.252:8000/continue-watching';
print('token');
Map<String, String> headers = {
'token': token,
};
await http.get(url, headers: headers).then((response){
print('Entered');
//print(response.body);
var jre= jsonDecode(response.body);
return jre;
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: FutureBuilder(
future: getTokenValue(),
builder: (BuildContext context,snapshot){
if(snapshot.hasData){
return cbuild();
} else{
return CircularProgressIndicator();
}
},
),
),
);
}
Widget cbuild(){
return new FutureBuilder(
future: createUser(),
builder: (BuildContext context,snapshot) {
if(snapshot.hasData) {
return ListView.builder(
itemBuilder: (context, index) {
return ListTile(
leading: CircleAvatar(
backgroundImage: snapshot.data['thumburl'] != null
? NetworkImage(snapshot.data['thumburl'])
: Container(),),
title: Text(snapshot.data[index]['name']),
subtitle: Text(snapshot.data[index]['description']),
);
},
);
}
else{
return CircularProgressIndicator();
}
}
);
}
}
ListTile(
leading: CircleAvatar(
backgroundImage: snapshot.data[index]['thumburl'] != null
? NetworkImage(snapshot.data[index]['thumburl'])
: Container(),),
title: Text(snapshot.data[index]['name']),
subtitle: Text(snapshot.data[index]['description']),
);
as according to details provided by you. you may be missing [index]with ['thumburl'],
if it's still not working then you need to provide JSON formated data
Related
I am trying to get a Future into a listview using the Provider package, but have been unsuccessful. Can anyone give me some advice or a link that explains how to implement notifylisteners() on a Future that returns a double?
Here is the Future of getPrice():
import 'dart:collection';
import 'package:http/http.dart' as http;
import 'package:flutter/material.dart';
import 'package:stock_watchlist/stock_service.dart';
class StockData extends ChangeNotifier {
List<Stock> _stocks = [
Stock(symbol: 'AAPL'),
Stock(symbol: 'AMD'),
Stock(symbol: 'TSLA')
];
UnmodifiableListView<Stock> get stocks {
return UnmodifiableListView(_stocks);
}
int get stockCount {
return _stocks.length;
}
void addStock(String symbol, double price, double eps) {
final stock = Stock(symbol: symbol);
_stocks.add(stock);
notifyListeners();
}
void deleteStock(Stock stock) {
_stocks.remove(stock);
notifyListeners();
}
Future<double> getPrice(String symbol) async {
String url =
"https://sandbox.iexapis.com/stable/stock/$symbol/quote/latestPrice?token=Tsk_38ddda0b877a4510b42a37ae713cdc96";
http.Response response = await http.get(url);
double price = double.tryParse(response.body);
return price;
}
Future<double> getEps(String symbol) async {
String url =
"https://sandbox.iexapis.com/stable/stock/$symbol/stats/ttmEPS?token=Tsk_38ddda0b877a4510b42a37ae713cdc96";
http.Response response = await http.get(url);
double eps = double.tryParse(response.body);
return eps;
}
}
Here is where I am trying to input the value of getPrice() into a text widget but it is giving me "Instance of 'Future' instead of the value.
I cannot embed pictures yet
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:stock_watchlist/constants.dart';
import 'package:stock_watchlist/stock_model.dart';
class StockList extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Consumer<StockData>(
builder: (context, stockData, child) {
return ListView.builder(
itemCount: stockData.stockCount,
itemBuilder: (context, index) {
//
final stockIndex = stockData.stocks[index];
//
return ListTile(
title: Text(
stockIndex.symbol,
style: TextStyle(
color: kTextColor,
),
),
subtitle: Text(
stockIndex.price.toString(),
style: TextStyle(
color: kTextColor,
),
),
);
},
);
},
);
}
}
Thank you, I think I figured it out with FutureBuilder. Here is the code I used.
class StockList extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Consumer<StockData>(
builder: (context, stockData, child) {
return ListView.builder(
itemCount: stockData.stockCount,
itemBuilder: (context, index) {
//
final stockIndex = stockData.stocks[index];
//
return ListTile(
title: Text(
stockIndex.symbol,
style: TextStyle(
color: kTextColor,
),
),
subtitle: FutureBuilder(
future: stockData.getPrice(stockIndex.symbol),
builder: (context, snapshot) => Text(
snapshot.data.toString(),
style: TextStyle(
color: kTextColor,
),
),
),
);
},
);
},
);
}
}
I am trying to convert image(url format) from Api into BASE64 string but i don't know how to do it.Api response look like this
{
"albumId": 1,
"title": "accusamus beatae ad facilis cum similique qui sunt",
"url": "https://via.placeholder.com/600/92c952",
},
i tried like this
import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:convert';
import 'package:http/http.dart' as http;
Future<List> getJson() async {
String apiUrl = 'https://jsonplaceholder.typicode.com/photos';
http.Response response = await http
.get(apiUrl);
return json.decode(response.body);
}
void main() async {
List _data = await getJson();
String _body = "${_data[0]['url']}";
String data = base64.encode(_body.bodyBytes); Error here ..The getter 'bodyBytes' isn't defined for the class 'String'.
print("$data");
runApp(
new MaterialApp(
home: new Scaffold(
appBar: new AppBar(
title: new Text('Json parse'),
centerTitle: true,
backgroundColor: Colors.orangeAccent,
),
body: new Center(
child: new Text("khan ${_data[0]['url']}"),
),
),
),
);
}
i know i am doing it wrong, i am new to flutter. it will be great if someone also tell me how to show that string to image again.
Note : I am storing that image string for Ecommerece cart purpose.
You can copy paste run full code below
Step 1: You can parse json string with
Future<List<Payload>> getJson() async {
String apiUrl = 'https://jsonplaceholder.typicode.com/photos';
http.Response response = await http.get(apiUrl);
return payloadFromJson(response.body);
}
Step 2: get base64 string
payloadList = await getJson();
http.Response imageResponse = await http.get(
payloadList[0].url,
);
base64String = base64.encode(imageResponse.bodyBytes);
Step 3: show image with
base64String == null
? Container()
: Image.memory(base64Decode(base64String)),
payloadList == null
? Container()
: Image.network(payloadList[0].url),
working demo
full code
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
List<Payload> payloadFromJson(String str) =>
List<Payload>.from(json.decode(str).map((x) => Payload.fromJson(x)));
String payloadToJson(List<Payload> data) =>
json.encode(List<dynamic>.from(data.map((x) => x.toJson())));
class Payload {
int albumId;
String title;
String url;
Payload({
this.albumId,
this.title,
this.url,
});
factory Payload.fromJson(Map<String, dynamic> json) => Payload(
albumId: json["albumId"],
title: json["title"],
url: json["url"],
);
Map<String, dynamic> toJson() => {
"albumId": albumId,
"title": title,
"url": url,
};
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter 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> {
int _counter = 0;
String base64String;
List<Payload> payloadList;
Future<List<Payload>> getJson() async {
String apiUrl = 'https://jsonplaceholder.typicode.com/photos';
http.Response response = await http.get(apiUrl);
return payloadFromJson(response.body);
}
void _incrementCounter() async {
payloadList = await getJson();
http.Response imageResponse = await http.get(
payloadList[0].url,
);
base64String = base64.encode(imageResponse.bodyBytes);
setState(() {
_counter++;
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: SingleChildScrollView(
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
base64String == null
? Container()
: Image.memory(base64Decode(base64String)),
payloadList == null
? Container()
: Image.network(payloadList[0].url),
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
I have a simple app with two dart files: main.dart and bukalapak.dart
For demonstration purposes the app only has two Future Text() widgets. Basically one Text widget gets the name of a certain html, the other widget gets the total of the same html. Don't ask why but the future builder for "name" has to be in a separate stateful widget in bukalapak.dart. My question is how can I wait until the html is not null then display the total Text widget, because I can easily just call the url again but that would be doing twice the work. I only want to have to call the http.get once.
Here is the code for main.dart:
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark(),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
Bukalapak bukalapak = Bukalapak();
return Scaffold(
appBar: AppBar(
title: Text('data'),
),
body: Container(
child: Column(
children: <Widget>[
RandomWidget(
bukalapak: bukalapak,
),
FutureBuilder(
builder: (context, snapshot) {
return Container(
color: Colors.grey,
height: 28.0,
padding: EdgeInsets.only(left: 20.0),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Total results: ${snapshot.data}')),
);
},
future: bukalapak.getTotal(),
)
],
),
),
);
}
}
The code for bukalapak.dart:
class Bukalapak {
var html;
Future<dynamic> getTotal() async {
// wait until html != null, then perform this
var a = html.querySelectorAll(
'#display_product_search > div.product-pagination-wrapper > div.pagination > span.last-page');
dynamic total = int.parse(a[0].text) * 50;
total = '$total'.replaceAllMapped(
new RegExp(r'(\d{1,3})(?=(\d{3})+(?!\d))'), (Match m) => '${m[1]},');
return total;
}
Future<dynamic> getName() async {
http.Response response = await http.get(
'https://www.bukalapak.com/products/s?from=omnisearch&from_keyword_history=false&page=0&search%5Bkeywords%5D=paper&search_source=omnisearch_organic&source=navbar&utf8=✓');
if (response.statusCode == 200) {
String data = response.body;
html = parse(data);
var nameElement = html.querySelector(
'li.col-12--2 > div.product-card > article > div.product-media > a');
String title = nameElement.attributes['title'];
return title;
} else {
throw Exception('Bukalapak error: statusCode= ${response.statusCode}');
}
}
}
class RandomWidget extends StatefulWidget {
RandomWidget({this.bukalapak});
final Bukalapak bukalapak;
#override
_TextState createState() => _TextState();
}
class _TextState extends State<RandomWidget> {
#override
Widget build(BuildContext context) {
return FutureBuilder(
builder: (context, snapshot) {
return Container(
color: Colors.grey,
height: 28.0,
padding: EdgeInsets.only(left: 20.0),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Name results: ${snapshot.data}')),
);
},
future: widget.bukalapak.getName(),
);
}
}
you can pass any function which notify parent widget to build future.
Following code will help you more:
class DeleteWidget extends StatefulWidget {
#override
_DeleteWidgetState createState() => _DeleteWidgetState();
}
class _DeleteWidgetState extends State<DeleteWidget> {
Bukalapak bukalapak = Bukalapak();
Widget first;
bool isBuild = false;
nowbuildtotal() async {
await Future.delayed(Duration(microseconds: 1));
setState(() {
isBuild = true;
});
}
#override
void initState() {
super.initState();
first = RandomWidget(
bukalapak: bukalapak,
buildnow: nowbuildtotal,
);
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('data'),
),
body: Container(
child: Column(
children: <Widget>[
first,
isBuild
? FutureBuilder(
builder: (context, snapshot) {
return Container(
color: Colors.grey,
height: 28.0,
padding: EdgeInsets.only(left: 20.0),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Total results: ${snapshot.data}')),
);
},
future: bukalapak.getTotal(),
)
: Container()
],
),
),
);
}
}
class RandomWidget extends StatefulWidget {
RandomWidget({this.bukalapak, this.buildnow});
final Bukalapak bukalapak;
final Function buildnow;
#override
_TextState createState() => _TextState();
}
class _TextState extends State<RandomWidget> {
#override
Widget build(BuildContext context) {
return FutureBuilder(
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
widget.buildnow();
}
return Container(
color: Colors.grey,
height: 28.0,
padding: EdgeInsets.only(left: 20.0),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Name results: ${snapshot.data}')),
);
},
future: widget.bukalapak.getName(),
);
}
}
class Bukalapak {
var html;
Future<dynamic> getTotal() async {
// wait until html != null, then perform this
var a = await html.querySelectorAll(
'#display_product_search > div.product-pagination-wrapper > div.pagination > span.last-page');
dynamic total = int.parse(a[0].text) * 50;
total = '$total'.replaceAllMapped(
new RegExp(r'(\d{1,3})(?=(\d{3})+(?!\d))'), (Match m) => '${m[1]},');
return total;
}
Future<dynamic> getName() async {
print("object");
http.Response response = await http.get(
'https://www.bukalapak.com/products/s?from=omnisearch&from_keyword_history=false&page=0&search%5Bkeywords%5D=paper&search_source=omnisearch_organic&source=navbar&utf8=✓');
if (response.statusCode == 200) {
String data = response.body;
html = parse(data);
var nameElement = html.querySelector(
'li.col-12--2 > div.product-card > article > div.product-media > a');
String title = nameElement.attributes['title'];
return title;
} else {
throw Exception('Bukalapak error: statusCode= ${response.statusCode}');
}
}
}
I am getting the csrf token and printing the response data in console but how to keep user logged in using the response data.I am making login using the status code i.e., if status code is 200 then move to login after that I want to keep user logged in and log out only when user wants to log out
I have seen lot of examples but none are helping in my case.
In my case i am using th csrf token and unable to keep it logged in, and i have also used login form.
LoginPage.dart
import 'dart:io';
import 'package:cookie_jar/cookie_jar.dart';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:jignasa/home_screen.dart';
import 'package:jignasa/logindata.dart';
import 'package:path_provider/path_provider.dart';
class LoginPage extends StatefulWidget {
static String tag = 'login-page';
#override
_LoginPageState createState() => new _LoginPageState();
}
class _LoginPageState extends State<LoginPage> {
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
LoginRequestData _loginData = LoginRequestData();
bool _validate = false;
bool _obscureText = true;
var username, password;
#override
Widget build(BuildContext context) {
return Scaffold(
// backgroundColor: Colors.white,
body: SingleChildScrollView(
child: Container(
color: Colors.lightGreen[500],
child: Column(
children: <Widget>[
Center(
child: Container(
width: MediaQuery
.of(context)
.size
.width,
height: MediaQuery
.of(context)
.size
.height / 2.5,
decoration: BoxDecoration(
gradient: LinearGradient(
// begin: Alignment.topCenter,
// end: Alignment.bottomCenter,
colors: [
Color(0xFFFFFFFF),
Color(0xFFFFFFFF),
]
),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(90)
)
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Align(
alignment: Alignment.center,
child: Image.asset('images/ic_launcher1.png'),
),
],
),
),
),
Center(
child: SingleChildScrollView(
child: new Form(
key: _formKey,
autovalidate: _validate,
child: _getFormUI(),
),
)
)
],
),
),
),
);
}
Widget _getFormUI() {
return new Column(
children: <Widget>[
SizedBox(height: 24.0),
Center(
child: Text('Login',
style: TextStyle(fontSize: 25,
fontWeight: FontWeight.bold,
color: Colors.white),),
),
new SizedBox(height: 25.0),
new TextFormField(
keyboardType: TextInputType.emailAddress,
autofocus: false,
decoration: InputDecoration(
hintText: 'Username',
contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
border:
OutlineInputBorder(borderRadius: BorderRadius.circular(32.0)),
),
validator: _validateName,
onSaved: (value) {
_loginData.username = value;
},
),
new SizedBox(height: 8.0),
new TextFormField(
autofocus: false,
obscureText: _obscureText,
keyboardType: TextInputType.text,
decoration: InputDecoration(
hintText: 'Password',
contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
border:
OutlineInputBorder(borderRadius: BorderRadius.circular(24.0)),
suffixIcon: GestureDetector(
child: Icon(
_obscureText ? Icons.visibility : Icons.visibility_off,
semanticLabel:
_obscureText ? 'show password' : 'hide password',
),
),
),
validator: _validatePassword,
onSaved: (String value) {
_loginData.password = value;
}
),
new SizedBox(height: 15.0),
new Padding(
padding: EdgeInsets.symmetric(vertical: 16.0),
child: RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(24),
),
onPressed: () {
_submit();
// Navigator.of(context).pushReplacementNamed('/home');
},
padding: EdgeInsets.all(12),
color: Colors.black54,
child: Text('Log In', style: TextStyle(color: Colors.white)),
),
),
new FlatButton(
child: Text(
'Forgot password?',
style: TextStyle(color: Colors.black54),
),
onPressed: () {},
),
new FlatButton(
onPressed: _sendToRegisterPage,
child: Text('Not a member? Sign up now',
style: TextStyle(color: Colors.black54)),
),
Text(''),
Text(''),
Text(''),
],
);
}
_sendToRegisterPage() {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => HomeScreen()),
);
}
String _validateName(String value) {
if (value.isEmpty) {
return "Username is Required";
} else {
username = value.toString();
}
}
String _validatePassword(String value) {
if (value.isEmpty) {
return "Password is Required";
} else {
password = value.toString();
}
}
_submit() {
if (_formKey.currentState.validate()) {
_formKey.currentState.save();
print("Username ${_loginData.username}");
print("Password ${_loginData.password}");
return SessionId();
} else {
setState(() {
bool _validate = false;
});
}
}
final Dio _dio = Dio();
PersistCookieJar persistentCookies;
final String url = "https://www.xxxx.in/rest/user/login.json";
Future<String> get _localPath async {
final directory = await getApplicationDocumentsDirectory();
print(directory.path);
return directory.path;
}
Future<Directory> get _localCoookieDirectory async {
final path = await _localPath;
final Directory dir = new Directory('$path/cookies');
await dir.create();
print(dir);
return dir;
}
Future<String> getCsrftoken() async{
try {
String csrfTokenValue;
final Directory dir = await _localCoookieDirectory;
final cookiePath = dir.path;
persistentCookies = new PersistCookieJar(dir: '$cookiePath');
persistentCookies.deleteAll(); //clearing any existing cookies for a fresh start
_dio.interceptors.add(
CookieManager(persistentCookies) //this sets up _dio to persist cookies throughout subsequent requests
);
_dio.options = new BaseOptions(
baseUrl: url,
contentType: ContentType.json,
responseType: ResponseType.plain,
// connectTimeout: 5000,
// receiveTimeout: 100000,
headers: {
HttpHeaders.userAgentHeader: "dio",
"Connection": "keep-alive",
},
); //BaseOptions will be persisted throughout subsequent requests made with _dio
_dio.interceptors.add(
InterceptorsWrapper(
onResponse:(Response response) {
List<Cookie> cookies = persistentCookies.loadForRequest(Uri.parse(url));
csrfTokenValue = cookies.firstWhere((c) => c.name == 'csrftoken', orElse: () => null)?.value;
if (csrfTokenValue != null) {
_dio.options.headers['X-CSRF-TOKEN'] = csrfTokenValue; //setting the csrftoken from the response in the headers
}
print(response);
return response;
}
)
);
await _dio.get("https://www.xxxx.in/rest/user/login.json");
print(csrfTokenValue);
return csrfTokenValue;
} catch (error, stacktrace) {
print(error);
// print("Exception occured: $error stackTrace: $stacktrace");
return null;
}
}
SessionId() async {
try {
final csrf = await getCsrftoken();
FormData formData = new FormData.from({
"username": "${_loginData.username}",
"password": "${_loginData.password}",
"csrfmiddlewaretoken" : '$csrf'
});
Options optionData = new Options(
contentType: ContentType.parse("application/json"),
);
Response response = await _dio.post("https://www.xxxx.in/rest/user/login.json", data: formData, options: optionData);
print("StatusCode:${response.statusCode}");
// print(response.data);
if (response.statusCode == 200){
return Navigator.of(context).pushReplacement(MaterialPageRoute(
builder: (context) => HomeScreen(),
));
}
else{
throw Exception();
}
} on DioError catch(e) {
if(e.response != null) {
print( e.response.statusCode.toString() + " " + e.response.statusMessage);
print(e.response.data);
print(e.response.headers);
print(e.response.request);
} else{
print(e.request);
print(e.message);
}
}
catch (error, stacktrace) {
print("Exception occured: $error stackTrace: $stacktrace");
return null;
}
}
}
You can make an entry in Shared preference after getting response code 200 from api.
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs?.setBool("isLoggedIn", true);
then you can navigate user after checking status from shared preference
Future<void> main() async {
SharedPreferences prefs = await SharedPreferences.getInstance();
var status = prefs.getBool('isLoggedIn') ?? false;
print(status);
runApp(MaterialApp(home: status == true ? Login() : Home()));
}
Update :-
Another way of doing it is you can also add your logic into splash screen and splash screen should be entry point in your app
class SplashScreen extends StatefulWidget {
#override
State<StatefulWidget> createState() {
// TODO: implement createState
return _SplashScreenState();
}
}
class _SplashScreenState extends State<SplashScreen> {
#override
void initState() {
// TODO: implement initState
super.initState();
startTimer();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/images/clinician_splash.png"),
fit: BoxFit.cover),
),
),
);
}
void startTimer() {
Timer(Duration(seconds: 3), () {
navigateUser(); //It will redirect after 3 seconds
});
}
void navigateUser() async{
SharedPreferences prefs = await SharedPreferences.getInstance();
var status = prefs.getBool('isLoggedIn') ?? false;
print(status);
if (status) {
Navigation.pushReplacement(context, "/Home");
} else {
Navigation.pushReplacement(context, "/Login");
}
}
}
For logout add below functionality in onPress event of logout button :
void logoutUser(){
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs?.clear()
Navigator.pushAndRemoveUntil(
context,
ModalRoute.withName("/SplashScreen"),
ModalRoute.withName("/Home")
);
}
For security :-
Here in example I have used SharedPreferences which is not secure.for security you can change SharedPreferences to flutter_secure_storage.
https://pub.dev/packages/flutter_secure_storage#-readme-tab-
Future<void> main() async{
WidgetsFlutterBinding.ensureInitialized();
SharedPreferences preferences = await SharedPreferences.getInstance();
var email = preferences.getString("emailText");
runApp(
MaterialApp(
home: email == null ? LoginPage() : Dashboard(),
)
);
}
I'm new to flutter and I know it's a very basic question but I've been stuck on this one for three days. I just want to fetch data from an API on object creation. When you run the code it throws an exception But when you Hot Reload it, the async operation starts to work fine. Kindly tell me where I'm wrong. I myself have made extra classes although one should avoid to code with that approach.
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'dart:async';
import 'package:http/http.dart' as http;
import 'dart:convert';
void main(){
runApp(
MaterialApp(
title : "Quake",
home : HomePage()
)
);
}
class HomePage extends StatefulWidget {
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
#override
void initState() {
super.initState();
dataRepository.init();
}
#override
Widget build(BuildContext context) {
return Reading();
}
}
class Reading extends StatefulWidget {
#override
_ReadingState createState() => _ReadingState();
}
class _ReadingState extends State<Reading> {
Map _data = Map();
List _features = List();
#override
void initState() {
super.initState();
_data = dataRepository.getReading();
_features = _data['features'];
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Quake"),
centerTitle: true,
backgroundColor: Colors.black,
),
body : Center(
child : ListView.builder(
itemCount: _features.length,
padding: const EdgeInsets.all(14.5),
itemBuilder: (BuildContext context, int position){
var format = DateFormat.yMMMd("en_US").add_jm();
var _date = format.format( DateTime.fromMicrosecondsSinceEpoch(_features[position]['properties']['time']*1000, isUtc: true));
return Column(
children: <Widget>[
Divider(height : 5.5),
ListTile(
title: Text("$_date",
style: TextStyle(fontSize: 16.0)),
subtitle: Text("${_features[position]['properties']['place']}",
style: TextStyle(fontSize: 13.0)),
leading: CircleAvatar(
backgroundColor : Colors.black,
child : Text("${_features[position]['properties']['mag']}", style: TextStyle( color: Colors.white))
),
onTap: () => _windowOnTapping(context, _features[position]['properties']['title']),
)],);},)));}}
Future _windowOnTapping(BuildContext context, String message){
var alert = AlertDialog(
title: Text("Quakes"),
content: Text(message),
actions: <Widget>[
FlatButton ( child: Text("OK"), onPressed: (){ Navigator.pop(context);})
],
);
showDialog( context: context, builder: (context)=> alert);
}
final DataRepository dataRepository = DataRepository._private();
class DataRepository{
DataRepository._private();
Map _data;
void init() async{
String apiUrl = 'https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojson';
http.Response response = await http.get(apiUrl);
_data = json.decode(response.body);
}
Map getReading(){
return _data;
}
}
Use a FutureBuilder to read the Future and only render the component after it returns, something like this:
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'dart:async';
import 'package:http/http.dart' as http;
import 'dart:convert';
void main() {
runApp(MaterialApp(title: "Quake", home: HomePage()));
}
class HomePage extends StatefulWidget {
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
#override
void initState() {
super.initState();
}
#override
Widget build(BuildContext context) {
return Reading();
}
}
class Reading extends StatefulWidget {
#override
_ReadingState createState() => _ReadingState();
}
class _ReadingState extends State<Reading> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Quake"),
centerTitle: true,
backgroundColor: Colors.black,
),
body: FutureBuilder<Map>(
future: dataRepository.getReading(),
builder: (context, snapshot) {
if (snapshot.hasData) {
var features = snapshot.data['features'];
return Center(
child: ListView.builder(
itemCount: features.length,
padding: const EdgeInsets.all(14.5),
itemBuilder: (BuildContext context, int position) {
var format = DateFormat.yMMMd("en_US").add_jm();
var _date = format.format(
DateTime.fromMicrosecondsSinceEpoch(
features[position]['properties']['time'] * 1000,
isUtc: true));
return Column(
children: <Widget>[
Divider(height: 5.5),
ListTile(
title:
Text("$_date", style: TextStyle(fontSize: 16.0)),
subtitle: Text(
"${features[position]['properties']['place']}",
style: TextStyle(fontSize: 13.0)),
leading: CircleAvatar(
backgroundColor: Colors.black,
child: Text(
"${features[position]['properties']['mag']}",
style: TextStyle(color: Colors.white))),
onTap: () => _windowOnTapping(context,
features[position]['properties']['title']),
)
],
);
},
));
} else {
return Text("Loading");
}
}));
}
}
Future _windowOnTapping(BuildContext context, String message) {
var alert = AlertDialog(
title: Text("Quakes"),
content: Text(message),
actions: <Widget>[
FlatButton(
child: Text("OK"),
onPressed: () {
Navigator.pop(context);
})
],
);
showDialog(context: context, builder: (context) => alert);
}
final DataRepository dataRepository = DataRepository._private();
class DataRepository {
DataRepository._private();
Future<Map> getReading() async {
String apiUrl =
'https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojson';
http.Response response = await http.get(apiUrl);
var data = json.decode(response.body);
print(data);
return data;
}
}