发布0.0.9版本

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 * TODO: Describe initial release.
 
-## [0.0.9] - TODO: 修改了CupertionPopover动画
+## [0.0.9] - TODO: 添加了一些控件,改进了CupertionPopover
 
-* TODO: 修改了修改了CupertionPopover动画,添加了CupertinoPopoverMenuItem控件
+* TODO: 添加了CupertinoPopoverMenuList
\ No newline at end of file
+* TODO: 添加了CupertinoPopoverMenuItem
+* TODO: 修改了CupertionPopover动画,
\ No newline at end of file

README.md

@@ -6,7 +6,7 @@ Usage
 Add this to your package's pubspec.yaml file:
 ``` yaml
 dependencies:
-  cool_ui: "^0.0.8"
+  cool_ui: "^0.0.9"
 ```
 
 ## CupertinoPopover
@@ -36,3 +36,16 @@ CupertinoPopoverButton(
         popoverWidth: 100.0,
         popoverHeight: 100.0);
 ```
+## CupertinoPopoverMenuList,CupertinoPopoverMenuItem
+用于快速搭建一个弹出的菜单项
+
+#### 案例核心代码
+```dart
+    CupertinoPopoverMenuList(
+                    children: <Widget>[
+                      CupertinoPopoverMenuItem(leading: Icon(Icons.add),child: Text("新增"),),
+                      CupertinoPopoverMenuItem(leading: Icon(Icons.edit),child: Text("修改"),),
+                      CupertinoPopoverMenuItem(leading: Icon(Icons.delete),child: Text("删除"),)
+                    ],
+                  )
+```

example/lib/main.dart

@@ -19,7 +19,7 @@ class MyApp extends StatelessWidget {
         // "hot reload" (press "r" in the console where you ran "flutter run",
         // or press Run > Flutter Hot Reload in IntelliJ). Notice that the
         // counter didn't reset back to zero; the application is not restarted.
-        primarySwatch: Colors.blue,
+        primarySwatch: Colors.blue
       ),
       home: MyHomePage(title: 'Flutter Demo Home Page'),
     );

example/lib/pages/PopoverDemo.dart

-import 'package:cool_ui_example/cool_u_i_example_icons.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:cool_ui/cool_ui.dart';
 
+
 class PopoverDemo extends StatefulWidget{
   @override
   State<StatefulWidget> createState() {
@@ -49,25 +49,30 @@ class PopoverDemoState extends State<PopoverDemo>{
   }
 
   Widget _buildPopoverButton(String btnTitle,String bodyMessage){
-    return CupertinoPopoverButton(
-        child: Container(
-          margin: EdgeInsets.all(20.0),
-          width: 80.0,
-          height: 40.0,
-          decoration: BoxDecoration(
-              color: Colors.white,
-              borderRadius: BorderRadius.all(Radius.circular(5.0)),
-              boxShadow: [BoxShadow(color: Colors.black12,blurRadius: 5.0)]
-          ),
-          child: Center(child:Text(btnTitle)),
-        ),
-        popoverBody:Container(
-//                    color: Colors.lightBlue,
-          width: 100.0,
-          height: 100.0,
-          child: Text(bodyMessage),
-        ),
-        popoverWidth: 100.0,
-        popoverHeight: 100.0);
+    return Padding(
+        padding:  EdgeInsets.all(20.0),
+        child:CupertinoPopoverButton(
+            child: Container(
+              width: 80.0,
+              height: 40.0,
+              decoration: BoxDecoration(
+                  color: Colors.white,
+                  borderRadius: BorderRadius.all(Radius.circular(5.0)),
+                  boxShadow: [BoxShadow(color: Colors.black12,blurRadius: 5.0)]
+              ),
+              child: Center(child:Text(btnTitle)),
+            ),
+            popoverBuild: (context) {
+              return CupertinoPopoverMenuList(
+                children: <Widget>[
+                  CupertinoPopoverMenuItem(leading: Icon(Icons.add),child: Text("新增"),),
+                  CupertinoPopoverMenuItem(leading: Icon(Icons.edit),child: Text("修改"),),
+                  CupertinoPopoverMenuItem(leading: Icon(Icons.delete),child: Text("删除"),)
+                ],
+              );
+            },
+            popoverWidth: 150.0,
+            popoverHeight: 123.0)
+    );
   }
 }
\ No newline at end of file

lib/cool_ui.dart

@@ -4,4 +4,5 @@ import 'package:flutter/material.dart';
 part 'utils/screen_utils.dart';
 part 'utils/widget_utils.dart';
 
-part 'popover/cupertino_popover.dart';
+part 'popover/cupertino_popover.dart';
\ No newline at end of file
+part 'popover/cupertino_popover_menu_item.dart';
\ No newline at end of file

lib/popover/cupertino_popover.dart

@@ -3,6 +3,7 @@ part of cool_ui;
 class CupertinoPopoverButton extends StatelessWidget{
   final Widget child;
   final Widget popoverBody;
+  final WidgetBuilder popoverBuild;
   final double popoverWidth;
   final double popoverHeight;
   final Color popoverColor;
@@ -10,12 +11,15 @@ class CupertinoPopoverButton extends StatelessWidget{
   final Duration transitionDuration;
   const CupertinoPopoverButton({
     @required this.child,
-    @required this.popoverBody,
+    this.popoverBody,
+    this.popoverBuild,
     this.popoverColor=Colors.white,
     @required this.popoverWidth,
     @required this.popoverHeight,
     this.transitionDuration=const Duration(milliseconds: 200),
-    this.radius=13.0});
+    this.radius=8.0}):
+        assert(popoverBody != null || popoverBuild != null),
+        assert(!(popoverBody != null && popoverBuild != null));
 
 
   @override
@@ -24,26 +28,16 @@ class CupertinoPopoverButton extends StatelessWidget{
     return GestureDetector(
       behavior: HitTestBehavior.translucent,
       onTap: (){
+        var offset = WidgetUtils.getWidgetLocalToGlobal(context);
+        var bounds = WidgetUtils.getWidgetBounds(context);
+        var body = popoverBody;
         showGeneralDialog(
           context: context,
           pageBuilder: (BuildContext buildContext, Animation<double> animation, Animation<double> secondaryAnimation) {
             final ThemeData theme = Theme.of(context, shadowThemeOnly: true);
-            var offset = WidgetUtils.getWidgetLocalToGlobal(context);
-            var bounds = WidgetUtils.getWidgetBounds(context);
-            final Widget pageChild =  CupertinoPopover(
-              transitionDuration: transitionDuration,
-              attachRect:Rect.fromLTWH(offset.dx, offset.dy, bounds.width, bounds.height),
-              child: popoverBody,
-              width: popoverWidth,
-              height: popoverHeight,
-              color: popoverColor,
-              context: context,
-              radius: radius,);
             return Builder(
                 builder: (BuildContext context) {
-                  return theme != null
-                      ? Theme(data: theme, child: pageChild)
-                      : pageChild;
+                  return Container();
                 }
             );
 
@@ -52,21 +46,31 @@ class CupertinoPopoverButton extends StatelessWidget{
           barrierLabel: MaterialLocalizations.of(context).modalBarrierDismissLabel,
           barrierColor: Colors.black54,
           transitionDuration: transitionDuration,
-          transitionBuilder: _buildMaterialDialogTransitions,);
+          transitionBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
+            if(body == null){
+              body = popoverBuild(context);
+            }
+            return FadeTransition(
+              opacity: CurvedAnimation(
+                parent: animation,
+                curve: Curves.easeOut,
+              ),
+              child: CupertinoPopover(
+                attachRect:Rect.fromLTWH(offset.dx, offset.dy, bounds.width, bounds.height),
+                child: body,
+                width: popoverWidth,
+                height: popoverHeight,
+                color: popoverColor,
+                context: context,
+                radius: radius,
+                doubleAnimation: animation,
+              ),
+            );
+          },);
       },
       child: child,
     );
   }
-
-  Widget _buildMaterialDialogTransitions(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
-    return FadeTransition(
-      opacity: CurvedAnimation(
-        parent: animation,
-        curve: Curves.easeOut,
-      ),
-      child: child,
-    );
-  }
 }
 
 
@@ -77,7 +81,7 @@ class CupertinoPopover extends StatefulWidget {
   final double height;
   final Color color;
   final double radius;
-  final Duration transitionDuration;
+  final Animation<double> doubleAnimation;
 
   CupertinoPopover({
     @required this.attachRect,
@@ -85,9 +89,9 @@ class CupertinoPopover extends StatefulWidget {
     @required this.width,
     @required this.height,
     this.color=Colors.white,
-    this.transitionDuration = const Duration(milliseconds: 150),
     @required BuildContext context,
-    this.radius=13.0}):super(){
+    this.doubleAnimation,
+    this.radius=8.0}):super(){
     ScreenUtil.getInstance().init(context);
   }
 
@@ -96,15 +100,15 @@ class CupertinoPopover extends StatefulWidget {
 }
 
 class CupertinoPopoverState extends State<CupertinoPopover>  with TickerProviderStateMixin{
-  static const double _arrowWidth = 26.0;
-  static const double _arrowHeight = 13.0;
+  static const double _arrowWidth = 12.0;
+  static const double _arrowHeight = 8.0;
 
   double left;
   double top;
   Rect _arrowRect;
   Rect _bodyRect;
-  Animation<double> doubleAnimation;
-  AnimationController animation;
+
+//  AnimationController animation;
 
   /// 是否箭头向上
   bool isArrowUp;
@@ -115,15 +119,15 @@ class CupertinoPopoverState extends State<CupertinoPopover>  with TickerProvider
     isArrowUp = ScreenUtil.screenHeight > widget.attachRect.bottom + widget.height + _arrowWidth;
     super.initState();
     calcRect();
-    animation = new AnimationController(
-        duration: widget.transitionDuration,
-        vsync: this
-    );
-    // Tween({T begin, T end })：创建tween（补间）
-    doubleAnimation = new Tween<double>(begin: 0.0, end: 1.0).animate(animation)..addListener((){
-      setState((){});
-    });
-    animation.forward(from: 0.0);
+//    animation = new AnimationController(
+//        duration: widget.transitionDuration,
+//        vsync: this
+//    );
+//    // Tween({T begin, T end })：创建tween（补间）
+//    doubleAnimation = new Tween<double>(begin: 0.0, end: 1.0).animate(animation)..addListener((){
+//      setState((){});
+//    });
+//    animation.forward(from: 0.0);
   }
 
   @override
@@ -131,7 +135,7 @@ class CupertinoPopoverState extends State<CupertinoPopover>  with TickerProvider
 
     var bodyMiddleX  = _bodyRect.left + _bodyRect.width / 2; // 计算Body的X轴中间点
     var arrowMiddleX = _arrowRect.left + _arrowRect.width /2; //计算箭头的X轴中间点
-    var leftOffset = (arrowMiddleX - bodyMiddleX) * (1 - doubleAnimation.value); //计算X轴缩小的偏移值
+    var leftOffset = (arrowMiddleX - bodyMiddleX) * (1 - widget.doubleAnimation.value); //计算X轴缩小的偏移值
     return Stack(
         children: <Widget>[
           Positioned(
@@ -139,7 +143,7 @@ class CupertinoPopoverState extends State<CupertinoPopover>  with TickerProvider
             top:top,
             child:ScaleTransition(
               alignment: isArrowUp?Alignment.topCenter:Alignment.bottomCenter,
-              scale: doubleAnimation,
+              scale: widget.doubleAnimation,
               child: ClipPath(
                 clipper:ArrowCliper(
                     arrowRect:_arrowRect,

lib/popover/cupertino_popover_menu_item.dart

-import 'package:flutter/material.dart';
+part of cool_ui;
+
+
+class CupertinoPopoverMenuList extends StatelessWidget{
+  final List<Widget> children;
+  const CupertinoPopoverMenuList({this.children});
+
+  @override
+  Widget build(BuildContext context) {
+    return ListView.builder(
+      itemCount: children.length * 2 - 1,
+      itemBuilder: (context,int i){
+        if(i.isOdd){
+          // 在每一列之前，添加一个1像素高的分隔线widget
+          return const Divider(height: 1.0,);
+        }
+        final int index=i ~/2;
+        return children[index];
+      },
+      padding: EdgeInsets.all(0.0),
+    );
+  }
+
+}
+
 
 class CupertinoPopoverMenuItem extends StatelessWidget{
   final Widget leading;
@@ -10,7 +34,29 @@ class CupertinoPopoverMenuItem extends StatelessWidget{
 
   @override
   Widget build(BuildContext context) {
-    // TODO: implement build
+    List<Widget> widgets = [];
+    if(leading != null){
+      widgets.add(Container(
+        padding: EdgeInsets.only(left:5.0,right: 5.0),
+        width: 35.0,
+        height: 35.0,
+        child: IconTheme(
+            data:IconThemeData(color: Color(0xff007aff),size: 20.0),
+            child: leading
+        ),
+      ));
+    }
+    widgets.add(Expanded(child: DefaultTextStyle(style: TextStyle(
+        color: Color(0xff007aff),
+        fontSize: 17.0
+    ), child: child)));
+    return Padding(
+      padding: EdgeInsets.only(top:2.5,bottom: 2.5),
+      child: Row(
+          children: widgets
+      ),
+    );
+
   }
 
 }
\ No newline at end of file

pubspec.yaml

 name: cool_ui
 description: 用flutter实现一些我认为好看的UI控件
-version: 0.0.8
+version: 0.0.9
 author: Kevin <liangkaikevin@gmail.com>
 homepage: https://github.com/Im-Kevin/cool_ui