Search packages, repositories and app categories

Package detailsv0.6.0

grock

Api Services, Snackbar, Toast, No Context Extension, Custom Widgets, Widget Extensions, Fast Tools, IOS Style Widget and Tools.

AndroidiOSWebmacOSWindowsLinux
30-day downloads
229
Likes
89
Pub points
140

Install package

flutter pub add grock

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

Grock is a comprehensive Flutter widget library and UI framework offering utility services such as API handling, snackbar and toast notifications, context-free extensions, custom widgets, and widget extensions. It includes fast tools for common development tasks and provides iOS-style components to streamline UI creation. Designed for developers seeking efficiency and consistency, Grock enhances productivity with ready-to-use solutions across multiple platforms. Its modular structure supports Android, iOS, Web, macOS, Windows, and Linux.

Use cases

  • Rapid UI prototyping
  • Cross-platform app development
  • Streamlining snackbars and toasts
  • Simplifying context-less widget operations
  • Building iOS-styled interfaces
  • Reducing boilerplate code

Key features

  • API service utilities
  • Context-free extensions
  • iOS-style widgets
  • Built-in snackbars and toasts
  • Custom widget toolkit
  • Platform-agnostic design

Suitable for

  • Flutter beginners seeking shortcuts
  • Experienced developers wanting faster workflows
  • Teams prioritizing consistent UI patterns
  • Projects requiring multi-platform support
  • Apps needing lightweight utility tools

Considerations

  • May introduce dependency bloat if not used selectively
  • Limited documentation beyond basic examples
  • Best suited for apps with standard UI needs
  • Not ideal for highly customized or complex UIs
  • Requires familiarity with Flutter's widget system

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

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.slideUp); // 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),
          ),

        ],
      ),
    );
  }
}

Categories

Dependencies

Dependency list 1 items

Source repository

Projects using this package

No data available yet.