add circle chart

example/lib/main_home.dart

@@ -1,6 +1,7 @@
 import 'package:example/widgets/example_bottom_button.dart';
 import 'package:example/widgets/example_box.dart';
 import 'package:example/widgets/example_button.dart';
+import 'package:example/widgets/example_chart.dart';
 import 'package:example/widgets/example_dialog.dart';
 import 'package:example/widgets/example_divider.dart';
 import 'package:example/widgets/example_drawer.dart';
@@ -16,9 +17,8 @@ import 'package:example/widgets/example_tag.dart';
 import 'package:example/widgets/example_text_field.dart';
 import 'package:example/widgets/example_toast.dart';
 import 'package:flutter/material.dart';
-import 'package:get/get.dart';
-
 import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:get/get.dart';
 
 class MainHome extends StatefulWidget {
   MainHome({Key key}) : super(key: key);
@@ -110,10 +110,14 @@ class _MainHomeState extends State<MainHome> {
           title: 'Toast',
           onPressed: () => Get.to(ExampleToast()),
         ),
-         _innerButton(
+        _innerButton(
           title: 'Divider',
           onPressed: () => Get.to(ExampleDivider()),
         ),
+        _innerButton(
+          title: 'chart',
+          onPressed: () => Get.to(ExampleChart()),
+        ),
       ],
     );
   }

example/lib/widgets/example_button.dart

@@ -69,6 +69,12 @@ class _ExampleButtonState extends State<ExampleButton> {
               trailing: ASButton.order(
                 title: '立即下单',
               )),
+          ListTile(
+              title: Text('yellowHollow'),
+              trailing: ASButton.yellowHollow(
+                title: '立即下单',
+                onPressed: () {},
+              )),
           SizedBox(height: 12.w),
           Row(
             children: [

example/lib/widgets/example_chart.dart

@@ -0,0 +1,37 @@
+import 'package:ansu_ui/ansu_ui.dart';
+import 'package:ansu_ui/chart/circle_chart_widget.dart';
+import 'package:flutter/material.dart';
+
+class ExampleChart extends StatefulWidget {
+  const ExampleChart({Key key}) : super(key: key);
+
+  @override
+  _ExampleChartState createState() => _ExampleChartState();
+}
+
+class _ExampleChartState extends State<ExampleChart> {
+  @override
+  Widget build(BuildContext context) {
+    return ASScaffold(
+      title: 'chart',
+      body: ListView(
+        children: [
+          20.hb,
+          ListTile(
+              title: Text('circle chart'),
+              trailing: Container(
+                width: 50.w,
+                height: 50.w,
+                child: CircleChart(
+                  size: 40.w,
+                  color: Colors.red,
+                  aboveStrokeWidth: 10.w,
+                  core: '65%'.text.size(20.sp).color(kTextColor).make(),
+                  aspectRato: 0.65,
+                ),
+              )),
+        ],
+      ),
+    );
+  }
+}

lib/buttons/as_button.dart

@@ -1,6 +1,6 @@
+import 'package:ansu_ui/styles/as_colors.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
-import 'package:ansu_ui/styles/as_colors.dart';
 
 ///安速按钮
 class ASButton extends StatelessWidget {
@@ -43,6 +43,7 @@ class ASButton extends StatelessWidget {
   final Color? disableTextColor;
 
   final Color? splashColor;
+
   ASButton({
     Key? key,
     this.bgcolor,
@@ -110,6 +111,7 @@ class ASButton extends StatelessWidget {
         outline = false,
         this.splashColor = ColorTool.getSplashColor(kPrimaryColor),
         super(key: key);
+
   ASButton.operation(
       {Key? key,
       this.radius,
@@ -126,6 +128,7 @@ class ASButton extends StatelessWidget {
         textColor = kTextColor,
         outline = false,
         super(key: key);
+
   ASButton.order({
     Key? key,
     required this.title,
@@ -143,6 +146,23 @@ class ASButton extends StatelessWidget {
         padding = EdgeInsets.symmetric(vertical: 8.w),
         super(key: key);
 
+  ASButton.yellowHollow(
+      {Key? key,
+      this.radius,
+      this.textStyle,
+      this.padding,
+      required this.title,
+      this.onPressed,
+      this.width,
+      this.disableColor,
+      this.splashColor})
+      : outline = true,
+        outlineColor = kPrimaryColor,
+        bgcolor = Colors.white,
+        textColor = kPrimaryColor,
+        disableTextColor = kPrimaryColor,
+        super(key: key);
+
   @override
   Widget build(BuildContext context) {
     return MaterialButton(

lib/chart/circle_chart_widget.dart

@@ -0,0 +1,56 @@
+import 'package:ansu_ui/painters/circle_chart_painter.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
+class CircleChart extends StatelessWidget {
+  final double? size;
+
+  ///角度
+  final double aspectRato;
+
+  ///底部圆圈的宽度
+  final double? underStrokeWidth;
+
+  ///弧的宽度
+  final double? aboveStrokeWidth;
+
+  ///弧的颜色
+  final Color color;
+
+  ///圆圈中间显示的组件
+  final Widget core;
+
+  const CircleChart(
+      {Key? key,
+      this.size,
+      required this.aspectRato,
+      this.underStrokeWidth,
+      this.aboveStrokeWidth,
+      required this.color,
+      required this.core})
+      : super(key: key);
+
+  double get customSize => size ?? 100.w;
+
+  double get customUnderWidth => underStrokeWidth ?? 5.w;
+
+  double get customAboveWidth => aboveStrokeWidth ?? 15.w;
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      width: customSize,
+      height: customSize,
+      child: CustomPaint(
+          painter: CircleChartPainter(
+              underStrokeWidth: customUnderWidth,
+              aboveStrokeWidth: customAboveWidth,
+              radius: aspectRato,
+              aboveColor: color),
+          child: Align(
+            alignment: Alignment.center,
+            child: core,
+          )),
+    );
+  }
+}

lib/painters/circle_chart_painter.dart

@@ -0,0 +1,37 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+
+class CircleChartPainter extends CustomPainter {
+  final double underStrokeWidth;
+  final double aboveStrokeWidth;
+  final double radius;
+  final Color aboveColor;
+
+  CircleChartPainter(
+      {required this.underStrokeWidth,
+      required this.aboveStrokeWidth,
+      required this.radius,
+      required this.aboveColor});
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    var offset = Offset(size.width / 2, size.height / 2);
+    var paint = Paint()
+      ..strokeWidth = underStrokeWidth
+      ..style = PaintingStyle.stroke
+      ..color = Color(0xFFCECECE);
+    canvas.drawCircle(offset, size.width / 2, paint);
+    paint
+      ..strokeWidth = aboveStrokeWidth
+      ..strokeCap = StrokeCap.round
+      ..color = aboveColor;
+    var rect = Rect.fromCircle(center: offset, radius: size.width / 2);
+    canvas.drawArc(rect, -pi / 2, 2 * pi * radius, false, paint);
+  }
+
+  @override
+  bool shouldRepaint(covariant CustomPainter oldDelegate) {
+    return false;
+  }
+}