Skip to content

Commit 3e0999a

Browse files
deepikahrdeepikahr
committed
files name has been changed and title bar component completed
1 parent a87be92 commit 3e0999a

11 files changed

Lines changed: 312 additions & 313 deletions

File tree

‎example/lib/main.dart‎

Lines changed: 36 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
11
import 'package:flutter/material.dart';
22
import 'package:ui_kit/components/button/gf_button.dart';
33
import 'package:ui_kit/components/button/gf_icon_button.dart';
4-
import 'package:ui_kit/components/badge/gf_badge.dart';
4+
import 'package:ui_kit/components/badge/gf_button_badge.dart';
55
import 'package:ui_kit/components/badge/gf_icon_badge.dart';
66
import 'package:ui_kit/components/avatar/gf_avatar.dart';
7-
import 'package:ui_kit/components/counter/gf_counter.dart';
7+
import 'package:ui_kit/components/badge/gf_badge.dart';
88
import 'package:ui_kit/components/card/gf_card.dart';
9+
import 'package:ui_kit/components/header_bar/gf_title_bar.dart';
10+
import 'package:ui_kit/components/image/gf_image_overlay.dart';
11+
import 'package:ui_kit/types/gf_type.dart';
912

1013
void main() => runApp(MyApp());
1114

@@ -40,9 +43,35 @@ class _MyHomePageState extends State<MyHomePage> {
4043
),
4144
body: SingleChildScrollView(
4245
child: Column(
43-
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
46+
mainAxisAlignment: MainAxisAlignment.center,
4447
crossAxisAlignment: CrossAxisAlignment.center,
4548
children: <Widget>[
49+
50+
GFTitleBar(
51+
avatar: GFAvatar(
52+
child: Text("tb"),
53+
),
54+
title: Text('title'),
55+
subTitle: Text('subtitle'),
56+
icon: GFIconButton(
57+
icon: Icon(Icons.favorite_border),
58+
),
59+
),
60+
61+
GFCard(
62+
avatar: GFAvatar(
63+
child: Text("tb"),
64+
),
65+
title: Text('title'),
66+
subTitle: Text('subtitle'),
67+
icon: GFIconButton(
68+
icon: Icon(Icons.favorite_border),
69+
type: GFType.transparent,
70+
),
71+
),
72+
73+
74+
4675
// GFCard(
4776
// headertype: GFAtb(),
4877
// po
@@ -75,7 +104,7 @@ class _MyHomePageState extends State<MyHomePage> {
75104
onPressed: null,
76105
icon: Icon(Icons.ac_unit),
77106
),
78-
counterChild: GFCounter(
107+
counterChild: GFBadge(
79108
text: '12',
80109
// color: GFColor.dark,
81110
// shape: GFShape.circle,
@@ -104,7 +133,7 @@ class _MyHomePageState extends State<MyHomePage> {
104133
// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid),
105134
// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero),
106135
),
107-
GFBadges(
136+
GFButtonBadge(
108137
onPressed: null,
109138
// position: GFIconPosition.start,
110139
// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid),
@@ -114,7 +143,7 @@ class _MyHomePageState extends State<MyHomePage> {
114143
// shape: GFShape.pills,
115144
// type: GFType.outline,
116145
// size: GFSize.small,
117-
counterChild: GFCounter(
146+
counterChild: GFBadge(
118147
child: Text("12"),
119148
// color: GFColor.dark,
120149
// shape: GFShape.circle,
@@ -124,7 +153,7 @@ class _MyHomePageState extends State<MyHomePage> {
124153
// textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0),
125154
),
126155
),
127-
GFCounter(
156+
GFBadge(
128157
text: '12',
129158
// color: GFColor.dark,
130159
// shape: GFShape.circle,

‎lib/components/badge/gf_badge.dart‎

Lines changed: 70 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -1,123 +1,122 @@
11
import 'package:flutter/material.dart';
22
import 'package:ui_kit/shape/gf_shape.dart';
33
import 'package:ui_kit/size/gf_size.dart';
4-
import 'package:ui_kit/types/gf_type.dart';
5-
import 'package:ui_kit/position/gf_position.dart';
64
import 'package:ui_kit/colors/color.dart';
7-
import 'package:ui_kit/components/button/gf_button.dart';
85

9-
class GFBadges extends StatefulWidget {
6+
class GFBadge extends StatefulWidget {
107

11-
/// Called when the badge is tapped or otherwise activated.
12-
final VoidCallback onPressed;
8+
/// The border side for the button's [Material].
9+
final BorderSide border;
1310

14-
/// Defines the default text style, with [Material.textStyle], for the button's [child].
15-
final TextStyle textStyle;
16-
17-
/// The border side for the badge's [Material].
18-
final BorderSide borderSide;
19-
20-
/// The internal padding for the badge's [child].
21-
final EdgeInsetsGeometry padding;
22-
23-
/// The shape of the badge's [Material].
11+
/// Typically the counter button's shape.
2412
final ShapeBorder borderShape;
2513

26-
/// Badge type of [GFType] i.e, solid, outline, transparent
27-
final GFType type;
28-
29-
/// Badge type of [GFShape] i.e, standard, pills, square
14+
/// Counter type of [GFShape] i.e, standard, pills, square,
3015
final GFShape shape;
3116

3217
/// Pass [GFColor] or [Color]
3318
final dynamic color;
3419

35-
/// Pass [GFColor] or [Color]
36-
final dynamic textColor;
37-
3820
/// size of [double] or [GFSize] i.e, 1.2, small, medium, large etc.
39-
final dynamic size;
21+
final GFSize size;
4022

4123
/// text of type [String] is alternative to child. text will get priority over child
42-
final String text;
24+
final Widget child;
4325

4426
/// text of type [String] is alternative to child. text will get priority over child
45-
final Widget counterChild;
27+
final String text;
28+
29+
/// text style of counter text
30+
final TextStyle textStyle;
4631

47-
/// icon type of [GFPosition] i.e, start, end
48-
final GFPosition position;
32+
/// Pass [GFColor] or [Color]
33+
final dynamic textColor;
4934

50-
/// Create badges of all types. check out gfIconBadges for icon badges
5135

52-
const GFBadges({
36+
/// Create counter of all types, check out [GFBadge] for button badges and [GFIconBadge] for icon badges
37+
38+
const GFBadge({
5339
Key key,
54-
@required this.onPressed,
5540
this.textStyle,
56-
this.padding = const EdgeInsets.symmetric(horizontal: 8.0),
5741
this.borderShape,
58-
this.type = GFType.solid,
5942
this.shape = GFShape.standard,
60-
this.color = GFColor.primary,
43+
this.color = GFColor.secondary,
6144
this.textColor = GFColor.dark,
62-
this.position = GFPosition.end,
6345
this.size = GFSize.medium,
64-
this.borderSide,
65-
@required this.text,
66-
@required this.counterChild,
46+
this.border,
47+
this.text,
48+
@required this.child,
6749
}) :
68-
assert(shape != null, 'Badge shape can not be null',),
69-
assert(padding != null),
50+
assert(shape != null, 'Counter shape can not be null',),
7051
super(key: key);
7152

7253
@override
73-
_GFBadgesState createState() => _GFBadgesState();
54+
_GFBadgeState createState() => _GFBadgeState();
7455
}
7556

76-
class _GFBadgesState extends State<GFBadges> {
57+
class _GFBadgeState extends State<GFBadge> {
7758
Color color;
7859
Color textColor;
7960
Widget child;
80-
Widget icon;
81-
Function onPressed;
82-
GFType type;
83-
GFShape shape;
84-
double size;
85-
GFPosition position;
61+
GFShape counterShape;
62+
GFSize size;
63+
double height;
64+
double width;
65+
double fontSize;
8666

8767
@override
8868
void initState() {
8969
this.color = getGFColor(widget.color);
9070
this.textColor = getGFColor(widget.textColor);
91-
this.onPressed = widget.onPressed;
92-
this.type = widget.type;
93-
this.shape = widget.shape;
94-
this.size = getGFSize(widget.size);
95-
this.position = widget.position;
71+
this.child = widget.child == null ? Text(widget.text) : widget.child;
72+
this.counterShape = widget.shape;
73+
this.size = widget.size;
9674
super.initState();
9775
}
9876

9977
@override
10078
Widget build(BuildContext context) {
10179

102-
return ConstrainedBox(
103-
constraints: BoxConstraints(minHeight: 26.0, minWidth: 98.0),
104-
child: Container(
105-
height: this.size,
106-
child: GFButton(
107-
textStyle: widget.textStyle,
108-
borderSide: widget.borderSide,
109-
color: this.color,
110-
textColor: this.textColor,
111-
text: widget.text,
112-
onPressed: this.onPressed,
113-
type: this.type,
114-
shape: this.shape,
115-
position: this.position,
116-
size: this.size,
117-
borderShape: widget.borderShape,
118-
icon: widget.counterChild
80+
final Color themeColor = Theme.of(context).colorScheme.onSurface.withOpacity(0.12);
81+
final BorderSide shapeBorder = widget.border != null ? widget.border : BorderSide(color: this.color, width: 0.0,);
82+
83+
ShapeBorder shape;
84+
85+
if(this.counterShape == GFShape.pills){
86+
shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(50.0), side: shapeBorder);
87+
}else if(this.counterShape == GFShape.square){
88+
shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(0.0), side: shapeBorder);
89+
}else if(this.counterShape == GFShape.standard){
90+
shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0), side: shapeBorder);
91+
}else if(this.counterShape == GFShape.circle) {
92+
shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(100.0), side: shapeBorder);
93+
}
94+
95+
if(this.size == GFSize.small){
96+
this.height = 18.0; this.width = 24.0; this.fontSize = 10.0;
97+
}else if(this.size == GFSize.medium){
98+
this.height = 20.0; this.width = 26.0; this.fontSize = 12.0;
99+
}else if(this.size == GFSize.large){
100+
this.height = 24.0; this.width = 30.0; this.fontSize = 12.0;
101+
}
102+
103+
104+
return Container(
105+
height: this.height,
106+
width: this.counterShape == GFShape.circle ? this.height : this.width,
107+
child: Material(
108+
textStyle: this.textColor != null ? TextStyle(color: this.textColor, fontSize: this.fontSize): widget.textStyle,
109+
shape: widget.borderShape == null ? shape : widget.borderShape,
110+
color: this.color,
111+
type: MaterialType.button,
112+
child: Container(
113+
child: Center(
114+
widthFactor: 1.0,
115+
heightFactor: 1.0,
116+
child: this.child,
117+
),
119118
),
120119
),
121120
);
122121
}
123-
}
122+
}

0 commit comments

Comments
 (0)