This is Grock

alt text

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

grock_button

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

grock_direct_selection_menu

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

grock_timer

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

GrockMenu IOS Style

grock_menu

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

grock_dropdown

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

grock_info_widget

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

grock_snackbar

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

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),
          ),

        ],
      ),
    );
  }
}

Libraries

grock