Custom utils with flutter

  1. Get the MediaQuery size

    getSize(context)

Make a responsive gridview by using both 1 and 2

  1. Based on your static design’s width, calculate the responsive grid item count.

    crossAxisCount: getResCrosCountGrid(
        context: context,
        width: 180,
    ),
  2. For responsive grid item aspect ratio, it should be derived from your static design based on height and width.

    childAspectRatio: getResGridRatio(
        context: context,
        height: 165,
        width: 180,
    ),
  3. For normal grid aspect ratio

    Having this aspect ratio will never break in larger or smaller devices

    crossAxisCount: 2,
    childAspectRatio: getGridRatio(
        crossAxisCount: 2,
        context: context,
        height: 165,
        width: 180,
    ),

Your provided height and width determine how it works


  1. Get color from hash code

    CHColor.fromHex('#fffff')
  2. Get hash code from color

    Color.fromRGBO(250, 250, 250, 0.1).toHex()

  1. All (padding/margin)

    @override
    Widget build(BuildContext context) {
        return Container(
        child: Text('data').cPadAll(10) // cMargAll 
        );
    }
  2. Only (padding/margin)

    @override
    Widget build(BuildContext context) {
        return Container(
            child: Text('data').cPadOnly(
                l: 10,
                r: 10,
                t: 10,
                b: 10,
            ), // cMargOnly
        );
    }
  3. Symmetric (padding/margin)

    @override
    Widget build(BuildContext context) {
        return Container(
            child: Text('data').cPadSymmetric(
                h: 10,
                v: 10,
            ), // cMargSymmetric
        );
    }
  4. Zero (padding/margin)

    @override
    Widget build(BuildContext context) {
        return Container(
        child: Text('data').cPadZero, // cMargZero
        );
    }
  5. Allows you to insert widgets inside a CustomScrollView

    Text('data').cSliverToBox
  6. Allows you to handle Visibility and Opacity

    Text('data').cVisible(true)
    
    Text('data').cOpacity(0.3)


GitHub

View Github