Square circle

README.md

@@ -214,6 +214,13 @@ For more info, please, refer to the `showcase.dart` in the example.
       <br />
       ✅
     </td>
+    <td align="center">
+      <img src="https://raw.githubusercontent.com/abhishek0706/flutter_spinkit/square_circle/screenshots/square_circle.gif" width="100px">
+      <br />
+      SquareCircle
+      <br />
+      ✅
+    </td>
   </tr>
 </table>
 

lib/flutter_spinkit.dart

@@ -19,6 +19,7 @@ export 'src/ripple.dart';
 export 'src/rotating_circle.dart';
 export 'src/rotating_plain.dart';
 export 'src/spinning_circle.dart';
+export 'src/square_circle.dart';
 export 'src/three_bounce.dart';
 export 'src/wandering_cubes.dart';
 export 'src/wave.dart';

lib/src/square_circle.dart

@@ -0,0 +1,103 @@
+import 'dart:math' as math;
+import 'package:flutter/widgets.dart';
+
+class SpinKitSquareCircle extends StatefulWidget {
+  // ignore: prefer_const_constructors_in_immutables
+  SpinKitSquareCircle({
+    Key key,
+    this.color,
+    this.size = 50.0,
+    this.itemBuilder,
+    this.duration = const Duration(seconds: 1),
+    this.controller,
+  })  : assert(
+            !(itemBuilder is IndexedWidgetBuilder && color is Color) &&
+                !(itemBuilder == null && color == null),
+            'You should specify either a itemBuilder or a color'),
+        assert(size != null),
+        super(key: key);
+
+  final Color color;
+  final double size;
+  final IndexedWidgetBuilder itemBuilder;
+  final Duration duration;
+  final AnimationController controller;
+
+  @override
+  _SpinKitSquareCircleState createState() => _SpinKitSquareCircleState();
+}
+
+class _SpinKitSquareCircleState extends State<SpinKitSquareCircle>
+    with SingleTickerProviderStateMixin {
+  AnimationController controller;
+  Animation<double> animation_curve;
+  Animation<double> animation_size;
+
+  @override
+  void initState() {
+    super.initState();
+    controller =
+        AnimationController(vsync: this, duration: Duration(milliseconds: 500));
+
+    animation_curve = Tween(begin: 1.0, end: 0.0).animate(
+      CurvedAnimation(
+        parent: controller,
+        curve: Curves.easeInOutCubic,
+      ),
+    );
+    animation_curve.addListener(() => setState(() {}));
+
+    animation_size = Tween(begin: 0.5, end: 1.0).animate(
+      CurvedAnimation(
+        parent: controller,
+        curve: Curves.easeInOutCubic,
+      ),
+    );
+    animation_size.addListener(() => setState(() {}));
+
+    controller.forward();
+
+    controller.addStatusListener((status) {
+      if (status == AnimationStatus.completed) {
+        controller.reverse();
+      } else if (status == AnimationStatus.dismissed) {
+        controller.forward();
+      }
+    });
+  }
+
+  @override
+  void dispose() {
+    controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final Matrix4 transform = Matrix4.identity();
+    transform.rotateZ(animation_curve.value * math.pi);
+    return Center(
+      child: Transform(
+        transform: transform,
+        alignment: FractionalOffset.center,
+        child: _itembuilder(0),
+      ),
+    );
+  }
+
+  Widget _itembuilder(int index) {
+    final double currentSize = widget.size * animation_size.value;
+    return widget.itemBuilder != null
+        ? widget.itemBuilder(context, index)
+        : Container(
+            height: currentSize,
+            width: currentSize,
+            decoration: BoxDecoration(
+              color: widget.color,
+              borderRadius: BorderRadius.all(
+                Radius.circular(0.5 * currentSize * animation_curve.value),
+              ),
+            ),
+          );
+  }
+}