beenull/ente
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Fixed border issue on button component

Browse source
This commit is contained in:
ashilkn 2022-12-21 12:16:51 +05:30
parent c72934a95e
commit ec9a2d606b
1 changed files with 112 additions and 106 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

218
lib/ui/components/button_widget.dart
View file

@ -203,119 +203,125 @@ class _ButtonChildWidgetState extends State<ButtonChildWidget> {
onTapDown: _shouldRegisterGestures ? _onTapDown : null, onTapDown: _shouldRegisterGestures ? _onTapDown : null,
onTapUp: _shouldRegisterGestures ? _onTapUp : null, onTapUp: _shouldRegisterGestures ? _onTapUp : null,
onTapCancel: _shouldRegisterGestures ? _onTapCancel : null, onTapCancel: _shouldRegisterGestures ? _onTapCancel : null,
child: AnimatedContainer( child: Container(
duration: const Duration(milliseconds: 16),
width: widget.buttonSize == ButtonSize.large ? double.infinity : null,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(4)), borderRadius: const BorderRadius.all(Radius.circular(4)),
color: buttonColor,
border: Border.all(color: borderColor), border: Border.all(color: borderColor),
), ),
child: Padding( child: AnimatedContainer(
padding: const EdgeInsets.symmetric(vertical: 14, horizontal: 16), duration: const Duration(milliseconds: 16),
child: AnimatedSwitcher( width: widget.buttonSize == ButtonSize.large ? double.infinity : null,
duration: const Duration(milliseconds: 175), decoration: BoxDecoration(
switchInCurve: Curves.easeInOutExpo, borderRadius: const BorderRadius.all(Radius.circular(4)),
switchOutCurve: Curves.easeInOutExpo, color: buttonColor,
child: executionState == ExecutionState.idle ),
? widget.buttonType.hasTrailingIcon child: Padding(
? Row( padding: const EdgeInsets.symmetric(vertical: 14, horizontal: 16),
mainAxisAlignment: MainAxisAlignment.spaceBetween, child: AnimatedSwitcher(
children: [ duration: const Duration(milliseconds: 175),
widget.labelText == null switchInCurve: Curves.easeInOutExpo,
? const SizedBox.shrink() switchOutCurve: Curves.easeInOutExpo,
: Flexible( child: executionState == ExecutionState.idle
child: Padding( ? widget.buttonType.hasTrailingIcon
padding: widget.icon == null ? Row(
? const EdgeInsets.symmetric( mainAxisAlignment: MainAxisAlignment.spaceBetween,
horizontal: 8, children: [
) widget.labelText == null
: const EdgeInsets.only(right: 16), ? const SizedBox.shrink()
child: Text( : Flexible(
widget.labelText!, child: Padding(
overflow: TextOverflow.ellipsis, padding: widget.icon == null
maxLines: 2, ? const EdgeInsets.symmetric(
style: labelStyle, horizontal: 8,
)
: const EdgeInsets.only(right: 16),
child: Text(
widget.labelText!,
overflow: TextOverflow.ellipsis,
maxLines: 2,
style: labelStyle,
),
), ),
), ),
), widget.icon == null
widget.icon == null ? const SizedBox.shrink()
? const SizedBox.shrink() : Icon(
: Icon( widget.icon,
widget.icon, size: 20,
size: 20, color: iconColor,
color: iconColor, ),
),
],
)
: Builder(
builder: (context) {
SchedulerBinding.instance.addPostFrameCallback(
(timeStamp) {
final box =
context.findRenderObject() as RenderBox;
widthOfButton = box.size.width;
},
);
return Row(
mainAxisSize: widget.buttonSize == ButtonSize.large
? MainAxisSize.max
: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
widget.icon == null
? const SizedBox.shrink()
: Icon(
widget.icon,
size: 20,
color: iconColor,
),
widget.icon == null || widget.labelText == null
? const SizedBox.shrink()
: const SizedBox(width: 8),
widget.labelText == null
? const SizedBox.shrink()
: Flexible(
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 8,
),
child: Text(
widget.labelText!,
style: labelStyle,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
)
],
);
},
)
: executionState == ExecutionState.inProgress
? SizedBox(
width: widthOfButton,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
EnteLoadingWidget(
is20pts: true,
color: loadingIconColor,
),
], ],
), )
) : Builder(
: executionState == ExecutionState.successful builder: (context) {
? SizedBox( SchedulerBinding.instance.addPostFrameCallback(
width: widthOfButton, (timeStamp) {
child: Icon( final box =
Icons.check_outlined, context.findRenderObject() as RenderBox;
size: 20, widthOfButton = box.size.width;
color: checkIconColor, },
), );
) return Row(
: const SizedBox.shrink(), //fallback mainAxisSize:
widget.buttonSize == ButtonSize.large
? MainAxisSize.max
: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
widget.icon == null
? const SizedBox.shrink()
: Icon(
widget.icon,
size: 20,
color: iconColor,
),
widget.icon == null || widget.labelText == null
? const SizedBox.shrink()
: const SizedBox(width: 8),
widget.labelText == null
? const SizedBox.shrink()
: Flexible(
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 8,
),
child: Text(
widget.labelText!,
style: labelStyle,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
)
],
);
},
)
: executionState == ExecutionState.inProgress
? SizedBox(
width: widthOfButton,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
EnteLoadingWidget(
is20pts: true,
color: loadingIconColor,
),
],
),
)
: executionState == ExecutionState.successful
? SizedBox(
width: widthOfButton,
child: Icon(
Icons.check_outlined,
size: 20,
color: checkIconColor,
),
)
: const SizedBox.shrink(), //fallback
),
), ),
), ),
), ),