mwidgets 0.8.8

Contains a custom widgets like MText, MDropdown, MFileImage, MNetworkImage, MLottie, MSvg, MBouncingButton others

MWidget description

Contains a custom widgets like MText, MDropdown, MFileImage, MNetworkImage, MLottie, MSvg, MBouncingButton, MRating, MPinPut, MScroll, MTextFiled, MRangeItemWidget, MRadioItemWidget and others

SetUp

MWidgetSetUp

import 'package:flutter/material.dart';
import 'package:mwidgets/setup.dart';

void main() {
  MWidgetsSetUp.settings(
    fontEn: "",
    fontAr: "",
    primary: Colors.black,
    secondPrimary: Colors.white,
  );
  runApp(const MyApp());
}

Examples

MText

    MText(
        text: product.name,
        size: FoontSize.font18,
        weight: FontWeight.w500,
    ).addPadding(vertical: 12.0),

MSvg

    const MSvg(
        name: Svgs.arrowBack,
        height: 32.0,
    )

MNetworkImage

  MNetworkImage(
    url: category.image,
    height: 45.0,
    width: 45.0,
    fit: BoxFit.cover,
  ),

MLottieImage

  MLottieImage(
    name: category.image,
    height: 45.0,
    width: 45.0,
    fit: BoxFit.cover,
  ),

MFileImage

  MFileImage(
    file: "",
    height: 45.0,
    width: 45.0,
    fit: BoxFit.cover,
  ),

MAssetImage

     MAssetImage(
      name: item.icon,
      width: context.w * 0.85,
      fit: BoxFit.contain,
    );

MPinput

  MPinput(
      mKey: const Key('pinPut'),
      length: 6,
      onChanged: verifyCubit.setCode,
      keyboardType: TextInputType.number,
    ).addPadding(bottom: 24.0),

MDropDown

  MDropDown<CategoryModel>(
    inFill: false,
    options: cubit.categories,
    setInitial: cubit.category,
    title: context.tr.chooseCategory,
    hint: context.tr.chooseCategory,
    itemTitle: (item) => item.name,
    onChanged: cubit.setCategory,
  ).addPadding(bottom: 20.0),

MTextFiled

 MTextFiled(
        controller: cubit.password,
        obscureText: hide,
        paddingVertical: 8.0,
        suffix: icon,
        hintText: context.tr.password,
        border: OutlineInputBorder(
          borderSide: BorderSide(color: Coolors.highLight),
          borderRadius: BorderRadius.circular(5.0),
        ),
        validator: (valid) {
          return Validates.isPassword(
            password: cubit.password.text,
            errorMessage: context.tr.passwordIsShort,
          );
        },
  ).addPadding(bottom: 12.0),

MPasswordWidget and Validates

 MPasswordWidget(
    child: (icon, hide) {
      kPrint(hide);
      return MTextFiled(
        controller: cubit.password,
        obscureText: hide,
        paddingVertical: 8.0,
        suffix: icon,
        hintText: context.tr.password,
        border: OutlineInputBorder(
          borderSide: BorderSide(color: Coolors.highLight),
          borderRadius: BorderRadius.circular(5.0),
        ),
        validator: (valid) {
          return Validates.isPassword(
            password: cubit.password.text,
            errorMessage: context.tr.passwordIsShort,
          );
        },
      );
    },
    ).addPadding(bottom: 12.0),

MProgressButton

     MProgressButton(
        progress: 1,
        onTap: () {
          
        },
      ).addPadding(bottom: 21.0),

MSvgButton

    MSvgButton(
      width: 60.0,
      height: 60.0,
      icon: Svgs.delete,
      iconSize: 30.0,
      borderRadius: 16.0,
      onTap: () {
      
      },
    ),

MBouncingButton

  MBouncingButton(
    title: context.tr.edit,
    onTap: () {
      context.pushReplacement(
        AddNewOrUpdateShipmentScreen(
          moreShipment: moreShipment,
          shipment: shipment,
        ),
      );
    },
  ),

MAnimatedButton

  MAnimatedButton(
  onTap: () async {
    await cubit.addToCart(productId: product.id);
  },
  title: context.tr.addToCart,
  success: Row(
    children: [
      const MSvg(
        name: Svgs.cartDone,
        height: 28.0,
        color: Coolors.greenAccent,
      ).addPadding(end: 12.0),
      MText(
        text: context.tr.done,
        size: FoontSize.font18,
        color: Coolors.greenAccent,
      )
    ],
  ),
);

