ionicfirebaseapp · deepikahr · Dec 20, 2019 · Dec 20, 2019 · Dec 20, 2019
diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -8,6 +8,7 @@ import 'package:ui_kit/components/badge/gf_badge.dart';
 import 'package:ui_kit/components/card/gf_card.dart';
 import 'package:ui_kit/components/header_bar/gf_title_bar.dart';
 import 'package:ui_kit/components/image/gf_image_overlay.dart';
+import 'package:ui_kit/components/button_bar/gf_button_bar.dart';
 import 'package:ui_kit/types/gf_type.dart';
 
 void main() => runApp(MyApp());
@@ -47,13 +48,37 @@ class _MyHomePageState extends State<MyHomePage> {
           crossAxisAlignment: CrossAxisAlignment.center,
           children: <Widget>[
 
+            Card(
+              child: Column(
+                children: <Widget>[
+                  Text("czsd"),
+                  Row(
+                    children: <Widget>[
+                      OutlineButton(onPressed: null, child: Text("dscds"), color: Colors.orange, ),
+                      FlatButton(onPressed: null, child: Text("dchbvj"))
+                    ],
+                  )
+                ],
+              ),
+            ),
+
+            GFButtonBar(
+              mainAxisSize: MainAxisSize.min,
+              children: <Widget>[
+                GFButton(onPressed: null, child: Text("like"), icon: Icon(Icons.favorite_border), type: GFType.transparent,),
+                GFButton(onPressed: null, child: Text("comment"),),
+                GFButton(onPressed: null, child: Text("share"), icon: Icon(Icons.share), type: GFType.outline,),
+              ],
+            ),
+
             GFTitleBar(
               avatar: GFAvatar(
                 child: Text("tb"),
               ),
               title: Text('title'),
               subTitle: Text('subtitle'),
               icon: GFIconButton(
+                type: GFType.transparent,
                 icon: Icon(Icons.favorite_border),
               ),
             ),
@@ -68,10 +93,23 @@ class _MyHomePageState extends State<MyHomePage> {
                 icon: Icon(Icons.favorite_border),
                 type: GFType.transparent,
               ),
+              image: Image.asset("lib/assets/pizza.jpeg"),
+              content: Text("Flutter "
+                  "Flutter is Google's mobile UI framework for crafting high-quality native interfaces on iOS and Android in "),
+              buttonBar: GFButtonBar(
+                mainAxisSize: MainAxisSize.min,
+                children: <Widget>[
+                  GFButton(onPressed: null, child: Text("favorite"), icon: Icon(Icons.favorite_border), type: GFType.transparent, ),
+                  GFButton(onPressed: null, child: Text("share"), icon: Icon(Icons.share), type: GFType.outline, ),
+                ],
+              ),
+
             ),
 
 
 
+
+
 //            GFCard(
 //              headertype: GFAtb(),
 //              po

diff --git a/lib/components/button/gf_button.dart b/lib/components/button/gf_button.dart
@@ -333,83 +333,79 @@ class _GFButtonState extends State<GFButton> {
           borderRadius: BorderRadius.circular(50.0), side: shapeBorder);
     }
 
