Compare commits

...

4 Commits

Author SHA1 Message Date
3679efece1 feat'ui_kit): increase top bar leading width
All checks were successful
continuous-integration/drone/push Build is passing
2023-04-12 12:31:00 +00:00
8c06f98624 feat(ui_kit): make top bar selector customizable 2023-04-12 12:31:00 +00:00
30a7cc4894 feat(ui_component): generate new skillcard component 2023-04-12 12:31:00 +00:00
6f09eeca0e feat(ui_kit): make skillcard header icon customizable 2023-04-12 12:31:00 +00:00
10 changed files with 105 additions and 66 deletions

View File

@ -43,7 +43,7 @@ abstract class SkillCardComponent extends CardComponent
super.key, super.key,
}); });
final IconData? icon; final Widget? icon;
final List<Color>? gradient; final List<Color>? gradient;
final TextWrapper? title; final TextWrapper? title;
final TextWrapper? description; final TextWrapper? description;

View File

@ -7,7 +7,7 @@ part of 'skill_card_component.dart';
// ************************************************************************** // **************************************************************************
abstract class $SkillCardComponentCWProxy { abstract class $SkillCardComponentCWProxy {
SkillCardComponent icon(IconData? icon); SkillCardComponent icon(Widget? icon);
SkillCardComponent gradient(List<Color>? gradient); SkillCardComponent gradient(List<Color>? gradient);
SkillCardComponent title(TextWrapper? title); SkillCardComponent title(TextWrapper? title);
SkillCardComponent description(TextWrapper? description); SkillCardComponent description(TextWrapper? description);
@ -25,7 +25,7 @@ abstract class $SkillCardComponentCWProxy {
SkillCardComponent background(Widget? background); SkillCardComponent background(Widget? background);
SkillCardComponent key(Key? key); SkillCardComponent key(Key? key);
SkillCardComponent call({ SkillCardComponent call({
IconData? icon, Widget? icon,
List<Color>? gradient, List<Color>? gradient,
TextWrapper? title, TextWrapper? title,
TextWrapper? description, TextWrapper? description,

View File

@ -36,7 +36,18 @@ class SkillCards extends StatelessWidget {
children: [ children: [
SkillCard( SkillCard(
gradient: const [Colors.red, Colors.orange], gradient: const [Colors.red, Colors.orange],
icon: Icons.ac_unit_sharp, icon: Container(
padding: const EdgeInsets.all(15),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.white.withOpacity(0.04),
),
child: const GradientIcon(
Icons.ac_unit_sharp,
gradient:
LinearGradient(colors: [Colors.red, Colors.orange]),
),
),
title: 'Lorem Ipsum'.wrap(), title: 'Lorem Ipsum'.wrap(),
description: 'Cupidatat reprehenderit aliqua eiusmod Lorem. ' description: 'Cupidatat reprehenderit aliqua eiusmod Lorem. '
'Qui ipsum id ea ea nulla labore aute ullamco aute ' 'Qui ipsum id ea ea nulla labore aute ullamco aute '
@ -54,7 +65,19 @@ class SkillCards extends StatelessWidget {
const Gap(20), const Gap(20),
SkillCard( SkillCard(
gradient: const [Colors.blue, Colors.green], gradient: const [Colors.blue, Colors.green],
icon: Icons.ac_unit_sharp, icon: Container(
padding: const EdgeInsets.all(15),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.white.withOpacity(0.04),
),
child: const GradientIcon(
Icons.ac_unit_sharp,
gradient: LinearGradient(
colors: [Colors.blue, Colors.green],
),
),
),
title: 'Lorem Ipsum'.wrap(), title: 'Lorem Ipsum'.wrap(),
description: 'Cupidatat reprehenderit aliqua eiusmod Lorem. ' description: 'Cupidatat reprehenderit aliqua eiusmod Lorem. '
'Qui ipsum id ea ea nulla labore aute ullamco aute ' 'Qui ipsum id ea ea nulla labore aute ullamco aute '

View File

@ -22,8 +22,8 @@ EXTERNAL SOURCES:
SPEC CHECKSUMS: SPEC CHECKSUMS:
FlutterMacOS: 8f6f14fa908a6fb3fba0cd85dbd81ec4b251fb24 FlutterMacOS: 8f6f14fa908a6fb3fba0cd85dbd81ec4b251fb24
path_provider_foundation: 37748e03f12783f9de2cb2c4eadfaa25fe6d4852 path_provider_foundation: c68054786f1b4f3343858c1e1d0caaded73f0be9
shared_preferences_foundation: 297b3ebca31b34ec92be11acd7fb0ba932c822ca shared_preferences_foundation: 986fc17f3d3251412d18b0265f9c64113a8c2472
PODFILE CHECKSUM: 353c8bcc5d5b0994e508d035b5431cfe18c1dea7 PODFILE CHECKSUM: 353c8bcc5d5b0994e508d035b5431cfe18c1dea7

View File

@ -96,7 +96,7 @@ class TopNavigationBar extends TopNavigationBarComponent
), ),
primary: primary ?? true, primary: primary ?? true,
excludeHeaderSemantics: excludeHeaderSemantics ?? false, excludeHeaderSemantics: excludeHeaderSemantics ?? false,
leadingWidth: 200, leadingWidth: 300,
title: Row( title: Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: navigationItems != null children: navigationItems != null

View File

@ -33,8 +33,28 @@ class NavigationItem extends StatelessWidget {
children: [ children: [
if (selected) if (selected)
Container( Container(
height: 5, height: ThemeHelper.getThemeElement<double, double>(
width: 70, [
context
.themeExtension<TopBarThemeExtension>()
?.selectedIndicatorHeight,
// TODO: move default value
5,
],
valueValidator: (value) => value != null,
transform: (value) => value,
),
width: ThemeHelper.getThemeElement<double, double>(
[
context
.themeExtension<TopBarThemeExtension>()
?.selectedIndicatorWidth,
// TODO: move default value
70,
],
valueValidator: (value) => value != null,
transform: (value) => value,
),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(100), borderRadius: BorderRadius.circular(100),
color: ThemeHelper.getThemeElement<Color, Color>( color: ThemeHelper.getThemeElement<Color, Color>(
@ -49,22 +69,37 @@ class NavigationItem extends StatelessWidget {
), ),
), ),
), ),
SizedBox( ConstrainedBox(
height: 50, constraints: BoxConstraints(
child: Center( minWidth: ThemeHelper.getThemeElement<double, double>(
child: Text( [
item.data, context
style: ThemeHelper.getThemeElement<TextStyle, TextStyle>( .themeExtension<TopBarThemeExtension>()
[ ?.selectedIndicatorWidth,
context.textTheme.titleMedium, // TODO: move default value
context 70,
.themeExtension<TopBarThemeExtension>() ],
?.subTitleStyle, valueValidator: (value) => value != null,
item.style, transform: (value) => value,
], ) ?? double.infinity,
combine: (value, element) => value?.merge(element), ),
valueValidator: (value) => value != null, child: SizedBox(
transform: (value) => value, height: 50,
child: Center(
child: Text(
item.data,
style: ThemeHelper.getThemeElement<TextStyle, TextStyle>(
[
context.textTheme.titleMedium,
context
.themeExtension<TopBarThemeExtension>()
?.subTitleStyle,
item.style,
],
combine: (value, element) => value?.merge(element),
valueValidator: (value) => value != null,
transform: (value) => value,
),
), ),
), ),
), ),

View File

@ -62,7 +62,6 @@ class SkillCard extends SkillCardComponent with $SkillCardCWMixin {
secondaryBackgroundColors: secondaryBackgroundColors, secondaryBackgroundColors: secondaryBackgroundColors,
icon: icon, icon: icon,
title: title, title: title,
gradient: gradient,
), ),
const Gap(25), const Gap(25),
if (description != null) ...[ if (description != null) ...[

View File

@ -10,7 +10,7 @@ class $SkillCardCWProxyImpl implements $SkillCardComponentCWProxy {
const $SkillCardCWProxyImpl(this._value); const $SkillCardCWProxyImpl(this._value);
final SkillCard _value; final SkillCard _value;
@override @override
SkillCard icon(IconData? icon) => this(icon: icon); SkillCard icon(Widget? icon) => this(icon: icon);
@override @override
SkillCard gradient(List<Color>? gradient) => this(gradient: gradient); SkillCard gradient(List<Color>? gradient) => this(gradient: gradient);
@override @override
@ -48,7 +48,7 @@ class $SkillCardCWProxyImpl implements $SkillCardComponentCWProxy {
SkillCard key(Key? key) => this(key: key); SkillCard key(Key? key) => this(key: key);
@override @override
SkillCard call({ SkillCard call({
IconData? icon, Widget? icon,
List<Color>? gradient, List<Color>? gradient,
TextWrapper? title, TextWrapper? title,
TextWrapper? description, TextWrapper? description,

View File

@ -18,61 +18,38 @@ import 'package:flutter/material.dart';
import 'package:gap/gap.dart'; import 'package:gap/gap.dart';
import 'package:wyatt_ui_components/wyatt_ui_components.dart'; import 'package:wyatt_ui_components/wyatt_ui_components.dart';
import 'package:wyatt_ui_kit/src/components/cards/widgets/card_text.dart'; import 'package:wyatt_ui_kit/src/components/cards/widgets/card_text.dart';
import 'package:wyatt_ui_kit/src/components/gradients/gradient_icon.dart';
import 'package:wyatt_ui_kit/src/domain/card_theme_extension.dart';
class SkillCardHeader extends StatelessWidget { class SkillCardHeader extends StatelessWidget {
const SkillCardHeader({ const SkillCardHeader({
super.key, super.key,
this.icon, this.icon,
this.title, this.title,
this.gradient,
this.secondaryBackgroundColors, this.secondaryBackgroundColors,
}); });
final IconData? icon; final Widget? icon;
final TextWrapper? title; final TextWrapper? title;
final List<Color>? gradient;
final Color? secondaryBackgroundColors; final Color? secondaryBackgroundColors;
@override @override
Widget build(BuildContext context) => Column( Widget build(BuildContext context) => Column(
children: [ children: [
if (icon != null) ...[ if (icon != null) ...[
Container( icon!,
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: secondaryBackgroundColors ??
Theme.of(context)
.extension<CardThemeExtension>()
?.secondaryBackgroundColor,
),
child: gradient != null
? GradientIcon(
icon,
size: 45,
gradient: LinearGradient(colors: gradient!),
)
: Icon(
icon,
size: 45,
),
),
const Gap(25), const Gap(25),
Column(
children: [
if (title != null) ...[
CardText(
title!,
textType: TextType.title,
style: title!.style,
gradientColors: title!.gradientColors,
),
],
],
)
], ],
Column(
children: [
if (title != null) ...[
CardText(
title!,
textType: TextType.title,
style: title!.style,
gradientColors: title!.gradientColors,
),
],
],
)
], ],
); );
} }

View File

@ -25,6 +25,8 @@ abstract class TopBarThemeExtension
this.secondaryColor, this.secondaryColor,
this.titleStyle, this.titleStyle,
this.subTitleStyle, this.subTitleStyle,
this.selectedIndicatorHeight,
this.selectedIndicatorWidth,
}); });
final MultiColor? backgroundColors; final MultiColor? backgroundColors;
@ -33,4 +35,7 @@ abstract class TopBarThemeExtension
final TextStyle? titleStyle; final TextStyle? titleStyle;
final TextStyle? subTitleStyle; final TextStyle? subTitleStyle;
final double? selectedIndicatorHeight;
final double? selectedIndicatorWidth;
} }