No Material widget found in flutter
1,510
This can be fixed by ensuring that your main includes MaterialApp() and Scaffold() as ancestors of your widgets as so:
void main() {
runApp(MaterialApp(
home: Scaffold(
appBar: AppBar(),
body: YourWidget(),
),
));
}
If, for whatever reason you don't want to use MaterialApp... you can use Material():
void main() {
runApp(
home: Scaffold(
appBar: AppBar(),
body: Material( child: YourWidget()),
),
);
}
Author by
Ahmad Mohy
Updated on December 20, 2022Comments
-
Ahmad Mohy over 1 year
this screenshot of an No Material widget found
I try to add stars RateBar as below code but i got an error no material widget found. what i need to do is that when i pressed on this flatButton i got a window to rate the order and submit this rate, how can i do that through my code below, or to inform me how to handle it
this is the widget of StarRating
import 'package:flutter/material.dart'; typedef void RatingChangeCallback(double rating); class StarRating extends StatelessWidget { final int starCount; final double rating; final RatingChangeCallback onRatingchanged; final Color color; StarRating({this.starCount=5, this.rating = .0, this.onRatingchanged, this.color}); Widget buildStar(BuildContext context, int index){ Icon icon; if (index >= rating) { icon = Icon( Icons.star_border, color: Theme.of(context).buttonColor ); } else if(index > rating - 1 && index < rating){ icon = Icon( Icons.star_half, color: Theme.of(context).primaryColor, ); }else{ icon = Icon( Icons.stars, color: Theme.of(context).primaryColor, ); } return InkResponse( onTap: onRatingchanged==null ? null : ()=> onRatingchanged(index+1.0), child: icon, ); } @override Widget build(BuildContext context) { return Row( children: List.generate(starCount, (index)=>buildStar(context, index)), ); } }
and this is the Screen to view the starBar:
import 'package:felsaree/widgets/star.rating.dart'; import 'package:flutter/material.dart'; class StarRatingScreen extends StatefulWidget { static const routeName = '/starRating'; @override _StarRatingScreenState createState() => _StarRatingScreenState(); } class _StarRatingScreenState extends State<StarRatingScreen> { double rating =3.5; @override Widget build(BuildContext context) { return StarRating( rating: rating, onRatingchanged: (rating) => setState(() => this.rating = rating), ); } }
and in orderDetails screen through the flatbutton i need to show this Star Rate:
import 'package:felsaree/providers/order_provider.dart'; import 'package:felsaree/screens/star_rating_screen.dart'; import 'package:felsaree/widgets/star.rating.dart'; import 'package:flutter/material.dart'; import 'package:intl/intl.dart'; import 'package:provider/provider.dart'; class OrderDetails extends StatefulWidget { static const routeName = '/orderDetails'; @override _OrderDetailsState createState() => _OrderDetailsState(); } class _OrderDetailsState extends State<OrderDetails> { double rating = 3.5; // Widget ratingChange(double rating){ // return StarRating( // rating: rating, // onRatingchanged: (rating)=>this.rating = rating,); // } @override Widget build(BuildContext context) { final mediaQuery = MediaQuery.of(context).size.height; final orderId = ModalRoute.of(context).settings.arguments as int; final orderProvider = Provider.of<OrderProvider>(context, listen: false); final order = orderProvider.findOrderById(orderId); AppBar appBar = AppBar(title: Text(order.restaurantName),); double _totalPrice =orderProvider.totalItemsPrice(order.orderItems); bool _isAddress = orderProvider.checkUserAdress(order.address); return Scaffold( appBar: appBar, body: Column( children: <Widget>[ Card( elevation: 4, margin: EdgeInsets.all(10), child: Padding( padding: EdgeInsets.all(10), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Column( children: <Widget>[ Text(order.id.toString()), SizedBox(height: 4,), Text(order.restaurantName), SizedBox(height: 4,), Text(order.branchName), SizedBox(height: 4,), ], ), Column( children: <Widget>[ Text(DateFormat.yMd().format(DateTime.now())), SizedBox(height: 15,), Text('InProgress'), SizedBox(height: 15,) ], ) ], ),), ), Container( margin: EdgeInsets.all(10), padding: EdgeInsets.all(10), decoration: BoxDecoration( color: Colors.grey[100], border: Border.all(width: 2, color: Colors.grey) ) , child: Column( children: <Widget>[ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Text('Price'), Text('${_totalPrice}L.E'), Text('Total: ${order.price}L.E') ], ), SizedBox(height: 10,), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Text('PC Discount'), Text('${order.discountValue}L.E'), Text(''), ], ), SizedBox(height: 10,), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Text('service Tax'), Text('${order.serviceTax}L.E'), Text(''), ], ), SizedBox(height: 10,), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Text('Delivery'), Text('${order.delivery}L.E'), Text(''), ], ), SizedBox(height: 10,), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[ Text('Vat'), Text('${order.vatAmount}L.E'), Text(''), ], ), ], ), ), Container( decoration: BoxDecoration( color: Colors.white, border: Border.all(color: Colors.grey), borderRadius: BorderRadius.circular(10), ), padding: EdgeInsets.all(10), margin: EdgeInsets.only(bottom: 20), height: (mediaQuery - appBar.preferredSize.height - MediaQuery.of(context).padding.top)*0.30, width: MediaQuery.of(context).size.width*.8, child: ListView.builder( itemCount: order.orderItems.length, itemBuilder: (ctx, index){ final item = order.orderItems[index]; if(item.userComments == ''){ String userComment= 'no comment'; item.userComments = userComment; } return ListTile( leading: CircleAvatar( backgroundImage: NetworkImage(item.image,), ), title: Text(item.itemName), subtitle: Text('count: ${item.count}'), trailing: Text(item.userComments), ); } ), ), Container( width: double.infinity, margin: EdgeInsets.only(right: 10, left: 10), padding: EdgeInsets.symmetric(vertical: 5, horizontal: 10), color: Colors.grey[100], child: Text('Delivery Address', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),), ), SizedBox(height: 8), Container( width: double.infinity, padding: EdgeInsets.all(10), margin: EdgeInsets.all(10), decoration: BoxDecoration( border: Border.all(color: Colors.grey[100]) ), child: _isAddress? Text(order.address) : Text('no address found'), ), FlatButton( onPressed: ()=>Navigator.of(context).pushNamed(StarRatingScreen.routeName), child: Text('Rate The Order', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),)) ], ), ); } }
-
void about 4 yearsadd the code in your
main.dart
to the ones above so I can help where needed. -
void about 4 yearsYou need a material widget as your root widget.
-
Ahmad Mohy about 4 years@Rndom Guru i edit it, also after i add the Scaffold widget it open the screen but the rate bar not found
-
void about 4 yearsWrap your root widget with a
Material Widget
. That should solve the issue.
-
-
Ahmad Mohy about 4 yearsi do not need to put in the main methof i need to usr the rate bar from anothe button in another widget
-
William Terrill about 4 yearsYou do need... somewhere... an instance of MaterialApp() or Material().