I got this error:
The function 'StateProvider' isn't defined.
Try importing the library that defines 'StateProvider', correcting the name to the name of an existing function, or defining a function named 'StateProvider'.
This is my code:
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:riverpod/home_screen.dart';
// final nameProvider = Provider.family<String>((ref, ) => 'caro');
final nameProvider = StateProvider((ref)=> 'caro');
// final nameProvider = Provide<String>((ref) => 'caro');
void main() {
runApp(const ProviderScope(child: MyApp()));
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
useMaterial3: true,
primarySwatch: Colors.blue,
),
home: const MyHomePage(),
);
}
}
Why is this happening if I'm using flutter_riverpod: ^2.1.3?
How can I solve this issue?
Thanks for any help you can provide
I see no fault. I've tried your code myself.
Perhaps a simple run of the command: flutter pub get.
The only thing I don't know is what the third import is. I.e. import 'package:riverpod/home_screen.dart'; as that is not part of the "real" riverpod package.
Related
I'm a bit at loss here.
return MaterialApp(
title: 'App Title',
theme: ThemeData(brightness: Brightness.dark),
initialRoute: '/',
routes: SOMETHING_HERE,
);
I want to push SOMETHING_HERE from a different file, but I can't seem to push a correct value there.
Other file (attempt):
import '../screens/home.dart';
import '../screens/charts.dart';
class Routes {
factory Routes(context) {
Map<String, Widget Function(BuildContext)> _routes;
_routes = {
'/': (context) => ScreenHome(),
'/charts': (context) => ScreenCharts(),
};
return _routes;
}
}
This doesn't work cause it says:
The argument type 'Routes' can't be assigned to the parameter type 'Map<String, (BuildContext) → Widget>'
OF course I can just pass a Map to this argument but I want to define my routes in a separate file.
Any suggestions on how to accomplish this?
I just had the same problem and found the solution.
You don't need to create a class, just create a var that equals your routes Map
main.dart:
import 'package:flutter/material.dart';
import './custom_routes.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(brightness: Brightness.dark),
initialRoute: '/',
routes: customRoutes,
);
}
}
custom_routes.dart:
import 'package:flutter/material.dart';
import '../screens/home.dart';
import '../screens/charts.dart';
var customRoutes = <String, WidgetBuilder>{
'/': (context) => ScreenHome(),
'/charts': (context) => ScreenCharts(),
};
**
There is another way you can try if you wish
**
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: LoginScreen.id,
routes: route,
);
},
}
Create your route dart file. No need to create a class
var route = <String, WidgetBuilder>{
LoginScreen.id: (_) => const LoginScreen(),
// call the classes
Dashboard.id: (_) => const Dashboard(),
// with value
Dashboard.id: (_) => const Dashboard(value: ''),
};
If you don't use call by id. You can do that as well. Also you can pass values shown example
Just create any function with return of Map<String, WidgetBuilder>, here i will show how to do that with pass data to your routes class:
1- Create new file routes.dart, this full code (i used my custom variables like serverToken, notifierThemeMode) to fully explain the process:
import 'package:rxdart/rxdart.dart';
import 'package:flutter/material.dart';
import 'package:path/to/home_screen.dart';
import 'package:path/to/login_screen.dart';
class AppRoutes{
// get initial route
static getInitialRoute({String? serverToken}){
return serverToken == null
? LoginScreen.routeName
: HomeScreen.routeName;
}
// get all app routes
static Map<String, WidgetBuilder> getRoutes({
required BehaviorSubject<ThemeMode?> notifierThemeMode,
required BehaviorSubject<Locale?> notifierLocale,
}){
return {
HomeScreen.routeName: (BuildContext context) => HomeScreen(
notifierThemeMode: notifierThemeMode,
),
LoginScreen.routeName: (BuildContext context) => LoginScreen(
notifierLocale: notifierLocale,
),
}
}
2- In MaterialApp widget call the previous functions:
MaterialApp(
...
routes: AppRoutes.getRoutes(
notifierThemeMode: _notifierThemeMode,
notifierLocale: _notifierLocale
),
initialRoute: AppRoutes.getInitialRoute(
serverToken: _appServerToken
),
);
I'm trying to show the apps content based on the user location. For this, I'm trying to get the languageCode from they country, but it's not working. The retrieved languageCode corresponds to the device language instead the country.
I'm doint this:
#override
Widget build(BuildContext context) {
return ScopedModel<UserModel>(
model: UserModel(),
child: ScopedModelDescendant<UserModel>(builder: (context, child, snapshot) {
return MaterialApp(
title: "APP",
debugShowCheckedModeBanner: false,
localizationsDelegates: [
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
],
supportedLocales: allTranslations.supportedLocales(),
);
}));
}
Where my supportedLocales are a list with all country/language code:
Iterable<Locale> supportedLocales() => [
const Locale('ar','AE'),
const Locale('ar','BH'),
const Locale('ar','DZ'),
const Locale('ar','EG'),
const Locale('ar','IL'),
const Locale('ar','IQ'),
const Locale('ar','JO'),
const Locale('ar','KW'),
const Locale('ar','LB'),
const Locale('ar','LY'),
const Locale('ar','MA'),
const Locale('ar','MR'),
const Locale('ar','OM'),
const Locale('ar','PS'),
const Locale('ar','QA'),
...
I'm trying get the correct languageCode doing this:
String language = Localizations.localeOf(context).languageCode;
But the method always ignores the location and takes the device default language :(
E.g: my friend lives in Brazil and his device are with the en-CA language and he can't see the brazilian content becaus the language code always is 'en' instead 'pt'.
import dart.io;
...
final localeStr = Platform.localeName; // 'en-US'
I followed the steps here to start the translation of my application. I used the .arb file method.
I understand the application get translated when changing the language of the OS, but is it possible, within the application, to toggle the language and make the application dynamically translated?
If so, what should I do? I tried to call the 'load' method, but nothing happened.
Thanks for your help.
Set Locale of MaterialApp and then when you want to change just call
setState(() {
_locale = Locale('b'); // Desired locale
});
Below code changes Locale in every 5 seconds.
Locale _locale;
#override
void initState() {
_locale = Locale('a');
Timer.periodic(Duration(seconds: 5), (t) {
setState(() {
_locale = _locale == Locale('a') ? Locale('b') : Locale('a');
});
});
super.initState();
}
#override
Widget build(BuildContext context) {
return MaterialApp(
supportedLocales: [
const Locale('a'),
const Locale('b'),
const Locale('c'),
],
localizationsDelegates: [
MaterialLocalizationDelegateKa(),
const InfosLocalizationsDelegate(),
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
],
locale: _locale,
);
}
I used flutter_i18n plugin (Android Studio) to generate i18n.dart(class S) and S.of(context).locale_msg will return the locale string. The main code is shown below.
Language should be changed programmatically by invoking onLocaleChange(locale) when click the button in HomePage. It works well in Android simulator, but won't change language in iOS simulator. Wonder what's wrong with my code?
class _PaperMoonAppState extends State<PaperMoonApp> {
SpecifiedLocalizationDelegate _localeOverrideDelegate;
void onLocaleChange(Locale locale) {
setState(() {
if (appVars.appConfig.changeLanguage(locale)) {
_localeOverrideDelegate = new SpecifiedLocalizationDelegate(locale);
appVars.saveConfig(); //print save config file...
}
});
}
#override
void initState() {
SpecifiedLocalizationDelegate.onLocaleChange = this.onLocaleChange;
appVars.loadConfig().then((AppConfig _config) {
appVars.appConfig = _config;
setState(() {
_localeOverrideDelegate =
new SpecifiedLocalizationDelegate(appVars.appConfig.getLocale());
});
});
_localeOverrideDelegate =
new SpecifiedLocalizationDelegate(Locale('zh', ''));
super.initState();
}
#override
Widget build(BuildContext context) {
print(_localeOverrideDelegate.overriddenLocale);
return MaterialApp(
debugShowCheckedModeBanner: false,
title: "Paper Moon",
color: Colors.blueAccent,
localizationsDelegates: [
_localeOverrideDelegate,
S.delegate,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate
],
supportedLocales: const <Locale>[
Locale("ja", ""),
Locale("en", ""),
Locale("zh", ""),
],
localeResolutionCallback:
S.delegate.resolution(fallback: _localeOverrideDelegate.overriddenLocale),
home: HomePage(),
// routes: _buildRoutes(),
);
}
}
Custom LocalizationDelegate:
class SpecifiedLocalizationDelegate
extends LocalizationsDelegate<WidgetsLocalizations> {
//class static vars:
//onLocaleChange should be bind to MaterialApp function containing setState().
static LocaleChangeCallback onLocaleChange;
// for instance
final Locale overriddenLocale;
const SpecifiedLocalizationDelegate(this.overriddenLocale);
#override
bool isSupported(Locale locale) => overriddenLocale != null;
#override
Future<WidgetsLocalizations> load(Locale locale) =>
S.delegate.load(overriddenLocale);
#override
bool shouldReload(SpecifiedLocalizationDelegate old) => true;
}
Based on your code, the only thing that seems to be missing is this:
open ios/Runner/Info.plist and add:
<key>CFBundleLocalizations</key>
<array>
<string>ja</string>
<string>en</string>
<string>zh</string>
</array>
As far I as know, by now (march/2019), flutter doesn't yet add automatically the list of supported languages to this file.
I'm using i18n_extensions, but with the same issue...
What worked for me, was use this:
supportedLocales: const <Locale>[
const Locale('en'),
const Locale('pt'),
],
Instead of this:
supportedLocales: const <Locale>[
const Locale('en', 'US'),
const Locale('pt', 'BR'),
],
And then, my i18n.dart. file i've change from this:
extension Localization on String {
static final _t = Translations.from("en_us", {
passwordInput: {
"en_us": "Password",
"pt_br": "Senha",
},
searchingTitle: {
"en_us": "Scanning for devices...",
"pt_br": "Procurando dispositivos...",
},
...
To this:
extension Localization on String {
static final _t = Translations.from("en", {
passwordInput: {
"en": "Password",
"pt": "Senha",
},
searchingTitle: {
"en": "Scanning for devices...",
"pt": "Procurando dispositivos...",
},
It works fine for me.
I am creating a flutter app with blocs.
I followed the code available in Flutter login with blocs
It works as expected,
if my app has no routes defined
class App extends StatelessWidget {
Widget build(BuildContext context) {
return Provider(
child: MaterialApp(
title: 'Log Me In!',
home: Scaffold(
body: LoginScreen(),
),
),
);
}
}
but when I change my app to use routes
class App extends StatelessWidget {
Widget build(BuildContext context) {
return MaterialApp(
title: 'Log Me In!',
routes: {
'/':(context) => Provider(
child: Scaffold(
body: LoginScreen(),
),
)
},
);
}
}
bloc code
class Bloc extends Object with Validators {
final _email = BehaviorSubject<String>();
final _password = BehaviorSubject<String>();
// retrieve data from stream
Stream<String> get email => _email.stream.transform(validateEmail);
Stream<String> get password => _password.stream.transform(validatePassword);
Stream<bool> get submitValid => Observable.combineLatest2(email, password, (e, p) => true);
// add data to stream
Function(String) get changeEmail => _email.sink.add;
Function(String) get changePassword => _password.sink.add;
submit() {
final validEmail = _email.value;
final validPassword = _password.value;
print('$validEmail and $validPassword');
}
dispose() {
_email.close();
_password.close();
}
}
Observable.combileLatest2 is not streaming the data (but it streams error though).
Using Rxdart version 0.19.0 and
Flutter 1.0.0 • channel beta •https://github.com/flutter/flutter.git
Framework • revision 5391447fae (6 days ago) • 2018-11-29 19:41:26-0800
Engine • revision 7375a0f414Tools • Dart 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)
Am I doing something wrong here?
thanks in advance
After lot of trial, I found that when I use routes for the navigation, flutter will build the page multiple times and thats the expected behavior refer here for detailed answer
So when it builds the page multiple times, it was creating multiple Observables on the bloc as it was creating new instance of Bloc every time it creates the Page route.
So when I modify the code
class App extends StatelessWidget {
final login = Provider(
child: Scaffold(
body: LoginScreen(),
),
);
Widget build(BuildContext context) {
return MaterialApp(
title: 'Log Me In!',
routes: {
'/':(context) => login,
},
);
}
}
it worked perfectly.
The other way is to achieve is to create a stateful widget and do the initialization in the init method.