패키지, 저장소 및 앱 카테고리 검색

패키지 상세v0.6.0

grock

API 서비스, 스크롤바, 토스트, 컨텍스트 없음 확장, 사용자 정의 위젯, 위젯 확장, 빠른 도구, iOS 스타일 위젯 및 도구

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
229
좋아요
89
Pub 점수
140

패키지 설치

flutter pub add grock

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

Grock는 API 처리, 스낵바 및 토스트 알림, 컨텍스트 없는 확장, 사용자 정의 위젯 및 위젯 확장과 같은 유용한 서비스를 제공하는 포괄적인 Flutter 위젯 라이브러리 및 UI 프레임워크입니다. 일반적인 개발 작업을 위한 빠른 도구를 포함하며, UI 생성을 간소화하기 위해 iOS 스타일의 컴포넌트를 제공합니다. 효율성과 일관성을 추구하는 개발자를 위한 설계로, 여러 플랫폼에서 즉시 사용 가능한 솔루션을 통해 생산성을 향상시킵니다. 모듈식 구조로 Android, iOS, Web, macOS, Windows, Linux를 지원합니다.

사용 사례

  • 빠른 UI 프로토타이핑
  • 크로스 플랫폼 앱 개발
  • 스낵바와 토스트 간소화
  • 상황 없는 위젯 작업 간소화
  • iOS 스타일 인터페이스 구축
  • 보일러플레이트 코드 줄이기

주요 기능

  • API 서비스 유틸리티
  • 문맥 자유 확장
  • iOS 스타일 위젯
  • 내장된 스낵바 및 토스트
  • 사용자 지정 위젯 툴킷
  • 플랫폼에 관계없는 설계

적합한 대상

  • Flutter 초보자들이 단축키를 찾고 있습니다
  • 더 빠른 워크플로우를 원하는 경험이 풍부한 개발자
  • 일관된 UI 패턴을 우선시하는 팀
  • 다중 플랫폼 지원이 필요한 프로젝트
  • 경량 유틸리티 도구가 필요한 앱

고려 사항

  • 선택적으로 사용하지 않으면 종속성 과잉이 발생할 수 있습니다
  • 기본 예제 외에는 문서가 제한적입니다
  • 표준 UI 요구 사항을 가진 앱에 가장 적합
  • 높은 사용자 정의 또는 복잡한 UI에는 적합하지 않습니다
  • Flutter의 위젯 시스템에 익숙해야 합니다

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

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

        ],
      ),
    );
  }
}

카테고리

의존성

의존성 목록 1 개

소스 저장소

이 패키지를 사용하는 프로젝트

아직 데이터가 없습니다.