helpers 1.0.2 copy "helpers: ^1.0.2" to clipboard
helpers: ^1.0.2 copied to clipboard

outdated

Helpers is a tool that allows you to convert repetitive and tedious statements into easy-to-read and intuitive statements.

helpers #

My other APIs #


Features #

  • Better readability in code.
  • More intuitive statements.
  • Faster when declaring.
  • Shorten long and tedious statements.

Table of Contents #





Documentation #

Misc Helpers #

  • Misc Class: #

    It is a simplification of many instructions.
    double milliseconds = 200;

    //THEME
    Misc.theme(context);          //Helper
    Theme.of(context);

    Misc.textTheme(context);      //Helper
    Theme.of(context).textTheme;


    //CALLBACKS
    Misc.onLayoutRendered(() {}); //Helper
    WidgetsBinding.instance.addPostFrameCallback((_) {});


    //TIMER-ASYNC
    Misc.delayed(milliseconds, () {});  //Helper
    Future.delayed(Duration(milliseconds: milliseconds), () {});

    Misc.timer(milliseconds, () {});    //Helper
    Timer(Duration(milliseconds: milliseconds), () {});

    Misc.periodic(milliseconds, () {}); //Helper
    Timer.periodic(Duration(milliseconds: milliseconds), () {});

    await Misc.wait(milliseconds);      //Helper
    await Future.delayed(Duration(milliseconds: milliseconds), () {});


    //IF SENTENCES
    double height = Misc.ifNull(widget.height, 0.0);    //Helper
    double height = widget.height != null ? widget.height : 0.0;


    //TEXT
    Text(Misc.loremIpsum());
    Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, " +
        "sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.");

    Text(Misc.extendedLoremIpsum());
    Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, " +
        "sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." +
        "Ut enim ad minim veniam, quis nostrud exercitation " +
        "ullamco laboris nisi ut aliquip ex ea commodo consequat.");


    //SYSTEM (NOTE: SystemChrome NEED IMPORT FLUTTER SERVICES)
    Misc.setSystemOverlayStyle(...); //Helper
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(...));

    Misc.setSystemOverlay(SystemOverlay.portraitUp);     //Helper
    SystemChrome.setSystemUIOverlay([SystemUiOverlay.portraitUp]);

    Misc.setSystemOrientation(SystemOrientation.values); //Helper
    SystemChrome.setPreferredOrientations(DeviceOrientation.values)


  • SystemOverlay Class: #

    This is a simplification of the List type: SystemUiOverlay statement. It is used for the Misc.setSystemOverlayStyle() statement. IMPROVEMENT: By using the SystemOverlay you will not need to import SystemChrome, DeviceOrientation from the flutter services.

    SystemOverlay.values; //Helper
    SystemUiOverlay.values

    SystemOverlay.top;    //Helper
    [SystemUiOverlay.top]

    SystemOverlay.bottom; //Helper
    [SystemUiOverlay.bottom]

  • SystemOrientation Class: #

    This is a simplification of the List type: DeviceOrientation statement. It is used for the Misc.setSystemOrientation() statement. IMPROVEMENT: By using the SystemOrientation you will not need to import SystemChrome, DeviceOrientation from the flutter services.

    //INSTRUCTIONS
    SystemOrientation.values;         //Helper
    DeviceOrientation.values;

    SystemOrientation.portraitUp;     //Helper
    [DeviceOrientation.portraitUp];

    SystemOrientation.portraitDown;   //Helper
    [DeviceOrientation.portraitDown];

    SystemOrientation.landscapeLeft;  //Helper
    [DeviceOrientation.landscapeLeft];

    SystemOrientation.landscapeRight; //Helper
    [DeviceOrientation.landscapeRight]

  • GetColor Class: #

    It is a simplification of the Theme.of(context) statement.

    GetColor.primary(context);      //Helper
    Theme.of(context).primaryColor;

    GetColor.primaryLight(context); //Helper
    Theme.of(context).primaryColorLight;

    GetColor.accent(context);       //Helper
    Theme.of(context).accentColor;

    GetColor.disabled(context);           //Helper
    Theme.of(context).disabledColor;

    GetColor.scaffoldBackground(context); //Helper
    Theme.of(context).scaffoldBackgroundColor;

    ... //+20 COLORS



