I'm creating a double listView app, its going well so far but I've hit a snag that I can't seem to fix.
I'm getting the error[dart] 2 required argument(s) expected, but 0 found.
In my eyes this should be an easy fix, I thought I just needed to change...
body: _cryptoWidget(),
to...
body: _cryptoWidget(currency, color),
This hasn't worked, and I still get the error stated above.
This is the code I'm using to stimulate the error;
import 'package:flutter/material.dart';
import 'background.dart';
import 'package:flutter/foundation.dart';
import 'package:cryptick_nice_ui/data/crypto_data.dart';
import 'package:cryptick_nice_ui/modules/crypto_presenter.dart';
class HomePage extends StatefulWidget {
#override
_HomePageState createState() => new _HomePageState();
}
class _HomePageState extends State<HomePage> implements CryptoListViewContract {
CryptoListPresenter _presenter;
List<Crypto> _currencies;
bool _isLoading;
final List<MaterialColor> _colors = [Colors.blue, Colors.indigo, Colors.red];
List<String> items = [
"Item 1",
"Item 2",
"Item 3",
"Item 4",
"Item 5",
"Item 6",
"Item 7",
"Item 8"
];
_HomePageState() {
_presenter = new CryptoListPresenter(this);
}
#override
void initState() {
super.initState();
_isLoading = true;
_presenter.loadCurrencies();
}
#override
Widget build(BuildContext context) {
return new Container(
decoration: new BoxDecoration(
color: const Color(0xFF273A48),
),
child: new Stack(
children: <Widget>[
new Scaffold(
appBar: new AppBar(
title: new Text("cryp"),
elevation: 0.0,
backgroundColor: Colors.transparent,
),
backgroundColor: Colors.transparent,
body: _cryptoWidget(),
)
],
),
);
}
Widget _cryptoWidget(Crypto currency, MaterialColor color) {
final _width = MediaQuery.of(context).size.width;
final _height = MediaQuery.of(context).size.height;
final headerList = new ListView.builder(
itemBuilder: (context, index) {
EdgeInsets padding = index == 0?const EdgeInsets.only(
left: 20.0, right: 10.0, top: 4.0, bottom: 30.0):const EdgeInsets.only(
left: 10.0, right: 10.0, top: 4.0, bottom: 30.0);
_getHtmlUI();
return new Padding(
padding: padding,
);
},
scrollDirection: Axis.horizontal,
itemCount: items.length,
);
new Scaffold(
appBar: new AppBar(
title: new Text('hello'),
elevation: 0.0,
backgroundColor: Colors.transparent,
),
backgroundColor: Colors.transparent,
body: new Container(
child: new Stack(
children: <Widget>[
new Padding(
padding: new EdgeInsets.only(top: 10.0),
child: new Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
new Align(
alignment: Alignment.centerLeft,
child: new Padding(
padding: new EdgeInsets.only(left: 8.0),
child: new Text(
'Your Feed',
style: new TextStyle(color: Colors.white70),
)),
),
new Container(
height: 300.0, width: _width, child: headerList),
new Expanded(child:
ListView.builder(
itemBuilder:
(context, index) {
_getCryptoUI(currency, color);
}
)
)
],
),
),
],
),
),
);
return new Container(
decoration: new BoxDecoration(
color: const Color(0xFF273A48),
),
child: new Stack(
children: <Widget>[
new CustomPaint(
size: new Size(_width, _height),
painter: new Background(),
),
],
),
);
}
Container _getHtmlUI() {
return new Container(
decoration: new BoxDecoration(
borderRadius: new BorderRadius.circular(10.0),
color: Colors.lightGreen,
boxShadow: [
new BoxShadow(
color: Colors.black.withAlpha(70),
offset: const Offset(3.0, 10.0),
blurRadius: 15.0)
],
image: new DecorationImage(
image: new ExactAssetImage(
'assets/img_0.jpg'),
fit: BoxFit.fitHeight,
),
),
// height: 200.0,
width: 200.0,
child: new Stack(
children: <Widget>[
new Align(
alignment: Alignment.bottomCenter,
child: new Container(
decoration: new BoxDecoration(
color: const Color(0xFF273A48),
borderRadius: new BorderRadius.only(
bottomLeft: new Radius.circular(10.0),
bottomRight: new Radius.circular(10.0))),
height: 30.0,
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text(
'hello',
style: new TextStyle(color: Colors.white),
)
],
)),
)
],
),
);
}
ListTile _getCryptoUI(Crypto currency, MaterialColor color) {
return new ListTile(
title: new Column(
children: <Widget>[
new Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Container(
height: 72.0,
width: 72.0,
decoration: new BoxDecoration(
color: Colors.lightGreen,
boxShadow: [
new BoxShadow(
color:
Colors.black.withAlpha(70),
offset: const Offset(2.0, 2.0),
blurRadius: 2.0)
],
borderRadius: new BorderRadius.all(
new Radius.circular(12.0)),
image: new DecorationImage(
image: new ExactAssetImage(
"cryptoiconsBlack/"+currency.symbol.toLowerCase()+"#2x.png",
),
fit: BoxFit.cover,
)),
),
new SizedBox(
width: 8.0,
),
new Expanded(
child: new Column(
mainAxisAlignment:
MainAxisAlignment.start,
crossAxisAlignment:
CrossAxisAlignment.start,
children: <Widget>[
new Text(
currency.name,
style: new TextStyle(
fontSize: 14.0,
color: Colors.black87,
fontWeight: FontWeight.bold),
),
_getSubtitleText(currency.price_usd, currency.percent_change_1h),
],
)),
new Icon(
Icons.shopping_cart,
color: const Color(0xFF273A48),
)
],
),
new Divider(),
],
),
);
}
Widget _getSubtitleText(String priceUSD, String percentageChange) {
TextSpan priceTextWidget = new TextSpan(
text: "\$$priceUSD\n", style: new TextStyle(color: Colors.black));
String percentageChangeText = "1 hour: $percentageChange%";
TextSpan percentageChangeTextWidget;
if (double.parse(percentageChange) > 0) {
percentageChangeTextWidget = new TextSpan(
text: percentageChangeText,
style: new TextStyle(color: Colors.green));
} else {
percentageChangeTextWidget = new TextSpan(
text: percentageChangeText, style: new TextStyle(color: Colors.red));
}
return new RichText(
text: new TextSpan(
children: [priceTextWidget, percentageChangeTextWidget]));
}
#override
void onLoadCryptoComplete(List<Crypto> items) {
// TODO: implement onLoadCryptoComplete
setState(() {
_currencies = items;
_isLoading = false;
});
}
#override
void onLoadCryptoError() {
// TODO: implement onLoadCryptoError
}
}
For more information on other files I use in this app, for instance crypto_data.dart, please see this GitHub repo that I'm using to model certain sections of my code.
The reason why you're getting the error [dart] 2 required argument(s) expected, but 0 found. is because no arguments were passed. The another example you've provided: _cryptoWidget(currency, color) - you're trying to pass a List, which doesn't match the required arguments.
As mentioned in the comments, what you can do here is to define the index for the List to fetch the required values: _cryptoWidget(_currencies[index], _colors[index])
Related
I want to navigate to detail page. But i get invalid argument error. In detail page, i try to get detail information from my online server. If i click on Hot reload button in android studio, the error disappear. Please, How can i do to fix this error ? Screenshoot of error
the error log :
════════ (2) Exception caught by widgets library ═══════════════════════════════════════════════════
Invalid argument(s): The source must not be null
The relevant error-causing widget was:
DetailArticlePage file:///C:/Users/abiboo/FlutterProject/projectname/lib/miledoo_widget/home.dart:515:39
//home.dart
return new Container(
margin: EdgeInsets.symmetric(vertical: 8.0),
height: 240.0,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: articledata.length,
itemBuilder: (BuildContext context,int index) {
return Padding(
padding: EdgeInsets.all(4),
child: InkWell(
onTap: (){
Navigator.push(
context,
new MaterialPageRoute(
builder: (context) =>
DetailArticlePage(int.parse(articledata[index].idArt), articledata[index].designation)));
},
child: Container(
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
This is a piece of code for detail page who contain a method to get detail informaation from server
//detailpage.dart
import 'package:cached_network_image/cached_network_image.dart';
import 'package:f_miledoo/miledoo_widget/detail_boutique_page.dart';
import 'package:f_miledoo/miledoo_widget/panier_page.dart';
import 'package:f_miledoo/models/detail_article_models.dart';
import 'package:f_miledoo/models/panier_models.dart';
import 'package:f_miledoo/shared/constants.dart';
import 'package:f_miledoo/utils/database_helper.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import '../localisation_internationnalisation/localisation.dart';
import 'dart:async';
import 'package:http/http.dart' as http;
import 'dart:convert';
class DetailArticlePage extends StatefulWidget{
final int id_art;
final String art_desgnation;
DetailArticlePage(this.id_art, this.art_desgnation);
DetailArticlePages createState() => DetailArticlePages();
}
class DetailArticlePages extends State<DetailArticlePage> {
DatabaseHelper helper = DatabaseHelper();
PanierModel _panier = new PanierModel.withempty();
final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
int qtecompter = 1;
double prixTotal = 0.0;
String aAfficher = "";
int taillePanier = 0;
String idArt;
String designation;
String descrip;
String prixUnit;
String prixUnit2;
String qteStock;
String idBou;
String lienPhoto;
String nomBou;
#override
void initState() {
// TODO: implement initState
super.initState();
getpanierTaille();
this.getRecapArticleData(widget.id_art, widget.art_desgnation);
}
getpanierTaille() async => taillePanier = await helper.getCount();
getRecapArticleData(int id_article, String nom_article) async {
final response = await http.get(BASE + "xxxxxxx?id_art="+ id_article.toString() +"&nom_art="+ nom_article);
if (response.statusCode == 200) {
final jsonResponse = json.decode(response.body);
TheDetailData myData = new TheDetailData.fromJson(jsonResponse);
for (var i = 0; i < myData.articledetail.list_recap_article.length; i++) {
idArt = myData.articledetail.list_recap_article[i].idArt;
designation = myData.articledetail.list_recap_article[i].designation;
descrip = myData.articledetail.list_recap_article[i].descrip;
prixUnit = myData.articledetail.list_recap_article[i].prixUnit;
prixUnit2 = myData.articledetail.list_recap_article[i].prixUnit2;
qteStock = myData.articledetail.list_recap_article[i].qteStock;
lienPhoto = myData.articledetail.list_recap_article[i].lienPhoto;
idBou = myData.articledetail.list_recap_article[i].idBou;
print("id_art = " + idArt + " designation = " + designation +
" prixUnit2 = " + prixUnit2 + " Qté = " + qteStock);
}
} else {
throw Exception("Failed to load Data");
}
}
Future<List<ListArtMemeCate>> _getSameArticleData(int id_article, String nom_article) async {
final response = await http.get(BASE + "xxxxxxx?id_art="+ id_article.toString() +"&nom_art="+ nom_article);
if (response.statusCode == 200) {
final jsonResponse = json.decode(response.body);
TheDetailData myData = new TheDetailData.fromJson(jsonResponse);
List<ListArtMemeCate> datas = [];
for (var i = 0; i < myData.articledetail.list_art_meme_cate .length; i++) {
datas.add(myData.articledetail.list_art_meme_cate[i]);
}
return datas;
} else {
throw Exception("Failed to load Data");
}
}
#override
Widget build(BuildContext context) {
int localStockQte = int.parse(qteStock);
double localPrixUnit2 = double.parse(prixUnit2.toString());
Widget article_afficher333 = FutureBuilder(
future: _getSameArticleData(widget.id_art, widget.art_desgnation),
builder: (context, snapshot) {
//if(snapshot.data != null){
if (snapshot.hasData) {
List<ListArtMemeCate> articledata = snapshot.data;
return new Container(
child: GridView.count(
shrinkWrap: true,
crossAxisCount: 2,
childAspectRatio: 0.7,
padding: EdgeInsets.only(top: 8, left: 6, right: 6, bottom: 12),
children: List.generate(articledata.length, (index){
return Container(
child: Card(
clipBehavior: Clip.antiAlias,
child: InkWell(
onTap: () {
Navigator.push(
context,
new MaterialPageRoute(
builder: (context) =>
DetailArticlePage(int.parse(articledata[index].idArt) , articledata[index].designation)));
},
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SizedBox(
height: (MediaQuery.of(context).size.width / 2 - 40),
width: double.infinity,
child: CachedNetworkImage(
fit: BoxFit.cover,
imageUrl: BASEIMAGES+articledata[index].lienPhoto,
placeholder: (context, url) => Center(
child: CircularProgressIndicator()
),
errorWidget: (context, url, error) => new Icon(Icons.image),
),
),
Padding(
padding: const EdgeInsets.only(top: 2.0),
child: ListTile(
title: Text((() {
if(articledata[index].designation.length >12){
return "${articledata[index].designation.substring(0, 12)}...";}
return "${articledata[index].designation}";
})(), style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15.0, fontFamily: "Questrial")),
subtitle: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Row(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(top: 2.0, bottom: 1),
child: Text(articledata[index].prixUnit2+" F CFA", style: TextStyle(
color: Theme.of(context).accentColor,
fontWeight: FontWeight.w700,
fontFamily: 'Questrial'
)),
),
],
),
],
),
),
)
],
),
),
),
);
}),
),
);
} else if (snapshot.hasError) {
return Container(
child: Center(
child: Text(
"Erreur de chargement. Verifier votre connexion internet"),
),
);
}
return new Center(
child: CircularProgressIndicator(),
);
},
);
setState(() {
_panier.nom_article = designation;
_panier.prixUnit2 = double.parse(prixUnit2);
_panier.image_article = lienPhoto;
_panier.prixTot = qtecompter*double.parse(prixUnit2);
_panier.quantite = qtecompter ;
_panier.id_article = int.parse(idArt);
});
void _incrementeQte(){
setState((){
if(qtecompter >= localStockQte){
qtecompter = localStockQte;
}
qtecompter++;
});
}
void _decrementeQte(){
setState((){
if(qtecompter <=1){
qtecompter = 1;
}else{
qtecompter--;
}
});
}
String _getPrixTotal(){
setState((){
prixTotal = qtecompter*localPrixUnit2;
aAfficher = prixTotal.toString();
});
return aAfficher;
}
void _ajouterPanier() async {
//s.addToCart(widget.article);
var result = await helper.addCart(_panier);
var result3 = await helper.getCount();
/*int result;
result = await helper.addCart(_panier);
if(result != 0)
print('STATUS Panier Save Successfully');*/
}
return Scaffold(
key: _scaffoldKey,
appBar: AppBar(
title: Text("designation", style: TextStyle(color: Colors.white),),
iconTheme: new IconThemeData(color: Colors.white),
actions: <Widget>[
Stack(
children: <Widget>[
IconButton(
icon: Icon(Icons.shopping_cart, color: Colors.white, ),
onPressed: () {
//showAlertDialog(context);
Navigator.push(context, new MaterialPageRoute(builder: (context) => PanierPage()));
},
),
Container(
width: 25,
height: 25,
decoration: BoxDecoration(
color: Colors.red,
borderRadius: BorderRadius.circular(30),
),
alignment: Alignment.center,
child: Text(taillePanier.toString(),
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 12
),)
),
],
),
],
),
body: new ListView(
children: <Widget>[
new Container(
height: 240,
child: new Hero(tag: lienPhoto, child: new Material(
child: InkWell(
child: new Image.network(
BASEIMAGES + lienPhoto,
fit: BoxFit.cover),
),
)),
),
new Container(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(top: 10,left: 5),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Text(designation.toString(), style: new TextStyle(fontSize: 20.0, color: Colors.black, fontFamily: 'Questrial'),),
],
),
),
SizedBox(height: 10.0),
Padding(
padding: const EdgeInsets.only(left: 280),
child: new Text(prixUnit2.toString()+" F CFA", style: new TextStyle(fontSize: 15.0, color: Colors.black54, fontFamily: 'Questrial', fontWeight: FontWeight.bold),),
),
SizedBox(height: 10.0),
Padding(
padding: const EdgeInsets.only(left: 20, right: 20, bottom: 10),
child: new Text(descrip.toString(), style: new TextStyle(fontSize: 15.0, color: Colors.grey, fontFamily: 'Questrial'),),
),
SizedBox(height: 10.0),
new Container(
height: 100,
child: Column(
children: <Widget>[
Container(
height: 1.0,
color: Colors.grey,
),
Padding(
padding: const EdgeInsets.only(left: 25, right: 25, top: 20),
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(AppLocalizations.of(context)
.translate('_QUANTITY'), style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15, fontFamily: 'Questrial'),),
Text(AppLocalizations.of(context)
.translate('_TOTAL_PRICE'), style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15, fontFamily: 'Questrial'), ),
],
),
),
Padding(
padding: const EdgeInsets.only(left: 10, right: 25),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Row(
children: <Widget>[
new IconButton(
icon: Icon(Icons.remove_circle_outline, color: Colors.amber, ),
onPressed: _decrementeQte,
),
new Text("$qtecompter"),
new IconButton(
icon: Icon(Icons.add_circle_outline, color: Colors.amber, ),
onPressed: _incrementeQte,
),
],
),
new Text(_getPrixTotal()+" F CFA", style: new TextStyle(fontSize: 20.0, color: Colors.grey),),
],
),
),
Container(
height: 1.0,
color: Colors.grey,
),
],
),
),
//articleMemeCategorie()
],
),
),
Padding(
padding: const EdgeInsets.only(top: 10, left: 25, ),
child: Text(AppLocalizations.of(context)
.translate('_ITEMS_OF_SAME_QUATEGORY'), style: TextStyle(fontFamily: 'Questrial', fontSize: 15, fontWeight: FontWeight.bold),),
),
article_afficher333,
],
),
bottomNavigationBar: new Container(
color: Colors.white,
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Expanded(child: new MaterialButton(
onPressed: (){showAlertDialog(context);},
child: new Row(
//crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
IconButton(
//widget.article
icon: Icon(Icons.store, color: Colors.white,),
onPressed: () {
//showAlertDialog(context);
Navigator.push(
context,
new MaterialPageRoute(
builder: (context) =>
DetailBoutiquePage(int.parse(idBou)))); },
),
],
),
color: Color(0xFFFFC23A),
),),
Expanded(
flex: 2,
child: new MaterialButton(
onPressed: (){
_ajouterPanier();
},
child: new Container(
child: new Row(
children: <Widget>[
IconButton(
icon: Icon(Icons.add_shopping_cart, color: Colors.white,),
),
Text(AppLocalizations.of(context)
.translate('_ADD_TO_CART'), style: TextStyle(color: Color(0xFFFFFFFF)))
],
),
),
color: Color(0xFFFFC23A),
),),
Expanded(child: new MaterialButton(
onPressed: (){showAlertDialog(context);},
child: new Text(AppLocalizations.of(context)
.translate('_BUY_NOW'), style: TextStyle(color: Color(0xFFFFFFFF)),),
color: Color(0xFFFFC23A),
),),
],
),
)
);
}
}
Without seeing your full detail page and error log it is difficult to tell exactly what your error is.
From the information you have given it sounds like you are trying to retrieve data from an Http request, and then use that information for the display of your page. Have you tried using a FutureBuilder in the detail page? This will allow you to display a page while waiting for the data from the server, and will then display the data from the server once it has been retrieved.
Another exception was thrown: A RenderFlex overflowed by 40 pixels on the bottom.
I am getting this error. Please someone help me. I am new in flutter.
I did change lots of things on the code but still couldn't change the result.
import 'package:flutter/material.dart';
import 'package:estilo/pages/cart.dart';
class Cart_products extends StatefulWidget {
#override
_Cart_productsState createState() => _Cart_productsState();
}
class _Cart_productsState extends State<Cart_products> {
var Products_on_the_cart = [
{
"name": "Blazer (Man)",
"picture": "images/products/blazer1.jpeg",
"price": 85,
"size": "M",
"color": "Black",
"quantity": 1
},
{
"name": "Hill 1",
"picture": "images/products/hills1.jpeg",
"price": 50,
"size": "38",
"color": "Red",
"quantity": 1
},
{
"name": "Hill 1",
"picture": "images/products/hills1.jpeg",
"price": 50,
"size": "38",
"color": "Red",
"quantity": 1
},
];
#override
Widget build(BuildContext context) {
return new ListView.builder(
itemCount: Products_on_the_cart.length,
itemBuilder: (context, index) {
return new Single_cart_product(
cart_prod_name: Products_on_the_cart[index]["name"],
cart_prod_color: Products_on_the_cart[index]["color"],
cart_prod_quantity: Products_on_the_cart[index]["quantity"],
cart_prod_size: Products_on_the_cart[index]["size"],
cart_prod_price: Products_on_the_cart[index]["price"],
cart_prod_picture: Products_on_the_cart[index]["picture"],
);
});
}
}
class Single_cart_product extends StatelessWidget {
final cart_prod_name;
final cart_prod_picture;
final cart_prod_price;
final cart_prod_size;
final cart_prod_color;
final cart_prod_quantity;
Single_cart_product(
{this.cart_prod_name,
this.cart_prod_picture,
this.cart_prod_price,
this.cart_prod_color,
this.cart_prod_quantity,
this.cart_prod_size});
#override
Widget build(BuildContext context) {
return Card(
child: ListTile(
//Leading Section
leading: new Image.asset(
cart_prod_picture,
width: 80.0,
height: 80.0,
),
//Title Section
title: new Text(cart_prod_name),
//Subtitle Section
subtitle: new Column(
children: <Widget>[
new Row(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(0.0),
child: new Text("Size:")),
Padding(
padding: const EdgeInsets.all(4.0),
child: new Text(
cart_prod_size,
style: TextStyle(color: Colors.red),
)),
//For Product Color
new Padding(
padding: const EdgeInsets.fromLTRB(20.0, 8.0, 8.0, 8.0),
child: new Text("Color:"),
),
Padding(
padding: const EdgeInsets.all(4.0),
child: new Text(cart_prod_color,
style: TextStyle(color: Colors.red)),
)
],
),
// This is for product price
new Container(
alignment: Alignment.topLeft,
child: new Text(
"$cart_prod_price\₺",
style: TextStyle(
fontSize: 17.0,
fontWeight: FontWeight.bold,
color: Colors.red),
),
)
],
),
trailing: new Column(
verticalDirection: VerticalDirection.down,
children: <Widget>[
new IconButton(icon: Icon(Icons.arrow_drop_up), onPressed: (){}),
new IconButton(icon: Icon(Icons.arrow_drop_down), onPressed: (){})
],
),
),
);
}
}
this is my dart class
The screenshot is here
Try this, it will look like this:
#override
Widget build(BuildContext context) {
final Size screenSize = MediaQuery.of(context).size;
return Card(
child: Row(
children: <Widget>[
new SizedBox(
width: (screenSize.width / 5) * 4.3,
child: ListTile(
//Leading Section
leading: new Image.asset(
cart_prod_picture,
width: 80.0,
height: 80.0,
),
//Title Section
title: new Text(cart_prod_name),
//Subtitle Section
subtitle: new Column(
children: <Widget>[
new Row(
children: <Widget>[
new Padding(
padding: const EdgeInsets.all(0.0),
child: new Text("Size:")),
new Padding(
padding: const EdgeInsets.all(4.0),
child: new Text(
cart_prod_size,
style: TextStyle(color: Colors.red),
)),
//For Product Color
new Padding(
padding: const EdgeInsets.fromLTRB(20.0, 8.0, 8.0, 8.0),
child: new Text("Color:"),
),
new Padding(
padding: const EdgeInsets.all(4.0),
child: new Text(cart_prod_color,
style: TextStyle(color: Colors.red)),
)
],
),
// This is for product price
new Container(
alignment: Alignment.topLeft,
child: new Text(
"$cart_prod_price\₺",
style: TextStyle(
fontSize: 17.0,
fontWeight: FontWeight.bold,
color: Colors.red),
),
)
],
),
),
),
new SizedBox(
width: 49.0,
child: new Column(
children: <Widget>[
new IconButton(icon: Icon(Icons.arrow_drop_up), onPressed: () {}),
new Text("$cart_prod_quantity"),
new IconButton(icon: Icon(Icons.arrow_drop_down), onPressed: () {})
],
)
)
],
),
);
}
I have this stream builder that get Item has been chosen from the user and show them as orders,
in the stream builder, I can get them all by the index like snapshot.data.orders[**index**]
How can I get all those data when I press a button out of the stream to save them as a json Strings and send them as orders from a customer?
here's the code
import 'package:cosmetics_store/models/Cart.dart';
import 'package:cosmetics_store/bloc/CartBloc.dart';
import 'package:cosmetics_store/components/OrderWidget.dart';
class CartManager extends StatefulWidget {
#override
_CartManager createState() => new _CartManager();
}
class _CartManager extends State<CartManager> {
CartBloc _cartBloc = new CartBloc();
#override
Widget build(BuildContext context) {
double _gridSize = MediaQuery.of(context).size.height * 0.88;
return new Container(
height: MediaQuery.of(context).size.height,
child: new Stack(children: <Widget>[
new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new StreamBuilder(
initialData: _cartBloc.currentCart,
stream: _cartBloc.observableCart,
builder: (context, AsyncSnapshot<Cart> snapshot) {
return new Container(
margin: EdgeInsets.symmetric(horizontal: 20),
height: _gridSize,
width: double.infinity,
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Padding(
padding: EdgeInsets.symmetric(vertical: 40),
child: new Text("Cart",
style: TextStyle(
color: Colors.white,
fontSize: 40,
fontWeight: FontWeight.bold))),
new Container(
margin: EdgeInsets.only(bottom: 10),
height: _gridSize * 0.60,
child: new ListView.builder(
itemCount: snapshot.data.orders.length,
itemBuilder: (context, index) {
return Dismissible(
background: Container(
color: Colors.transparent),
key: Key(snapshot
.data.orders[index].id
.toString()),
onDismissed: (_) {
_cartBloc.removerOrderOfCart(
snapshot.data.orders[index]);
},
child: new Padding(
padding: EdgeInsets.symmetric(
vertical: 10),
child: new OrderWidget(
snapshot.data.orders[index],
_gridSize)),
);
})),
new Container(
height: _gridSize * 0.15,
child: new Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: <Widget>[
new Text("Total",
style: TextStyle(
color: Colors.white,
fontSize: 20)),
new Text(
"\$${snapshot.data.totalPrice().toStringAsFixed(2)}",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 40)),
]))
]));
})
]),
new Align(
alignment: Alignment.bottomLeft,
child: new Container(
padding: EdgeInsets.only(left: 10, bottom: _gridSize * 0.02),
width: MediaQuery.of(context).size.width - 80,
child: new RaisedButton(
color: Colors.amber,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(60)),
padding: EdgeInsets.all(20),
onPressed: () {
if (_cartBloc.currentCart.isEmpty)
Scaffold.of(context).showSnackBar(
SnackBar(content: Text("Cart is empty")));
else {
}
},
child: new Text("Next",
style: TextStyle(fontWeight: FontWeight.bold)))))
]));
}
}
Hi I want to display the CircularProgressIndicator in centre of my screen on top of all widget. it should be like overlay.
Right now when CircularProgressIndicator is visible all widgets move down a bit to display CircularProgressIndicator . I want it should be overlay. Does anyone know how to do that ?
import 'package:flutter/material.dart';
import 'package:roomie/auth/Auth.dart';
class ForgotPasswordScreen extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return ForgotPasswordScreenState();
}
}
class ForgotPasswordScreenState extends State<ForgotPasswordScreen> {
var emailController = new TextEditingController();
var authHandler = new Auth();
bool isLoading = false;
#override
Widget build(BuildContext context) {
return new Scaffold(
body: Container(
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
color: Colors.white,
),
child: new Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Row(
children: <Widget>[
new Expanded(
child: isLoading
? Center(child: CircularProgressIndicator())
: new Container()),
],
),
new Row(
children: <Widget>[
new Expanded(
child: new Padding(
padding: const EdgeInsets.only(left: 40.0),
child: new Text(
"EMAIL",
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.redAccent,
fontSize: 15.0,
),
),
),
),
],
),
new Container(
width: MediaQuery.of(context).size.width,
margin:
const EdgeInsets.only(left: 40.0, right: 40.0, top: 10.0),
alignment: Alignment.center,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: Colors.redAccent,
width: 0.5,
style: BorderStyle.solid),
),
),
padding: const EdgeInsets.only(left: 0.0, right: 10.0),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
new Expanded(
child: TextField(
controller: emailController,
textAlign: TextAlign.left,
decoration: InputDecoration(
border: InputBorder.none,
hintText: 'PLEASE ENTER YOUR EMAIL',
hintStyle: TextStyle(color: Colors.grey),
),
),
),
],
),
),
Divider(
height: 24.0,
),
new Container(
width: MediaQuery.of(context).size.width,
margin:
const EdgeInsets.only(left: 30.0, right: 30.0, top: 20.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
new Expanded(
child: new FlatButton(
shape: new RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(30.0),
),
color: Colors.redAccent,
onPressed: () {
setState(() {
isLoading = true;
});
authHandler
.sendPasswordResetEmail(emailController.text)
.then((void nothing) async {
await showDialog(
context: context,
builder: (BuildContext context) {
// return object of type Dialog
return AlertDialog(
content: new Text(
"Password reset email has been sent."),
actions: <Widget>[
// usually buttons at the bottom of the dialog
new FlatButton(
child: new Text("OK"),
onPressed: () {
Navigator.pop(context);
},
),
],
);
},
);
Navigator.pop(context);
setState(() {
isLoading = false;
});
}).catchError((e) => print(e));
},
child: new Container(
padding: const EdgeInsets.symmetric(
vertical: 20.0,
horizontal: 20.0,
),
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Expanded(
child: Text(
"FORGOT PASSWORD",
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold),
),
),
],
),
),
),
),
],
),
),
],
)));
}
}
Stack is what you'r looking for :
https://docs.flutter.io/flutter/widgets/Stack-class.html
#override
Widget build(BuildContext context) {
return new Scaffold(
body: Stack(
children:<Widget>[ Container(
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
color: Colors.white,
),
child: new Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Row(
children: <Widget>[
new Expanded(
child: new Padding(
padding: const EdgeInsets.only(left: 40.0),
child: new Text(
"EMAIL",
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.redAccent,
fontSize: 15.0,
),
),
),
),
],
),
new Container(
width: MediaQuery.of(context).size.width,
margin:
const EdgeInsets.only(left: 40.0, right: 40.0, top: 10.0),
alignment: Alignment.center,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: Colors.redAccent,
width: 0.5,
style: BorderStyle.solid),
),
),
padding: const EdgeInsets.only(left: 0.0, right: 10.0),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
new Expanded(
child: TextField(
controller: emailController,
textAlign: TextAlign.left,
decoration: InputDecoration(
border: InputBorder.none,
hintText: 'PLEASE ENTER YOUR EMAIL',
hintStyle: TextStyle(color: Colors.grey),
),
),
),
],
),
),
Divider(
height: 24.0,
),
new Container(
width: MediaQuery.of(context).size.width,
margin:
const EdgeInsets.only(left: 30.0, right: 30.0, top: 20.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
new Expanded(
child: new FlatButton(
shape: new RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(30.0),
),
color: Colors.redAccent,
onPressed: () {
setState(() {
isLoading = true;
});
authHandler
.sendPasswordResetEmail(emailController.text)
.then((void nothing) async {
await showDialog(
context: context,
builder: (BuildContext context) {
// return object of type Dialog
return AlertDialog(
content: new Text(
"Password reset email has been sent."),
actions: <Widget>[
// usually buttons at the bottom of the dialog
new FlatButton(
child: new Text("OK"),
onPressed: () {
Navigator.pop(context);
},
),
],
);
},
);
Navigator.pop(context);
setState(() {
isLoading = false;
});
}).catchError((e) => print(e));
},
child: new Container(
padding: const EdgeInsets.symmetric(
vertical: 20.0,
horizontal: 20.0,
),
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Expanded(
child: Text(
"FORGOT PASSWORD",
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold),
),
),
],
),
),
),
),
],
),
),
],
)),
isLoading ? Container(
color: Colors.black.withOpacity(0.5),
child: Center(
child: CircularProgressIndicator(),
),
) : Container()
],
));
}
2021: Although Stack is a phenomenal option, a simple showDialog will do the trick. It is clean, efficient, and will give you a fade in/out animation. Code:
onEvent: () {
showDialog(
barrierDismissible: false,
builder: (ctx) {
return Center(
child: CircularProgressIndicator(
strokeWidth: 2,
),
)
},
context: context,
);
},
When the event is completed, call Navigator.of(context).pop();. If you want the user to be able to tap the screen and close the dialog manually, delete the barrierDismissable: false code. If you have issues with the .pop(), you may want to specifically use the dialog's context when dismissing.
How do I wrap content of PageView so that Indicators appear right below where PageView ends ?. Right now PageView fills entire screen and Indicators are at bottom of screen. Below is how each child in PageView is created. In each child I have a Image with default height of 200 and TextView with maxLines of 2 . Though actual height of each child in PageView is half of device screen , it fills entire screen .
final List<Widget> _pages = <Widget>[
new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Image.network(
'imageurl',
height: 200.0,
fit: BoxFit.fitWidth,
),
new Padding(
padding: EdgeInsets.all(20.0),
child: new Text(
"Order from wide range of restaurants",
maxLines: 2,
style: new TextStyle(fontSize: 25.0, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
)
],
),
new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Image.network(
'imageurl',
height: 200.0,
fit: BoxFit.fitWidth,
),
new Padding(
padding: EdgeInsets.all(20.0),
child: new Text(
"Order from wide range of restaurants",
maxLines: 2,
style: new TextStyle(fontSize: 25.0, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
),
],
),
new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Image.network(
'imageurl',
height: 200.0,
fit: BoxFit.fitWidth,
),
new Padding(
padding: EdgeInsets.all(20.0),
child: new Text(
"Order from wide range of restaurants",
maxLines: 2,
style: new TextStyle(fontSize: 25.0, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
)
],
)
];
Stateful Widget's Builder method
Widget build(BuildContext context) {
return new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
new Flexible(
child: new PageView.builder(
physics: new AlwaysScrollableScrollPhysics(),
controller: _controller,
itemCount: _pages.length,
itemBuilder: (BuildContext context, int index) {
return _pages[index % _pages.length];
},
),
fit: FlexFit.loose,
),
new Container(
color: Colors.black,
padding: const EdgeInsets.all(20.0),
child: new Center(
child: new DotsIndicator(
controller: _controller,
itemCount: _pages.length,
onPageSelected: (int page) {
_controller.animateToPage(
page,
duration: _kDuration,
curve: _kCurve,
);
},
),
),
)
],
);
}
Here my solution, as you didn't pasted entire source code, i have omitted dots section
import 'package:flutter/material.dart';
class PageViewIssue extends StatefulWidget {
PageViewIssue({Key key, this.title}) : super(key: key);
static const String routeName = "/PageViewIssue";
final String title;
#override
_PageViewIssueState createState() => new _PageViewIssueState();
}
class _PageViewIssueState extends State<PageViewIssue> {
#override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text(widget.title),
),
body: _getBodyContent(),
floatingActionButton: new FloatingActionButton(
onPressed: _onFloatingActionButtonPressed,
tooltip: 'Add',
child: new Icon(Icons.add),
),
);
}
void _onFloatingActionButtonPressed() {}
List<Widget> _getPageViews() {
final String imgUrl =
"https://images.pexels.com/photos/45201/kitty-cat-kitten-pet-45201.jpeg?auto=compress&cs=tinysrgb&h=320&w=320";
final List<Widget> _pages = <Widget>[
new Center(
child: new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Center(
child: new Image.network(
imgUrl,
height: 200.0,
fit: BoxFit.fitWidth,
)),
new Padding(
padding: EdgeInsets.all(20.0),
child: new Text(
"Order from wide range of restaurants",
maxLines: 2,
style: new TextStyle(fontSize: 25.0, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
)
],
)),
new Center(
child: new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Center(
child: new Image.network(
imgUrl,
height: 200.0,
fit: BoxFit.fitWidth,
)),
new Padding(
padding: EdgeInsets.all(20.0),
child: new Text(
"Order from wide range of restaurants",
maxLines: 2,
style: new TextStyle(fontSize: 25.0, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
),
],
)),
new Center(
child: new Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Center(
child: new Image.network(
imgUrl,
height: 200.0,
fit: BoxFit.fitWidth,
)),
new Padding(
padding: EdgeInsets.all(20.0),
child: new Text(
"Order from wide range of restaurants",
maxLines: 2,
style: new TextStyle(fontSize: 25.0, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
)
],
))
];
return _pages;
}
Widget _getBodyContent() {
var controller = new PageController(initialPage: 0);
var pageView = new PageView(
children: _getPageViews(), pageSnapping: true, controller: controller);
var width = MediaQuery.of(context).size.width;
var expansion1 = new Expanded(
child:
new Container(width: width, child: pageView, color: Colors.green),
flex: 9);
var expansion2 = new Expanded(
child: new Container(
width: width,
child: new Center(child: new Text("Text 2")),
color: Colors.redAccent),
flex: 1);
return new Column(children: <Widget>[expansion1, expansion2]);
}
}
What you were looking for is Constrained Box.