Add: padding property to Frost widget.

Add: `Frost.text` which takes string as input.
Add: `Frost.icon` which takes iconData as input.

CHANGELOG.md

@@ -1,11 +1,17 @@
-## [0.0.1] - 2020-10-8
+## [1.0.1] - 02-11-2020
 
-* Blur is a wrapper widget that blur it's child. There are ImageBlur.asset and ImageBlur.network that blur the image.
+* Add: `padding` property to `Frost` widget.
+* Add: `Frost.text` which takes string as input.
+* Add: `Frost.icon` which takes iconData as input.
 
 ## [1.0.0] - 02-11-2020
 
 * Breaking: The `borderRadius` datatype has changed from `double` to `BorderRadius`.
 * Add: `height` and `width` properties to `ImageBlur.asset` and `ImageBlur.network`.
 * Add: `Frost` class which blurs the background of the child.
 * Breaking: The `overlayChild` is renamed to `overlay`
-* Add: `alignment` property for the overlay child.
+* Add: `alignment` property for the overlay child.
+
+## [0.0.1] - 2020-10-8
+
+* Blur is a wrapper widget that blur it's child. There are ImageBlur.asset and ImageBlur.network that blur the image.

example/lib/main.dart

@@ -34,6 +34,7 @@ class _MyHomePageState extends State<MyHomePage> {
 
   @override
   Widget build(BuildContext context) {
+    var theme = Theme.of(context);
     return Scaffold(
       appBar: AppBar(
         title: Text(widget.title),
@@ -43,26 +44,33 @@ class _MyHomePageState extends State<MyHomePage> {
         child: Column(
           mainAxisAlignment: MainAxisAlignment.spaceEvenly,
           children: <Widget>[
-            ImageBlur.asset(
-              'assets/cat.webp',
-              scale: 2.5,
-              blur: blurValue,
-              blurColor: Theme.of(context).primaryColor,
-              borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
-            ),
-            ImageBlur.asset(
-              'assets/cat.webp',
-              colorOpacity: 0.2,
-              scale: 2.5,
-              borderRadius: BorderRadius.vertical(bottom: Radius.circular(20)),
-              blur: blurValue,
-              overlay: Text(
-                'Cat',
-                style: Theme.of(context)
-                    .textTheme
-                    .headline2
-                    .copyWith(color: Theme.of(context).scaffoldBackgroundColor),
-              ),
+            Row(
+              children: [
+                Expanded(
+                  child: ImageBlur.asset(
+                    'assets/cat.webp',
+                    blur: blurValue,
+                    blurColor: theme.primaryColor,
+                    borderRadius:
+                        BorderRadius.horizontal(left: Radius.circular(20)),
+                  ),
+                ),
+                SizedBox(width: 20.0),
+                Expanded(
+                  child: ImageBlur.asset(
+                    'assets/cat.webp',
+                    colorOpacity: 0.2,
+                    borderRadius:
+                        BorderRadius.horizontal(right: Radius.circular(20)),
+                    blur: blurValue,
+                    overlay: Text(
+                      'Cat',
+                      style: theme.textTheme.headline2
+                          .copyWith(color: theme.scaffoldBackgroundColor),
+                    ),
+                  ),
+                ),
+              ],
             ),
             Row(
               mainAxisAlignment: MainAxisAlignment.spaceEvenly,
@@ -79,27 +87,60 @@ class _MyHomePageState extends State<MyHomePage> {
                       borderRadius: BorderRadius.circular(20),
                       child: Padding(
                         padding: const EdgeInsets.all(8.0),
-                        child: Text(
-                          'Frost',
-                          style: Theme.of(context).textTheme.headline4,
+                        child: Column(
+                          children: [
+                            Icon(Icons.image),
+                            Text(
+                              'Frost',
+                              style: theme.textTheme.headline4,
+                            ),
+                          ],
                         ),
                       ),
                     ),
                   ],
                 ),
                 Blur(
                   blur: blurValue,
-                  blurColor: Theme.of(context).primaryColor,
+                  blurColor: theme.primaryColor,
                   child: Padding(
                     padding: EdgeInsets.all(8.0),
                     child: Text(
                       'Blur',
-                      style: Theme.of(context).textTheme.headline3,
+                      style: theme.textTheme.headline3,
                     ),
                   ),
                 ),
               ],
             ),
+            Stack(
+              alignment: Alignment.center,
+              children: [
+                Image.asset(
+                  'assets/cat.webp',
+                  width: MediaQuery.of(context).size.width - 40,
+                  height: 200,
+                  fit: BoxFit.fill,
+                ),
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.center,
+                  children: [
+                    Frost.text(
+                      'Frost text',
+                      blur: blurValue,
+                      textStyle: theme.textTheme.headline3,
+                      padding: EdgeInsets.all(8),
+                    ),
+                    SizedBox(width: 20),
+                    Frost.icon(
+                      Icons.image,
+                      padding: EdgeInsets.all(8),
+                      blur: blurValue,
+                    ),
+                  ],
+                ),
+              ],
+            ),
             Slider(
               value: blurValue,
               max: 20,

example/pubspec.lock

@@ -14,7 +14,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "1.0.0"
+    version: "1.0.1"
   boolean_selector:
     dependency: transitive
     description:

lib/blur.dart

@@ -1,14 +1,16 @@
 library blur;
 
 import 'dart:ui';
+import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 
 ///blur it's child
-///blur is the value of blur effect, higher the blur more the blur effect (default value = 2)
+///blur is the value of blur effect, higher the blur more the blur effect (default value = 5)
 ///blurColor is the color of blur effect
-///borderRadius is the radius of the child to be blurred (default value = 0)
+///borderRadius is the radius of the child to be blurred
 ///colorOpacity is the opacity of the blurColor (default value = 0.5)
 ///overlayChild is the widget that can be stacked over blurred widget
+///alignment is the alignment geometry of the overlay
 class Blur extends StatelessWidget {
   Blur({
     Key key,
@@ -55,6 +57,9 @@ class Blur extends StatelessWidget {
 }
 
 ///blurs the image provided to it
+///height is the height of the image
+///width is the width of the image
+///scale scales the image
 class ImageBlur extends StatelessWidget {
   ///acts as Image.asset
   ImageBlur.asset(
@@ -120,17 +125,16 @@ class ImageBlur extends StatelessWidget {
   }
 }
 
+///created frosted glass effect: blurs the background of the child given to it
+///frostColor is the color of the frost effect
+///frostOpacity is the opacity of the frostColor
+///height is the height of the frost effect
+///width is the width of the frost effect
+///borderRadius is the radius of the frost effect
+///alignment is the alignment geometry of the child
+///padding is the child padding
 class Frost extends StatelessWidget {
-  final Widget child;
-  final double blur;
-  final Color frostColor;
-  final double frostOpacity;
-  final double height;
-  final double width;
-  final AlignmentGeometry alignment;
-  final BorderRadius borderRadius;
-
-  const Frost({
+  Frost({
     Key key,
     this.child,
     this.blur = 5,
@@ -140,8 +144,57 @@ class Frost extends StatelessWidget {
     this.width,
     this.frostOpacity = 0.0,
     this.borderRadius,
+    this.padding = EdgeInsets.zero,
   }) : super(key: key);
 
+  ///give the frosted glass effect to the string text
+  ///textAlign is the alignment of the string text
+  ///textStyle is the styling of the string text
+  Frost.text(
+    String text, {
+    Key key,
+    TextAlign textAlign,
+    TextStyle textStyle,
+    this.blur = 5,
+    this.frostColor = Colors.white,
+    this.alignment = Alignment.center,
+    this.height,
+    this.width,
+    this.frostOpacity = 0.0,
+    this.borderRadius,
+    this.padding = EdgeInsets.zero,
+  })  : child = Text(text, textAlign: textAlign, style: textStyle),
+        super(key: key);
+
+  ///give the frosted glass effect to the icon
+  ///iconColor is the color of the icon
+  ///iconSize is the size of the icon
+  Frost.icon(
+    IconData iconData, {
+    Color iconColor,
+    double iconSize,
+    Key key,
+    this.blur = 5,
+    this.frostColor = Colors.white,
+    this.alignment = Alignment.center,
+    this.height,
+    this.width,
+    this.frostOpacity = 0.0,
+    this.borderRadius,
+    this.padding = EdgeInsets.zero,
+  })  : child = Icon(iconData, color: iconColor, size: iconSize),
+        super(key: key);
+
+  final Widget child;
+  final double blur;
+  final Color frostColor;
+  final double frostOpacity;
+  final double height;
+  final double width;
+  final AlignmentGeometry alignment;
+  final BorderRadius borderRadius;
+  final EdgeInsets padding;
+
   @override
   Widget build(BuildContext context) {
     return Blur(
@@ -151,11 +204,15 @@ class Frost extends StatelessWidget {
       child: Container(
         height: height,
         width: width,
+        padding: padding ?? EdgeInsets.zero,
         child: height == null || width == null ? child : SizedBox.shrink(),
         color: frostColor.withOpacity(frostOpacity),
       ),
       alignment: alignment,
-      overlay: child,
+      overlay: Padding(
+        padding: padding,
+        child: child,
+      ),
     );
   }
 }

pubspec.yaml

@@ -1,7 +1,7 @@
 name: blur
 description: Blur is a wrapper widget that blur it's child. There are ImageBlur.asset and ImageBlur.network that blur the image. Frost is another wrapper which blurs the background.
 
-version: 1.0.0
+version: 1.0.1
 author: Jagrit Kharbanda<jagritjkh@gmail.com>
 homepage: https://github.com/jagritjkh/blur