-    return Semantics(
-      container: true,
-      button: true,
-      enabled: widget.enabled,
-      child: _InputPadding(
-        minSize: minSize,
-        child: Focus(
-          focusNode: widget.focusNode,
-          onFocusChange: _handleFocusedChanged,
-          autofocus: widget.autofocus,
-          child: Container(
-            constraints: this.icon == null
-                ? BoxConstraints(minHeight: 26.0, minWidth: 88.0)
-                : BoxConstraints(minHeight: 26.0, minWidth: 98.0),
-            decoration: BoxDecoration(
-                borderRadius: widget.shape == GFShape.pills
-                    ? BorderRadius.circular(50.0)
-                    : widget.shape == GFShape.standard
-                        ? BorderRadius.circular(5.0)
-                        : BorderRadius.zero,
-                boxShadow: [
-                  widget.boxShadow == null && widget.buttonBoxShadow == true
-                      ? BoxShadow(
-                          color: this.color.withOpacity(0.4),
-                          blurRadius: 1.5,
-                          spreadRadius: 2.0,
-                          offset: Offset.zero,
-                        )
-                      : widget.boxShadow != null
-                          ? widget.boxShadow
-                          : BoxShadow(
-                              color: Theme.of(context).canvasColor,
-                              blurRadius: 0.0,
-                              spreadRadius: 0.0,
-                              offset: Offset.zero,
-                            )
-                ]),
-            child: Material(
-              textStyle: widget.textStyle == null
-                  ? TextStyle(color: this.textColor, fontSize: 14)
-                  : widget.textStyle,
-              shape: widget.type == GFType.transparent
-                  ? null
-                  : widget.borderShape == null ? shape : widget.borderShape,
-              color: widget.type != GFType.outline || widget.type == null
-                  ? this.color
-                  : Theme.of(context).canvasColor,
-              type: widget.type == GFType.transparent
-                  ? MaterialType.transparency
-                  : MaterialType.button,
-              animationDuration: widget.animationDuration,
-              clipBehavior: widget.clipBehavior,
-              child: InkWell(
-                onHighlightChanged: _handleHighlightChanged,
-                splashColor: widget.splashColor,
-                highlightColor: widget.highlightColor,
-                focusColor: widget.focusColor,
-                hoverColor: widget.hoverColor,
-                onHover: _handleHoveredChanged,
-                onTap: widget.onPressed,
-                customBorder:
-                    widget.borderShape == null ? shape : widget.borderShape,
-                child: IconTheme.merge(
-                  data: IconThemeData(color: effectiveTextColor),
-                  child: Container(
-                    height: widget.blockButton == true
-                        ? BLOCK
-                        : widget.fullWidthButton == true ? BLOCK : this.size,
-                    width: buttonWidth(),
-                    padding: widget.padding,
-                    child: Center(
-                      widthFactor: 1.0,
-                      heightFactor: 1.0,
-                      child: this.icon != null &&
-                              (this.position == GFPosition.start ||
-                                  this.position == null)
-                          ? Row(
+//    Color _getFillColor() {
+//      if (widget.highlightElevation == null || widget.highlightElevation == 0.0)
+//        return Colors.transparent;
+//      final Color color = widget.color ?? Theme.of(context).canvasColor;
+//      final Tween<Color> colorTween = ColorTween(
+//        begin: color.withAlpha(0x00),
+//        end: color.withAlpha(0xFF),
+//      );
+//      return colorTween.evaluate(_fillAnimation);
+//    }
+
+
+      return Semantics(
+        container: true,
+        button: true,
+        enabled: widget.enabled,
+        child: _InputPadding(
+          minSize: minSize,
+          child: Focus(
+              focusNode: widget.focusNode,
+              onFocusChange: _handleFocusedChanged,
+              autofocus: widget.autofocus,
+              child: Container(
+                constraints: this.icon == null ? BoxConstraints(minHeight: 26.0, minWidth: 88.0) :
+                    BoxConstraints(minHeight: 26.0, minWidth: 98.0),
+                decoration: BoxDecoration(
+                  borderRadius: widget.shape == GFShape.pills ? BorderRadius.circular(50.0) :
+                  widget.shape == GFShape.standard ? BorderRadius.circular(5.0) : BorderRadius.zero,
+                    boxShadow: [
+                      widget.boxShadow == null && widget.buttonBoxShadow == true ? BoxShadow(
+                        color: this.color.withOpacity(0.4),
+                        blurRadius: 1.5,
+                        spreadRadius: 2.0,
+                        offset: Offset.zero,
+                      ) :
+                      widget.boxShadow != null ? widget.boxShadow :
+                      BoxShadow(
+                        color: Theme.of(context).canvasColor,
+                        blurRadius: 0.0,
+                        spreadRadius: 0.0,
+                        offset: Offset.zero,
+                      )
+                    ]
+                ),
+                child: Material(
+                  textStyle: widget.textStyle == null ? TextStyle(color: this.textColor, fontSize: 14) : widget.textStyle,
+                  shape: widget.type == GFType.transparent ? null : widget.borderShape== null ? shape : widget.borderShape,
+                  color: widget.type != GFType.outline || widget.type == null ? this.color : Theme.of(context).canvasColor,
+                  type: widget.type == GFType.transparent ? MaterialType.transparency : MaterialType.button,
+                  animationDuration: widget.animationDuration,
+                  clipBehavior: widget.clipBehavior,
+                  child: InkWell(
+                    onHighlightChanged: _handleHighlightChanged,
+                    splashColor: widget.splashColor,
+                    highlightColor: widget.highlightColor,
+                    focusColor: widget.focusColor,
+                    hoverColor: widget.hoverColor,
+                    onHover: _handleHoveredChanged,
+                    onTap: widget.onPressed,
+                    customBorder: widget.borderShape == null ? shape : widget.borderShape,
+                    child: IconTheme.merge(
+                      data: IconThemeData(color: effectiveTextColor),
+                      child: Container(
+                        height: widget.blockButton == true ? BLOCK
+                            : widget.fullWidthButton == true ? BLOCK
+                            : this.size,
+                        width: buttonWidth(),
+                        padding: widget.padding,
+                        child: Center(
+                          widthFactor: 1.0,
+                          heightFactor: 1.0,
+                          child: this.icon != null && (this.position == GFPosition.start || this.position == null)?
+                            Row(
                               mainAxisSize: MainAxisSize.min,
                               children: <Widget>[
                                 this.icon,

diff --git a/lib/components/button_bar/gf_button_bar.dart b/lib/components/button_bar/gf_button_bar.dart
@@ -0,0 +1,59 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/components/button/gf_icon_button.dart';
+
+class GFButtonBar extends StatelessWidget {
+
+  const GFButtonBar({
+    Key key,
+    this.alignment = MainAxisAlignment.end,
+    this.mainAxisSize = MainAxisSize.max,
+    this.children = const <Widget>[],
+  }) : super(key: key);
+
+  /// How the children should be placed along the horizontal axis.
+  final MainAxisAlignment alignment;
+
+  /// How much horizontal space is available. See [Row.mainAxisSize].
+  final MainAxisSize mainAxisSize;
+
+  /// The buttons to arrange horizontally.
+  /// Typically [RaisedButton] or [GFButton] or [GFIconButton] widgets.
+  final List<Widget> children;
+
+  @override
+  Widget build(BuildContext context) {
+    final ButtonThemeData buttonTheme = ButtonTheme.of(context);
+    // We divide by 4.0 because we want half of the average of the left and right padding.
+    final double paddingUnit = buttonTheme.padding.horizontal / 4.0;
+    final Widget child = Row(
+      mainAxisAlignment: alignment,
+      mainAxisSize: mainAxisSize,
+      children: children.map<Widget>((Widget child) {
+        return Padding(
+          padding: EdgeInsets.symmetric(horizontal: paddingUnit),
+          child: child,
+        );
+      }).toList(),
+    );
+    switch (buttonTheme.layoutBehavior) {
+      case ButtonBarLayoutBehavior.padded:
+        return Padding(
+          padding: EdgeInsets.symmetric(
+            vertical: 2.0 * paddingUnit,
+            horizontal: paddingUnit,
+          ),
+          child: child,
+        );
+      case ButtonBarLayoutBehavior.constrained:
+        return Container(
+          padding: EdgeInsets.symmetric(horizontal: paddingUnit),
+          constraints: const BoxConstraints(minHeight: 52.0),
+          alignment: Alignment.center,
+          child: child,
+        );
+    }
+    assert(false);
+    return null;
+  }
+}
diff --git a/lib/components/card/gf_card.dart b/lib/components/card/gf_card.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:ui_kit/components/avatar/gf_avatar.dart';
+import 'package:ui_kit/components/button_bar/gf_button_bar.dart';
 import 'package:ui_kit/components/header_bar/gf_title_bar.dart';
 
 enum GFCardType { basic, social, image}
@@ -25,7 +26,8 @@ class GFCard extends StatelessWidget {
     this.titleTextStyle,
     this.content,
     this.image,
-    this.icon
+    this.icon,
+    this.buttonBar,
   }) : assert(elevation == null || elevation >= 0.0),
         assert(borderOnForeground != null),
         super(key: key);
@@ -83,6 +85,9 @@ class GFCard extends StatelessWidget {
   /// image widget can be used
   final Image image;
 
+  /// widget can be used to define buttons bar, see [GFButtonBar]
+  final GFButtonBar buttonBar;
+
   static const double _defaultElevation = 1.0;
   static const Clip _defaultClipBehavior = Clip.none;
 
@@ -116,11 +121,12 @@ class GFCard extends StatelessWidget {
               subTitle: subTitle,
               icon: icon,
             ),
-//            image,
-//            Padding(
-//              padding: padding,
-//              child: content,
-//            )
+            image,
+            Padding(
+              padding: padding,
+              child: content,
+            ),
+            buttonBar,
           ],
         ),
       ),

diff --git a/lib/components/header_bar/gf_title_bar.dart b/lib/components/header_bar/gf_title_bar.dart
@@ -37,15 +37,11 @@ class GFTitleBar extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
-      // margin: margin ?? const EdgeInsets.all(16.0),
-      // padding: padding ?? const EdgeInsets.all(12.0),
-      child: ListTile(
-        leading: avatar,
-        title: title,
-        subtitle: subTitle,
-        trailing: icon,
-      ),
+    return ListTile(
+      leading: avatar,
+      title: title,
+      subtitle: subTitle,
+      trailing: icon,
     );
   }
-}
+}