mit_x 2.2.0

Open screens/snackbars/dialogs/drawer without context /open and close drawer or end drawer/check form is valid or save it, with MitX.

MitX

Utils

• see this utils in this link Click Here

now in v 0.0.4

• you can open drawer or end drawer example

  Scaffold(
    key:MitX.scaffoldKey,
    drawer: Drawer(),
    body: IconButton(
            icon: const Icon(Icons.add),
            onPressed: () {
                MitX.openDrawer();
        },
    ),
  )

Localization

• first create class implements Translations

 class LangController implements Translations {
  @override
  Map<String, Map<String, String>> get keys => {
        'en': {
            'test':'test',
        }
        'ar': {
            'test':'تست',
        }
      };
}

• second call it in MitXMaterialApp

 MitXMaterialApp(
    translations: LangController(),
    locale: Locale('en', 'US'), // translations will be displayed in that locale
    fallbackLocale: Locale('en', 'UK'), // specify the fallback locale in case an invalid locale is selected.
 );

Using translations

• Just append .tr to the specified key and it will be translated, using the current value of MitX.locale and MitX.fallbackLocale.

    Text('test'.tr)

• Using translation with singular and plural

   var products = [];
   Text('singularKey'.trPlural('pluralKey', products.length, Args));

• Using translation with parameters

   import 'package:get/get.dart';


Map<String, Map<String, String>> get keys => {
    'en_US': {
        'logged_in': 'logged in as @name with email @email',
    },
    'es_ES': {
       'logged_in': 'iniciado sesión como @name con e-mail @email',
    }
};

Text('logged_in'.trParams({
  'name': 'Jhon',
  'email': '[e-mail]'
  }));

Locales

• Pass parameters to MitXMaterialApp to define the locale and translations.

Change locale

• Call MitX.updateLocale(locale) to update the locale. Translations then automatically use the new locale.

    var locale = Locale('en', 'US');
    MitX.updateLocale(locale);

System locale

• To read the system locale, you could use MitX.deviceLocale.

   return MitXMaterialApp(
    locale: MitX.deviceLocale,
);

Route management

to navigate or generate navigation

• in flutter

    MaterialPageRoute(builder: (context) => const HomeView());

• but now you can use it with the same parameters

     mitXMaterialPageRoute(page: const FiveDaysForecastView());

If you are going to use routes/snackbars/dialogs/bottomsheets without context, MitXX is excellent for you too, just see it:

MitXMaterialApp( // not needed MaterialApp 
  home: MyHome(),
)

Navigate to a new screen:

MitX.to(NextScreen());

Navigate to new screen with name. See more details on named routes here

MitX.toNamed('/details');

To close snackbars, dialogs, bottomsheets, or anything you would normally close with Navigator.pop(context);

MitX.back();

To go to the next screen and no option to go back to the previous screen (for use in SplashScreens, login screens, etc.)

MitX.off(NextScreen());

To go to the next screen and cancel all previous routes (useful in shopping carts, polls, and tests)

MitX.offAll(NextScreen());

Noticed that you didn't have to use context to do any of these things? That's one of the biggest advantages of using MitX route management. With this, you can execute all these methods from within your controller class, without worries.

More details about route management

on your controller/bloc/stateful/stateless class:

• Alert this way not working in version < 1.0 you must use MitXPages to use this ways

print(MitX.parameters['id']);
// out: 187
print(MitX.parameters['name']);
// out: MitX

d data on route name

MitX.toNamed("/profile/34954");

On second screen take the data by parameter

print(MitX.parameters['user']);
// out: 34954

or send multiple parameters like this

MitX.toNamed("/profile/34954?flag=true&country=italy");

or

var parameters = <String, String>{"flag": "true","country": "italy",};
MitX.toNamed("/profile/34954", parameters: parameters);

On second screen take the data by parameters as usually

print(MitX.parameters['user']);
print(MitX.parameters['flag']);
print(MitX.parameters['country']);
// out: 34954 true italy

Navigation without context

drawer

Now you can use scaffold key and open drawer

  Scaffold(
      key: MitX.scaffoldKey,
      drawer: Drawer(),
      ...
    ),

    MitX.openDrawer();
// if you generated key you can use
// yourKey.openDrawer(); or openDrawer.openEndDrawer(); 
// you can close it by yourKey.closeDrawer(); 
// if use my key you can use MitX.closeDrawer();

form key

Now you can use form key and valid or save form

  Form(
      key: MitX.formKey,
      ...
    ),
    MitX.saveForm();
    MitX.isValidForm();
    // 
// if form key with your key use
// yourKey.isValid();
// yourKey.save();

SnackBars

To have a simple SnackBar with Flutter, you must get the context of Scaffold, or you must use a GlobalKey attached to your Scaffold

final snackBar = SnackBar(
  content: Text('Hi!'),
  action: SnackBarAction(
    label: 'I am a old and ugly snackbar :(',
    onPressed: (){}
  ),
);
// Find the Scaffold in the widget tree and use
// it to show a SnackBar.
Scaffold.of(context).showSnackBar(snackBar);

With MitX:

   MitX.showSnackbar(MitXSnackBar());
   //or
   MitX.snackbar('title', 'message');

If you prefer the traditional snackbar, or want to customize it from scratch, including adding just one line (MitX.snackbar makes use of a mandatory title and message), you can use MitX.rawSnackbar(); which provides the RAW API on which MitX.snackbar was built.

Dialogs

To open dialog:

MitX.dialog(YourDialogWidget());

To open default dialog:

MitX.defaultDialog(
  onConfirm: () => print("Ok"),
  middleText: "Dialog made in 3 lines of code"
);

You can also use MitX.generalDialog instead of showGeneralDialog.

For all other Flutter dialog widgets, including cupertinos, you can use MitX.overlayContext instead of context, and open it anywhere in your code. For widgets that don't use Overlay, you can use MitX.context. These two contexts will work in 99% of cases to replace the context of your UI, except for cases where inheritedWidget is used without a navigation context.

BottomSheets

MitX.bottomSheet is like showModalBottomSheet, but don't need of context.

Change Theme

Please do not use any higher level widget than MitXMaterialApp in order to update it. This can trigger duplicate key. A lot of people are used to the prehistoric approach of creating a "ThemeProvider" widget just to change the theme of your app, and this is definitely NOT necessary with MitX_X™.

You can create your custom theme and simply add it within MitX.changeTheme without any boilerplate for that:

MitX.changeTheme(ThemeData.light());

If you want to create something like a button that changes the Theme in onTap, you can combine two MitX_X™ APIs for that:

• The api that checks if the dark Theme is being used.
• And the Theme Change API, you can just put this within an onPressed:

MitX.changeTheme(MitX.isDarkMode? ThemeData.light(): ThemeData.dark());

When .darkmode is activated, it will switch to the light theme, and when the light theme becomes active, it will change to dark theme.