diff --git a/lib/src/extensions/inner_border_radius.dart b/lib/src/extensions/inner_border_radius.dart new file mode 100644 index 000000000..87c4202f1 --- /dev/null +++ b/lib/src/extensions/inner_border_radius.dart @@ -0,0 +1,25 @@ +import 'package:flutter/widgets.dart'; + +extension InnerBorderRadius on BorderRadius { + /// Computer an inner border radius from a given padding + BorderRadius inner(EdgeInsets padding) { + return BorderRadius.only( + topLeft: Radius.elliptical( + topLeft.x - padding.left / 2, + topLeft.y - padding.top / 2, + ), + topRight: Radius.elliptical( + topRight.x - padding.right / 2, + topRight.y - padding.top / 2, + ), + bottomRight: Radius.elliptical( + bottomRight.x - padding.right / 2, + bottomRight.y - padding.bottom / 2, + ), + bottomLeft: Radius.elliptical( + bottomLeft.x - padding.left / 2, + bottomLeft.y - padding.bottom / 2, + ), + ); + } +} diff --git a/lib/src/utilities/yaru_banner.dart b/lib/src/utilities/yaru_banner.dart index 3f0312910..13edeb410 100644 --- a/lib/src/utilities/yaru_banner.dart +++ b/lib/src/utilities/yaru_banner.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:yaru_widgets/src/extensions/inner_border_radius.dart'; import 'package:yaru_widgets/yaru_widgets.dart'; /// A colorable [Card] with a border which is tap-able via an [onTap] callback. @@ -62,7 +63,7 @@ class YaruBanner extends StatelessWidget { return InkWell( onTap: onTap, borderRadius: borderRadius, - hoverColor: Theme.of(context).colorScheme.onSurface.withOpacity(0.1), + hoverColor: Theme.of(context).primaryColor.withOpacity(0.3), child: surfaceTintColor != null ? Stack( children: [ @@ -163,7 +164,8 @@ class _Banner extends StatelessWidget { surfaceTintColor: color, elevation: elevation, shape: RoundedRectangleBorder( - borderRadius: borderRadius, + borderRadius: borderRadius + .inner(const EdgeInsets.all(4.0)), // 4 is the default margin side: BorderSide(color: Theme.of(context).dividerColor, width: 1), ), child: Align( diff --git a/lib/src/utilities/yaru_selectable_container.dart b/lib/src/utilities/yaru_selectable_container.dart index 9476baf81..928a4e6f8 100644 --- a/lib/src/utilities/yaru_selectable_container.dart +++ b/lib/src/utilities/yaru_selectable_container.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:yaru_widgets/src/constants.dart'; +import 'package:yaru_widgets/src/extensions/inner_border_radius.dart'; class YaruSelectableContainer extends StatelessWidget { /// Creates a Image Tile from the image path given in the path property. @@ -43,24 +44,6 @@ class YaruSelectableContainer extends StatelessWidget { Widget build(BuildContext context) { final padding = this.padding ?? const EdgeInsets.all(6); final borderRadius = this.borderRadius ?? BorderRadius.circular(radius); - final innerBorderRadius = BorderRadius.only( - topLeft: Radius.elliptical( - borderRadius.topLeft.x - padding.left / 2, - borderRadius.topLeft.y - padding.top / 2, - ), - topRight: Radius.elliptical( - borderRadius.topRight.x - padding.right / 2, - borderRadius.topRight.y - padding.top / 2, - ), - bottomRight: Radius.elliptical( - borderRadius.bottomRight.x - padding.right / 2, - borderRadius.bottomRight.y - padding.bottom / 2, - ), - bottomLeft: Radius.elliptical( - borderRadius.bottomLeft.x - padding.left / 2, - borderRadius.bottomLeft.y - padding.bottom / 2, - ), - ); return InkWell( borderRadius: borderRadius, @@ -76,7 +59,7 @@ class YaruSelectableContainer extends StatelessWidget { child: Padding( padding: padding, child: ClipRRect( - borderRadius: innerBorderRadius, + borderRadius: borderRadius.inner(padding), child: child, ), ),