Size Helpers #

  • GetContext Class: #

    It is a simplification of the MediaQuery.of(context) statement.
    BuildContext context;


    GetContext.width(context);   //Helper
    MediaQuery.of(context).size.width;

    GetContext.height(context);  //Helper
    MediaQuery.of(context).size.height;

    GetContext.padding(context); //Helper
    MediaQuery.of(context).padding;

    GetContext.size(context);    //Helper
    MediaQuery.of(context).size;

    GetContext.data(context);    //Helper
    MediaQuery.of(context);

    ... //+10 MEDIAQUERIES

  • GetKey Class: #

    It is a simplification of the key.currentContext statement.
    GlobalKey key = GlobalKey();


    GetKey.width(key);   //Helper
    key.currentContext.size.width;

    GetKey.height(key);  //Helper
    key.currentContext.size.height;

    GetKey.size(key);    //Helper
    key.currentContext.size;

    GetKey.context(key); //Helper
    key.currentContext;

  • Margin Class: #

    It is a simplification of the EdgeInsets statement.
    double amount = 2.0;


    Margin.zero; //Helper
    EdgeInsets.zero;

    Margin.all(amount); //Helper
    EdgeInsets.all(amount);


    //SYMETRIC
    Margin.vertical(amount);   //Helper
    EdgeInsets.symmetric(vertical: amount);

    Margin.horizontal(amount); //Helper
    EdgeInsets.symmetric(horizontal: amount);

    Margin.symmetric(...);     //Helper
    EdgeInsets.symmetric(...);


    //ONLY
    Margin.top(amount);    //Helper
    EdgeInsets.only(top: amount);

    Margin.bottom(amount); //Helper
    EdgeInsets.only(bottom: amount);

    Margin.left(amount);   //Helper
    EdgeInsets.only(left: amount);

    Margin.right(amount);  //Helper
    EdgeInsets.only(right: amount);

    Margin.only(...);      //Helper
    EdgeInsets.only(...);

  • EdgeRadius Class: #

    It is a simplification of the BorderRadius statement.
    double amount = 2.0;


    EdgeRadius.zero;        //Helper
    BorderRadius.zero;

    EdgeRadius.all(amount); //Helper
    BorderRadius.all(Radius.circular(amount));


    //SYMETRIC
    EdgeRadius.vertical(top: amount, bottom: amount);   //Helper
    BorderRadius.vertical(
      top: Radius.circular(top),
      bottom: Radius.circular(bottom));

    EdgeRadius.horizontal(left: amount, right: amount); //Helper
    BorderRadius.horizontal(
      left: Radius.circular(left),
      right: Radius.circular(right));


    //ONLY
    EdgeRadius.only( //Helper
      topLeft: amount,
      topRight: amount,
      bottomLeft: amount,
      bottomRight: amount);
    BorderRadius.only(
      topLeft: Radius.circular(topLeft),
      topRight: Radius.circular(topRight),
      bottomLeft: Radius.circular(bottomLeft),
      bottomRight: Radius.circular(bottomRight));



Routes Helpers #

  • PushRoute Class: #

    It is a simplification of the Navigator.push() statement. TranparentPage solved the bug of MaterialPageRoute with a black background
    Widget page;
    BuildContext context;

    //EXAMPLE
    PushRoute.page(context, page); //Helper
    Navigator.push(context,
      withTransition
          ? MaterialPageRoute(builder: (_) => page)
          : PageRouteBuilder(pageBuilder: (_, __, ___) => page))

    //EXAMPLE
    PushRoute.transparentPage(context, page) //Helper
    Navigator.push(context,
      TransparentRoute(builder: (_) => page, transitionMs: transitionMs))



