I'm new to flutter and I'm trying to create an app with provider. I wrapped MaterialApp widget with the ChangeNotifierProvider and the app works and I can use the provider as it intended to do. I need to know is it okay to do so and will i face any problems?
Widget build(BuildContext context) {
return ChangeNotifierProvider<BaseModel>(
builder: (context) =>
BaseModel(loading: false, title: "Title", isLoggedIn: false),
child: MaterialApp(
routes: <String, WidgetBuilder>{
"/home": (BuildContext context) => Home(),
"/signIn": (BuildContext context) => SignIn()
},
initialRoute: "/signIn",
title: 'Flutter Demo',
theme: ThemeData(
// is not restarted.
primarySwatch: Colors.blue,
),
home: SignIn()),
);
In all the sample codes they use Provider under "home" in MaterialApp widget. I used MaterialApp inside the provider.
It is totally fine. There's no problem whatsoever.
Related
I am using flutter 2 and trying to use GetX for localization between two different languages.
problem is I should put my translation class in main.dart, inside MaterialApp. but MaterialApp isn't accepting that paramater. do I need to upgrade to flutter 3 or where is the problem?
My Code:
#override
Widget build(BuildContext context) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
return ScreenUtilInit(
designSize: Size(411.429,
835.8095238095239),
minTextAdapt: true,
builder: (context, child) {
return MaterialApp(
debugShowCheckedModeBanner: false,
theme: ThemeData(
textTheme:
GoogleFonts.josefinSansTextTheme(
Theme.of(context).textTheme),
primaryColor: Colors.pinkAccent,
primarySwatch: Colors.pink,
visualDensity:
VisualDensity.adaptivePlatformDensity),
home: WillPopScope(
onWillPop: () async => false,
child: AppConfigPage(),
),
locale: Get.deviceLocale,
translations: MyLocale() // here is the problem .. with "tranalsations" paramater.
);
});
}
I figured out I am using MaterialApp, correct to use GetMaterialApp
I am using flutter_screenutil: ^5.5.3+2
and build_runner: ^2.0.4
after running the build runner
there is error in the builder of screenutlils
use ScreenUtilInit like this
#override
Widget build(BuildContext context) {
// In first method you only need to wrap [MaterialApp] with [ScreenUtilInit] and that's it
return ScreenUtilInit(
builder: (_, child) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Test',
theme: ThemeData(
primarySwatch: Colors.blue,
textTheme: TextTheme(bodyText2: TextStyle(fontSize: 30.sp)),
),
home: child,
);
},
child: HomePage(),
);
}
}
The issue is here ScreenUtilInit builder require context and child
builder: (context , child) { //this
Widget build(BuildContext context) {
return ScreenUtilInit(
builder: (context, child) {
return MultiBlocProvider(
providers: [],
child: Text("AA"),
);
},
);
}
I am trying to make an application using Pokemon api as an exercise.
I am trying to make it using the Bloc pattern.
If you click on GridTile, you need to get indexID and move to DetailPage.
Getting the IndexID is fine, but it doesn't go to the page.
I can't seem to build the page, but I don't know what the problem is.
It would be really appreciated if you could tell me what the problem is.
I put the code on github because it would be good to see the whole code.
https://github.com/Jun-Kor/pokedex.git
The main problem is not your navigation, it's your Bloc, what happens is that when you enter the PokemonDetailsView page, with the BlocBuilder<PokemonDetailsBloc, PokemonDetailsState> it cannot find its provider (the one in the main) but, if we go directly there, you have it written, right ?
class _MyAppState extends State<MyApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Material App',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.red,
),
home: MultiBlocProvider( // here is the problem
providers: [
BlocProvider<PokemonBloc>(
create: (context) =>
PokemonBloc()..add(const PokemonPageRequestEvent(page: 0))),
BlocProvider<PokemonDetailsBloc>(
create: (context) => PokemonDetailsBloc()),
],
child: const PokedexView(),
),
);
}
}
Well, the MultiBlocProvider has to be the main parent that is going to provide for the whole MaterialApp, not be a child of it, I mean ? That's why the problem was asking for a Bloc provider, but I
it couldn't find one.
class _MyAppState extends State<MyApp> {
#override
Widget build(BuildContext context) {
return MultiBlocProvider( // change here
providers: [
BlocProvider<PokemonBloc>(
create: (context) =>
PokemonBloc()..add(const PokemonPageRequestEvent(page: 0))),
BlocProvider<PokemonDetailsBloc>(
create: (context) => PokemonDetailsBloc()),
],
child: MaterialApp(
title: 'Material App',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.red,
),
home: const PokedexView(),
),
);
}
}
I have started using PROVIDER to manage state in my app. I followed tutorials and wrapped my Material app with ChangeNotifierProvider.
Here's the code :
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (BuildContext context) => ListsProvider(),
child: MaterialApp(
title: 'WordsApp',
theme: ThemeData(
primarySwatch: Colors.blue,
),
initialRoute: StartingPage.id,
routes: {
StartingPage.id: (context) => StartingPage(),
RegistrationScreen.id: (context) => RegistrationScreen(),
},
),
);
}
}
This provider called "ListsProvider" takes care of "providing" lists that need to be displayed on different screens.
I have now created a second provider which I called "user_data_provider" and I now need to add it to my app too. It will take care of providing user data to many different screens.
How can I do that ?
To achive this you can use Multiprovider as shown below
Add this to the top of your app. If you need these obj everywhere.
#override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ChangeNotifierProvider<user_data_provider>(
create: (_) => user_data_provider(),
),
ChangeNotifierProvider<ListsProvider>(
create: (_) => ListsProvider(),
),
],
child: Builder(
builder: (BuildContext context) {
return MaterialApp(
//YOur code goes here
);
},
),
);
I come across these codes while exploring flutter as a beginner
FIRST CODE
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Helo world',
theme: ThemeData(primarySwatch: Colors.cyan),
home: HomePage(),
routes: {
"/fullPage": buildFullPage,
"/form": buildFormPage,
"/view": buildViewPage,
},
);
}
SECOND CODE
void main() => runApp(MaterialApp(
title: 'GridView Demo',
home: SplashScreen(),
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.red,
accentColor: Color(0xFF761322),
),
routes: <String, WidgetBuilder>{
SPLASH_SCREEN: (BuildContext context) => SplashScreen(),
HOME_SCREEN: (BuildContext context) => HomeScreen(),
//GRID_ITEM_DETAILS_SCREEN: (BuildContext context) => GridItemDetails(),
},
));
I NEED YOUR HELP IN KNOWING THESE MULTIPLE ROUTING
What these mean in FIRST CODE
home: HomePage(),
routes: {
"/fullPage": buildFullPage,
"/form": buildFormPage,
"/view": buildViewPage,
},
What these mean in SECOND CODE
home: SplashScreen(),
routes: <String, WidgetBuilder>{
SPLASH_SCREEN: (BuildContext context) => SplashScreen(),
HOME_SCREEN: (BuildContext context) => HomeScreen(),
//GRID_ITEM_DETAILS_SCREEN: (BuildContext context) => GridItemDetails(),
},