MDividerItemWidget

    const MDividerItemWidget(),

MTitleDividerItemWidget

    const MTitleDividerItemWidget(title: "OR")

MRatingItem

  MRatingItem(
    rating: 4.5,
    oneStar: true,
    onRatingUpdate: (value) {},
  ).addPadding(start: 8.0)

MPadding.set()

 const Padding(
   padding: MPadding.set(horizontal: 21.0),
   child: MSvg(name: Svgs.date),
 ),

MBorderRadius

    borderRadius: MBorderRadius.set(all: 8.0),

MScroll

    return MScroll(
      axis: Axis.horizontal,
      child: Row(
        children: cubit.products.map((item) {
          return ProductItemWidget(
            product: item,
          );
        }).toList(),
      ),
    );

Loader

     Loader.loadingSkeleton(
       height: context.h * 0.14,
       width: context.w * 0.7,
     ),

     Loader.loadingText(
       height: context.w * 0.04,
       width: context.w * 0.3,
       padding: const MPadding.set(start: 24),
     ),     

ImagesViewerScreen

    context.push(
      ImagesViewerScreen(
        urls: images,
        initialImage: initialImage,
      ),
    );   

FToast

 FToast.showError(context: context, message: message);
 FToast.showSuccess(context: context, message: message);

showMBottomSheet

    showReviewsBottomSheet({
      required BuildContext context,
      required String productId,
    }) {
      showMBottomSheet(
        context: context,
        noScrolling: true,
        bottomSheet: ReviewsBottomSheet(productId: productId),
      );
    }

showMCupertinoDialog

    showCheckMailDialog({required BuildContext context}) {
      showMCupertinoDialog(
        context: context,
        child: const CheckMailDialog(),
      );
    }

PhoneValidator

  final phoneValidate = PhoneValidator();
  
  StreamBuilder<bool>(
    initialData: true,
    stream: phoneValidate.validate.stream,
    builder: (context, snapshot) {
      return MTextFiled(
        mKey: const Key('phone'),
        onChanged: (value) {
           phoneValidate.getPhone(phone: value);
        },
        controller: cubit.phone,
        title: context.tr.phoneNumber,
        hintText: '01× ×××× ××××',
        prefix: const MSvg(name: Svgs.phone),
        keyboardType: TextInputType.phone,
        validator: (valid) {
          if (snapshot.data!) {
            return null;
          }
          return context.tr.pleaseEnterValidPhone;
        },
      );
    },
  ).addPadding(bottom: 18.0),

Validates

  Validates.isPassword(
    password: cubit.oldPassword.text,
    errorMessage: context.tr.passwordIsShort,
  );
  
  Validates.isConfirmPassword(
    password: cubit.newPassword.text,
    confrimPassword: cubit.confirmPassword.text,
    errorMessage: context.tr.notSamePassword,
  );
  
  Validates.isEmail(
    email: cubit.email.text,
    errorMessage: context.tr.emailIsNotValid,
  );
  
  Validates.isHasData(
    data: cubit.fullName.text,
    errorMessage: context.tr.enterYourName,
  );

Extensions methods

date format

  "".toNameOfMonthAndTime;
  "".toDateOnly;
  "".toDateAndTime;
  "".ago;
  "".toTimeOnly;
  "".toMonthAndDay;
  "".toYearMonthDay;

context

 final height = context.mHeight;
 final width = context.mWidth;
 final orientation = context.mOrientation;
 final canPop = context.canPop;
 final maybePop = context.maybePop;
 
 context.push(
  ProductDetailsScreen(
    product: item,
  ),
 );
 
 context.pushReplacement(
  ProductDetailsScreen(
    product: item,
  ),
 );
  
 context.pushAndRemoveUntil(
  ProductDetailsScreen(
    product: item,
  ),
 );

 context.pushNamed("/login");  
 
 context.pushReplacementNamed("/login");  
 
 context.pushNamedAndRemoveUntil("/login"); 

 context.pop(); 

.addAction()

    MSvg(
      height: 26.0,
      name: Svgs.saved ,
      color: Coolors.grey,
    ).addAction(
      onGesture: () {
      
      },
    );

kPrint

    kPrint("Hello World");

License

This library is distributed under Apache 2.0 license for more info see LICENSE DETAILS