This is Grock

This is an excellent Flutter package mate 💯💯💯💯💯💯💯💯💯💯💯💯💯💯💯

Firstly 🤫

  return MaterialApp(
    debugShowCheckedModeBanner: false,
    navigatorKey: Grock.navigationKey, // added line
    scaffoldMessengerKey: Grock.scaffoldMessengerKey, // added line
    title: 'Material App',
    home: Home(),
  );

Grock Restfull Api Services (Dio Helper)

Check it out below and start using it, my friend!

• Initialized

void main() {
  GrockDioServices.instance.init(
    baseUrl: 'https://jsonplaceholder.typicode.com',
    connectTimeout: 5000,
    receiveTimeout: 3000,
    logger = GrockDioLogger.default(),
  );
  runApp(MyApp());
}

• and use Api Request

----------------- request example -----------------

final request = await GrockDioServices.request(
 method: GrockDioType.get,
 path: '/posts',
 queryParameters: {"userId": 1},
).grockResponseHandler(
  success: (response) => Model.fromJson(response.data),
  error: (err) => Toast.show(err.toString()),
  loading: () => print("loading"),
  done: () => print("done"),
);

NO CONTEXT NAVIGATIONS 😱

Grock.to || toRemove || back()

GrockContainer(
  onTap: (){
    // for Navigator.push(...)
    Grock.to(Nextpage());
    Grock.to(NextPage(), type: NavType.bottomToTop); // optional navigate animation

    // for Navigator.pushAndRemoveUntil(context, newRoute, (route) => false)
    Grock.toRemove(NextPage());

    // for Navigator.of(context).pop()
    Grock.back();
    Grock.back(result: "Return Object") // optional return object

  },
)

Widgets 👊 🚀

GrockContainer

GrockContainer(
  isKeyboardDismiss: true // default true, optional keyboard dismiss
  isTapAnimation: true //default true, optional tap animation
  onTap: ()=>print("tapped"),
  child: Text("On Tap Container")
)

GrockButton

GrockButton(
  child: const Text("GrockButton"),
  onTap: (){},
),

GrockFullScreenDialog

InkWell(
  onTap: (){
    Grock.fullScreenDialog(
      child: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.transparent,
          elevation: 0,
          actions: [
            /// Close Grock Full Screen Dialog
            IconButton(
              icon: const Icon(Icons.close),
              onPressed: ()=>Grock.closeGrockOverlay(),
            )
          ],
        ),
        body: Center(
          child: const Image.network('https://picsum.photos/250?image=9'),
        ),
      )
    );
  },
  child: const Image.network('https://picsum.photos/250?image=9'),
),

GrockFullScreenModal