Widgets Helpers #

  • TextDesigned Widget: #

    IMPROVEMENT: If you don't assign it a color, it will automatically select the Theme.of(context).primaryColor.
    //EXAMPLE
    TextDesigned(
      "Hello",
      size: 20,
      bold: true,
      underline: true,
      color: Colors.white,
    );

    //WIDGET RETURN THAT
    Text(
      "Hello",
      style: TextStyle(
        fontSize: 20,
        color: Colors.white,
        fontWeight: FontWeight.bold,
        decoration: TextDecoration.underline,
      ),
    );


  • RemoveScrollGlow Widget: #

    Eliminate the Splash Effect or Glow Effect when reaching the limit of a PageView, ScrollView, ListView, etc.
    //EXAMPLE
    RemoveScrollGlow(child: PageView(...));

    //WIDGET RETURN THAT
    return NotificationListener<OverscrollIndicatorNotification>(
      onNotification: (OverscrollIndicatorNotification overscroll) {
        overscroll.disallowGlow();
        return;
      },
      child: PageView(...),
    );

  • DismissKeyboard Widget: #

    Tapping on a Widget will apply the FocusScope to it and hide the keyboard.
    //EXAMPLE
    DismissKeyboard(child: Container());

    //WIDGET RETURN THAT
    return GestureDetector(
      onTap: () {
        FocusScopeNode focus = FocusScope.of(context);
        if (!focus.hasPrimaryFocus) focus.requestFocus(FocusNode());
      },
      child: Container(),
    );
  • SizeBuilder Widget: #

    It works like the LayoutBuilder but only returns the maxWidth and maxHeight
    //EXAMPLE
    SizeBuilder(builder: (width, height) {
      Size layout = Size(width, height);
      return Container(
        width: width,
        height: height,
        color: Colors.red,
      );
    });

    //WIDGET RETURN THAT
    return LayoutBuilder(builder: (_, constraints) {
      return widget.builder(constraints.maxWidth, constraints.maxHeight);
    });
  • TransparentBox Widget: #

    It is normally used within a GestureDetector to detect the tap.
    //EXAMPLE
    GestureDetector(
      onTap: () => print("hello"),
      child: TransparentBox(child: Text("Hello!"))
    )

    //WIDGET RETURN THAT
    return Container(color: Colors.transparent);
  • ExpandedSpacer Widget: #

    It is used as a spacer within a [Row] or [Column].
    //EXAMPLE
    Column(children: [
      Expanded(child: Icon(Icons.chevron_left)),
      ExpandedSpacer(),
      ExpandedSpacer(),
      Expanded(child: Icon(Icons.chevron_right)),
    ])

    //WIDGET RETURN THAT
    return Expanded(child: SizedBox());
  • ExpandedTap Widget: #

    It is normally used for icons or texts within a [Row].
    //EXAMPLE
    Row(children: [
      ExpandedTap(
        onTap:  () => print("CANCEL"),
        child: TransparentBox(
          child:Center(
            child: TextDesigned(
              "CANCEL",
              color: Colors.white,
              bold: true,
            ),
          ),
        ),
      ),
      ExpandedTap(
        onTap: () => print("CALL CALLBACK"),
        child: TransparentBox(
          child: Center(
            child: TextDesigned(
              "OK",
              color: Colors.white,
              bold: true,
            ),
          ),
        ),
      ),
    ])

    //WIDGET RETURN THAT
    return Expanded(
      child: GestureDetector(
        onTap: onTap,
        child: child,
      ),
    );
  • SafeAreaColor Widget: #

    Used to create your own AppBar
    //EXAMPLE
    Column(children: [
      SafeAreaColor(
        color: Colors.white,
        height: 60,
        child: Center(TextDesigned("APP BAR", bold: true)),
      ),
      ExpandedSpacer(),
      Container(
        height: 60,
        color: Colors.white,
        width: double.infinity,
        child: Center(TextDesigned("BOTTOM NAV", bold: true)),
      ),
    ])

    //WIDGET RETURN THAT
    return Container(
      color: color,
      width: width,
      child: SafeArea(
        child: Container(
          height: height,
          child: child,
        ),
      ),
    );
  • AnimatedInteractiveViewer Widget: #

    It is an InteractiveViewer with enhanced double tap zooming.
    //EXAMPLE
    AnimatedInteractiveViewer(
      child: Image.network(
          "https://avatars0.githubusercontent.com/u/65832922?s=460&u=67f908b168ae2934f9e832af2180825c6b2f0e37&v=4"),
    ),



Transition Helpers #

  • BooleanTween Widget: #

    It is an AnimatedBuilder. If it is TRUE, it will execute the Tween from begin to end (controller.forward()), if it is FALSE it will execute the Tween from end to begin (controller.reverse())

    IT IS THE CORE OF ALL TRANSITIONS.

    //EXAMPLE
    bool animate = true;

    BooleanTween(
      animate: animate,
      tween: ColorTween(begin: Colors.blue, end: Colors.red),
      builder: (dynamic color) {
        return Container(color: color);
      },
    );

  • OpacityTransition Widget: #

    Show or hide a Widget with an Fade Transition from a Boolean variable.
    //EXAMPLE
    bool visible = true;

    OpacityTransition(
      visible: visible,
      child: Container(),
    );

  • SwipeTransition Widget: #

    Show or hide a Widget with an Slide Transition from a Boolean variable.
    //EXAMPLE
    bool visible = true;

    SwipeTransition(
      visible: visible,
      direction: SwipeDirection.fromTop,
      child: Center(child: TextDesigned("Swipe Transition", bold: true)),
    ),

  • TurnTransition Widget: #

    Turn a Widget with a Boolean variable.
    //EXAMPLE
    bool turn = true;

    TurnTransition(
      turn: turn,
      child: Icon(Icons.chevron_left),
    );
43
likes
0
pub points
93%
popularity

Publisher

verified publisherfelipemurguia.com

Helpers is a tool that allows you to convert repetitive and tedious statements into easy-to-read and intuitive statements.

Repository (GitHub)
View/report issues

License

unknown (LICENSE)

Dependencies

flutter

More

Packages that depend on helpers