#Problem#
Here is my code it is a simple app for practising provider package but when I run it a blank
canvas shows up.
#What I want from it#
Can anyone tell me the reason why nothing is showing up on screen? I have tried creating a fresh project and running it still didn't work.
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
void main() => const MyApp();
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return ChangeNotifierProvider<Data>(
create: (context) => Data(),
child: MaterialApp(
theme: ThemeData.dark(),
home: Scaffold(
appBar: AppBar(
title: const MyText(),
),
body: const Level1(),
),
),
);
}
}
class Level1 extends StatelessWidget {
const Level1({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return const Level2();
}
}
class Level2 extends StatelessWidget {
const Level2({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Column(
children: const [
MyTextField(),
Level3(),
],
);
}
}
class Level3 extends StatelessWidget {
const Level3({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Text(Provider.of<Data>(context).data);
}
}
There is a tiny bug in your code... line 4
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
//void main() => const MyApp();
void main() => runApp(const MyApp()); // Update this line.
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
...
In flutter land, the runApp function is responsible for inflating the root widget.
Update your main function to call the runApp function and pass in the root widget, MyApp in this case. That should solve the issue.
Related
I try to use Polymorphism with the Provider package in Dart/Flutter, but I'm not sure if it is possible or not and if I have made a mistake.
I have two provider class "Provider1" and "Provider2" which extend an abstract class "AbstactProvider", I have a widget "WidgetProvider1Or2"
which need to interact with Provider1 Or Provider2 but flutter throw me a "ProviderNotFoundException".
thanks for yours help!
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_bloc_concept/cubit/counter_cubit.dart';
import 'package:provider/provider.dart';
abstract class AbstactProvider extends ChangeNotifier {
void printName();
}
class Provider1 extends AbstactProvider {
#override
void printName() {
print("Provider1");
}
}
class Provider2 extends AbstactProvider {
#override
void printName() {
print("Provider2");
}
}
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return BlocProvider(
create: (context) => CounterCubit(),
child: MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
Widget widgetProvider1 = ChangeNotifierProvider(
create: (_) => Provider1(),
child: WidgetProvider1(),
);
Widget widgetProvider2 = ChangeNotifierProvider(
create: (_) => Provider2(),
child: WidgetProvider2(),
);
Widget widgetProvider1Or2 = ChangeNotifierProvider(
create: (_) => Provider1(),
child: WidgetProvider1Or2(),
);
return Scaffold(
body: Column(
children: [widgetProvider1, widgetProvider2, widgetProvider1Or2],
),
);
}
}
class WidgetProvider1 extends StatelessWidget {
const WidgetProvider1({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
context.watch<Provider1>();
return Container();
}
}
class WidgetProvider2 extends StatelessWidget {
const WidgetProvider2({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
context.watch<Provider2>();
return Container();
}
}
class WidgetProvider1Or2 extends StatelessWidget {
const WidgetProvider1Or2({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
context.watch<AbstactProvider>();
return Container();
}
}
The code was working well till when I tried Extract CupertinoNavigationBar to a widget.
May Anyone please give some information why this issue happening?
It gives me this error:
Error: The argument type 'HomePageAppBar' can't be assigned to the parameter type 'ObstructingPreferredSizeWidget?'.
package:flutter_todo_app/main.dart:27
'HomePageAppBar' is from 'package:flutter_todo_app/main.dart' ('lib/main.dart').
package:flutter_todo_app/main.dart:1
'ObstructingPreferredSizeWidget' is from 'package:flutter/src/cupertino/page_scaffold.dart' ('../../development/flutter/packages/flutter/lib/src/cupertino/page_scaffold.dart').
package:flutter/…/cupertino/page_scaffold.dart:1
navigationBar: HomePageAppBar(),
^
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'widgets/body.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return CupertinoApp(
debugShowCheckedModeBanner: false,
home: const HomePage(),
);
}
}
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: HomePageAppBar(),
child: HomePageBody(),
);
}
}
class HomePageAppBar extends StatelessWidget {
const HomePageAppBar({
Key? key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return CupertinoNavigationBar(
middle: const Text('app bar'),
);
}
}
wrap your HomePageAppBar() with CupertinoNavigationBar() like this :
CupertinoNavigationBar(
child: HomePageAppBar(),
)
Observe that CupertinoPageScaffold navigationBar accepts ObstructingPreferredSizeWidget but you are providing a Stateless Widget that's what the error says. Try implementing HomePageAppBar with ObstructingPreferredSizeWidget (refer to the below code). I ran your code on my machine it solved the error.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'widgets/body.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return CupertinoApp(
debugShowCheckedModeBanner: false,
home: const HomePage(),
);
}
}
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: HomePageAppBar(),
child: HomePageBody(),
);
}
}
// <<<<<<<------ CHANGES ------>>>>>>
class HomePageAppBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
const HomePageAppBar({
Key? key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return const CupertinoNavigationBar(
middle: Text('app bar'),
);
}
#override
Size get preferredSize => const Size(double.infinity, 55);
#override
bool shouldFullyObstruct(BuildContext context) {
return false;
}
}
hi i try to open flutter app on chrome and that what happen.org-dartlang-app:/web_entrypoint.dart:16:22: Error: Undefined name 'main'.
return (entrypoint.main as _NullaryFunction)();
my code:`
import 'package:flutter/material.dart';
class hellp extends StatefulWidget {
const hellp({ Key? key }) : super(key: key);
#override
State<hellp> createState() => _hellpState();
}
class _hellpState extends State<hellp> {
#override
Widget build( BuildContext context) {
return Container(
);
}
}
Just faced this error message while attempting to test a code snippet I found online. Mine was with a stateless widget though.
I solved it by adding the following code after the import statements:
import 'package:flutter/material.dart';
void main() { //add this
runApp(const MyApp());
}
//using stateless widget here.
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: const MyHomePage(),
);
}
Hope this helps :)
I am getting an error for creating a Column Widget saying 'The constructor being called isn't a const constructor.' Having a tough time creating a Column Widget itself,
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'My First Flutter App',
theme: ThemeData(
scaffoldBackgroundColor: Colors.white,
),
home: const WelcomeScreen());
}
}
class WelcomeScreen extends StatelessWidget {
const WelcomeScreen({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return const Scaffold(
body: Column(
children: <Widget>[
Text("Login"),
]
)
);
}}
Just remove const from Scaffold widget
Column is a non-const constructor
Column({
Key? key,
You can use const where everything is available as compile time constant. In this case, Column breaks the condition. You can use const before children, it is possible with Text for now
class WelcomeScreen extends StatelessWidget {
const WelcomeScreen({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: Column(children: const <Widget>[
Text("Login"),
]),
);
}
}
I will encourage you to lean more about const, you can check this question and on guides.
The error is at the level of the scaffold widget.
Just remove the const before scaffold. Then add const keyword before the children of your column widget.
That is how your code is supposed to be
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'My First Flutter App',
theme: ThemeData(
scaffoldBackgroundColor: Colors.white,
),
home: const WelcomeScreen());
}
}
class WelcomeScreen extends StatelessWidget {
const WelcomeScreen({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: const <Widget>[
Text("Login"),
...
]
)
);
}}
Remove the const from the Scaffold widget and it would work fine. But there will be another warning telling that the Column widget does not have const.
To fix that you can either put const in front of <Widget> or put const in front of the children of columns
I am using english-words package and I try to get random word and display it in Text but I got error. What I am doing wrong?
import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
final wordPair = WordPair.random();
return MaterialApp(
theme: ThemeData(primaryColor: Colors.purple[900]),
home: Scaffold(
appBar: AppBar(title: const Text('WordPair Generator')),
body: const Center(child: Text(wordPair.asPascalCase))
));
}
}
I get error at Text(wordPair.asPascalCase):
Evaluation of this constant expression throws an exception.dart(const_eval_throws_exception)
Remove the const keyword before the Center widget. you cant use a const widget if that widget has a none-constant data/variable at the build time.
Edit: More on const