InkWell(
  onTap: (){
    Navigator.of(context).push(
      GrockFullScreenModalSheet(
        builder: (context, animation, secondaryAnimation) => Container(
            color: Colors.white,
            alignment: Alignment.topRight,
            width: double.infinity,
            height: double.infinity,
            child: Scaffold(
              appBar: AppBar(
                backgroundColor: Colors.transparent,
                elevation: 0,
                actions: [
                  /// Close Grock Full Screen Modal
                  IconButton(
                    icon: const Icon(Icons.close),
                    onPressed: ()=>Grock.back(),
                  )
                ],
              ),
              body: Column(
                children: [
                  TextField(
                    decoration: const InputDecoration(
                      hintText: "Search",
                      border: OutlineInputBorder(),
                    ),
                  ),
                  const SizedBox(height: 20),
                  Expanded(
                    child: ListView.builder(
                      itemCount: 20,
                      itemBuilder: (context, index) => ListTile(
                        title: Text("List Item $index"),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        isFadeTranssition: true,
        isSlideTranssition: true,
      ),
    );
  },
  child: const Image.network('https://picsum.photos/250?image=9'),
),

GrockDirectSelectionMenu

GrockDirectSelectionMenu(
  width: double.infinity,
  margin: const EdgeInsets.all(20),
  hintText: "Selection Data",
  value: listActiveIndex,
  onChanged: (index) {
    setState(() {
      listActiveIndex = index;
    });
  },
  items: List.generate(
    list.length,
    (index) => Text(list[index]),
  ),
  /// [Customize your own widget]
  // child: Row(
  //   mainAxisAlignment: MainAxisAlignment.spaceBetween,
  //   children: [
  //   Text(listActiveIndex == null ? "Please selection data" : list[listActiveIndex!]),
  //   listActiveIndex == null ? const Icon(Icons.menu) : Text(list[listActiveIndex ?? 0])
  //   ],
  // ),
 ),

GrockTimer

/// final timerController = GrockTimerController();
GrockTimer(
  controller: timerController,
  startTime: const Duration(seconds: 10),
  endTime: const Duration(seconds: 0),
),

GrockMenu [IOS Style]

GrockMenu(
  items: [
    GrockMenuItem(
      text: 'Copy',
      trailing: const Icon(Icons.copy,size: 20,),
      onTap: (){
        // Item Tap
        GrockMenu.close(); // close menu
      }
    ),
    GrockMenuItem(
      text: 'Share',
      trailing: const Icon(Icons.ios_share_rounded,size: 20,),
    ),
  ],
  child: const Icon(CupertinoIcons.ellipsis_circle_fill,color: Colors.blue,),
  onTapClose: true, // Close menu when tapping GrockMenuItem, [true by default]
  onTap: (value){
   switch (value) {
    case 0:
      print("Tap Copy");
      break;
    case 1:
      print("Tap Share");
      break;
    default:
      print("Tap Default");
      break;
   }
  },
  dividerBuilder: (context,index)=>index == 1 ? 
  const Divider(height: 0,color: Colors.red,thickness: 2,) : 
  const Divider(color: CupertinoColors.separator,thickness: 1,height: 0,),
)

GrockDropdownButton [IOS Style]

GrockDropdownButton(
  items: [
    for (var item in items)
      GrockDropdownMenuItem(
        child: Text(item),
        onPressed: (String? newValue) {
          setState(() {
            currentValue = newValue;
          });
          Grock.back();
        },
        decoration: BoxDecoration(
          color: currentValue == item
              ? Colors.grey.shade200
              : Colors.white,
          ),
        trailingWidget: currentValue == item
              ? const Icon(Icons.check, color: Colors.green)
              : null,
        ),
      ],
  value: currentValue,
  hintText: "Selection",
),

GrockFadeAnimation

GrockFadeAnimation(
  position: PositionF.bottom,
  duration: Duration(seconds: 2),
  curve: Curves.bounceOut,
  child: child(),
)

GrockScaleAnimation

GrockScaleAnimation(
  alignment: Alignment.center,
  duration: Duration(seconds: 2),
  curve: Curves.fastOutSlowIn,
  begin: 0.8,
  end: 1.0,
  addListener: (animatedController) {
    if (animatedController.isCompleted) {
      animatedController.reverse();
    } else if (animatedController.isDismissed) {
      animatedController.forward();
    }
  },
  child: child(),
)

GrockRotateAnimation

GrockRotateAnimation(
  alignment: Alignment.center,
  duration: Duration(seconds: 1),
  curve: Curves.fastOutSlowIn,
  begin: 0.0,
  end: 1.0,
  addListener: (animatedController) {
    if (animatedController.isCompleted) {
      animatedController.reverse();
    } else if (animatedController.isDismissed) {
      animatedController.forward();
    }
  },
  child: child(),
)

GrockCrossFade

GrockCrossFade(
  firstChild: child(),
  secondChild: child2(),
  duration: Duration(milliseconds: 500.milliseconds),
  state: isShow ? GrockCrossFadeState.first : GrockCrossFadeState.second,
  type: GrockCrossFadeType.scaleRotateFade,
)

GrockShimmer

CachedNetworkImage(
  imageUrl: "https://picsum.photos/200/300",
  imageBuilder: (context, imageProvider) => Container(
    width: 200.0,
    height: 300.0,
    decoration: BoxDecoration(
      image: DecorationImage(
        image: imageProvider,
        fit: BoxFit.cover,
      ),
    ),
  ),
  placeholder: (context, url) => GrockShimmer(
    child: Container(
      width: 200.0,
      height: 300.0,
      decoration: BoxDecoration(
        color: Colors.grey,
      ),
    ),
  ),
),

GrockGlassmorphism [IOS Style]

GrockGlassMorphism(
  blur: 20,
  opacity: 0.2,
  borderRadius: BorderRadius.circular(12),
  child: Image(".../images.png") or Container(child: Icon(Icons.search)),
  color: Colors.white,
),

GrockKeyboardClose

return GrockKeyboardClose(
  child: Scaffold(
    // Scaffold on tap and close keyboard
    body: TextField(

    ),
  ),
);

GrockScrollEffect

return GrockScrollEffect(
  child: Scaffold(
    //android drag and scroll effect disable
    body: ListView.builder(
      ....
    ),
  ),
);

GrockHList

return GrockHList(
  itemCount: 10,
  itemHeight: 55,
  itemWidth: 55,
  listHeight: 80,
  itemBuilder: (context, index) {
    return Container();
  },
);

GrockInfoWidget

return GrockInfoWidget(
  msg: "Grock Info Popup Tooltip"
);

GrockWidgetSize

return GrockWidgetSize(
  callback: (Size size, Offset offset){
    print("Size: $size");
    print("Offset: $offset");
  },
  child: Container(),
);

GrockCustomLoadingWidget or Grock.loadingPopup()

Grock.loadingPopup(
  backgroundColor: Colors.black.withOpacity(0.5),
  color: Colors.white,
  borderRadius: BorderRadius.circular(12)
);
return GrockCustomLoadingWidget(
  backgroundColor: Colors.black.withOpacity(0.5),
  color: Colors.white,
  borderRadius: BorderRadius.circular(12)
);

Grock Internet Check Function

  //Splash Screen initState
  @override
  void initState() {
    super.initState();
    Grock.checkInternet();
  }

Snackbar and Dialog and Toast (BUT NO CONTEXT 😁)

Grock.snackBar [IOS Style]

TextButton(
  child: const Text('No Context Snackbar'),
    Grock.snackBar(
      title: "Snackbar",
      description: "Snackbar content",
      blur: 20,
      opacity: 0.2,
      leading: Icon(Icons.error),
      curve: Curves.elasticInOut,
      // ... vs parameters
    ),
),

Grock.dialog

TextButton(
  child: const Text('No Context Dialog'),
  onPressed: () {
    Grock.dialog(builder: (_) {
      return const AlertDialog(
        title:  Text('Dialog'),
        content:  Text('Dialog content'),
      );
    });
  },
),

Grock.toast

GrockButton(
  color: Colors.white,
  child: const Text(
     "Show Toast",
  ),
  onTap: () => Grock.toast(
    text: "This is a toast",
  ),
),

List Extension

['data','data1'].mapIndexed((value, index){})
['data','data1'].forLoop((value, index){})
['data','data1'].mapIndexedWhere((value, index))
['data','data1'].mapFiltered((value){})

String Extension

String.capitalize
String.capitalizeEach
String.capitalizeEachFirst
String.capitalizeEachFirstLower
String.capitalizeEachLower
String.capitalizeEachLowerFirst
String.toDate
String.filter
String.filterNumber
String.forEach
String.forEachFirst
String.forEachFirstLower
String.isPhoneNumber
String.isPhoneNumberWithCountryCode
String.isPhoneNumberWithCountryCodeAndSpace
String.isTurkeyPhoneNumber
String.isTurkeyPhoneNumberWithCountryCode
String.isTurkeyPhoneNumberWithCountryCodeAndSpace
String.isEmail
String.isUrl
String.isUrlWithSpace
String.isEmpty
String.dateTime
String.isDateTimeFormat
String.isSearch(istanbul)
String.toTextWidget()

Widget Tools 🤩

Widget Extensions

Container().material(),
Container().visible(val),
Container().disable(disable),
Container().disableOpacity(disable and opacity: 0.2),
Container().expanded(),
Container().size(width,height),
Container().padding(all: 24),
Container().rotate(value: 0.2),
Container().alignment(alignment),
Container().tooltip(msg),
Container().onTap((){}),
Container().bgBlur(10),
Container().borderRadius(10),
Container().center(),
Container().scrollable(),
Container().decoration(BoxDecoration),
Container().forgroundGradient(),
Container().oval(),
ExpansionTile().removeDivider(),
Container().colored(Color),
Container().shadow(),  
Container().animatedRotation(),
Container().upRotation,
Container().rightRotation,
Container().leftRotation,
Container().bottomRotation,

num(int, double) Extension

50.randomNum(), // 0-50 random number
index.randomImage(),
index.randomImg()
30.lorem(), // lorem ipsum text
20.height(), // SizedBox(height: 20)
20.width(), // SizedBox(width: 20)
20.heightWidth(), // SizedBox(height: 20,width: 20)
20.borderRadius,
20.borderRadiusOnlyTopLeft,
20.borderRadiusOnlyTopRight,
20.borderRadiusOnlyBottomLeft,
20.borderRadiusOnlyBottomRight,
20.borderRadiusOnlyTop,
20.borderRadiusOnlyBottom,
20.padding,
20.paddingOnlyTop,
20.paddingOnlyBottomRight,
20.paddingOnlyLeftRight,
20.getRandomString(15), // 15 length random string
1.seconds, /// => Duration(seconds: 1)
1000.milliseconds, /// => Duration(milliseconds: 1000)

BuildContext extension

context.bottom, // SafeArea Bottom
context.top,    // SafeArea Top
context.isKeyBoardOpen, // true or false
context.mediaQuery,
context.textTheme, // TextTheme extension
context.orientation,
context.isLandscape,
context.isPortrait,
context.platformBrightness,
context.isPhone, // device size < 600
context.isSmallTablet,
context.isLargeTablet,
context.platform,
context.openDrawer,
context.openEndDrawer,
context.hideCurrentSnackBar,
context.removeCurrentSnackBar,
context.showSnackBar,
context.isTablet,
context.showBottomSheet,
context.hasFocus,
context.isFirstFocus,
context.nextFocus,
context.unfocus,
context.consumeKeyboardToken,
context.validate,
context.reset,
context.save,
context.closeKeyboard,

Grock extension [No BuildContext]

Grock.context,
Grock.height,
Grock.width,
Grock.bottomCenter,
Grock.bottomLeft,
Grock.bottomRight,
Grock.center,
Grock.centerLeft,
Grock.centerRight,
Grock.topLeft,
Grock.topRight,
Grock.topCenter,
Grock.deviceWidth,
Grock.deviceHeight,
Grock.isIOS,
Grock.isAndroid,
Grock.isMacOS,
Grock.isWindows,
Grock.isLinux,
Grock.isFuchsia,
Grock.isDebugMode,
Grock.isReleaseMode,
Grock.isProfileMode,
Grock.hideKeyboard,
Grock.showGrockOverlay(),
Grock.isOpenGrockOverlay(),
Grock.closeGrockOverlay(),
Grock.empty(),
Grock.randomColor(),

Developer Extension

'test data'.logger,
'test data'.printer,

Function Extension

initState(){
  super.initState();
  function.widgetBinding();
}

Padding or Margin and BorderRadius

  GrockContainer(
    margin: 10.verticalP,
    // margin: 10.horizontalP,
    // margin: 10.allP,
    padding: [20,40].horizontalAndVerticalP,
    // padding: [10,13,14,12].paddingLTRB
    width: Grock.width * 0.3,
    height: Grock.height * 0.1,
    decoration: BoxDecoration(
      borderRadius: 15.allBR,
  ),
),

Random Online Image

GrockList(
  isExpanded: true,
  itemSpace: const Divider(),
  itemCount: 10,
  itemBuilder: (context,index)=>Image.network(
    index.randomImg(), // width and height optional
  ),
)

GrockMixin

class _MyHomePage
    extends GrockStatefulWidget
    with GrockMixin {

  initState(){
    super.initState();
    setStateIfMounted((){
      // your code
    })
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        children: [
          GrockContainer(
            onTap: (){
              showGrockSnackBar();
              showGrockSnackBarWithAction();
              showGrockSnackBarWithActionAndIcon();
              showGrockSnackBarWithIcon();
              showGrockMaterialBanner();
              showGrockMaterialBannerWithIcon();
              showGrockMaterialBannerWithIconAndColor();

              /// Adaptive Dialog
              showGrockAdaptiveDialog();
              showGrockAdaptiveDialogWithIcon();

              /// Adaptive DatePicker and TimePicker
              showGrockAdaptiveDatePicker();
              showGrockAdaptiveTimePicker();

              /// Adaptive BottomSheet
              showGrockAdaptiveBottomSheet();

              /// Adaptive Button
              GrockAdaptiveButton(); // => Widget

              /// Validations
              emailValidation(email);
              passwordValidation(password);
              phoneValidation();
              phoneValidationWithCountryCode();

              /// Tools
              hideKeyboard();
              isKeyboardOpen();
              isKeyboardClose();

              /// SafeArea
              safeAreaTop();
              safeAreaBottom();
              safeAreaLeft();
              safeAreaRight();
              safeArea();
              safeAreaWithPadding();
              safeAreaWithPaddingAndBottom();
            },
            width: dW(0.5),
            height: dH(0.5),
          ),

        ],
      ),
    );
  }
}