Incorrect icon alignment with canvaskit renderer web even after using no icon tree shaking

25 views Asked by At

i have written this code for custom button with suffix or prefix icon but after deployment the alignment is not coming correct for web view.

return Center(
      child: Padding(
        padding: widget.contentPadding,
        child: Row(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            if (widget.prefixIcon != null) ...[
              Icon(
                widget.prefixIcon,
                size: widget.type == ButtonType.link ? 20 : widget.iconSize,
                color: widget.type == ButtonType.primary
                    ? DigitButtonConstants.defaultTextColor
                    : (widget.isDisabled
                    ? DigitButtonConstants.defaultDisabledColor
                    : DigitButtonConstants.defaultPrimaryColor),
              ),
              SizedBox(width: widget.type == ButtonType.link  ? kPadding/2:kPadding),
            ],
            Flexible(
              child: Text(
                truncatedLabel,
                style: widget.type == ButtonType.link
                    ? DigitTheme.instance.mobileTheme.textTheme.bodyLarge
                    ?.copyWith(
                  height: 1.172,
                  color: widget.isDisabled
                      ? DigitButtonConstants.defaultDisabledColor
                      : DigitButtonConstants.defaultPrimaryColor,
                  decoration: TextDecoration.underline,
                  decorationColor: widget.isDisabled

                      ? DigitButtonConstants.defaultDisabledColor
                      : DigitButtonConstants.defaultPrimaryColor,)
                    : DigitTheme.instance.mobileTheme.textTheme.labelLarge
                    ?.copyWith(
                  height: 1.5,
                  color: widget.type == ButtonType.primary
                      ? DigitButtonConstants.defaultTextColor
                      : (widget.isDisabled
                      ? DigitButtonConstants.defaultDisabledColor
                      : DigitButtonConstants.defaultPrimaryColor),
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            if (widget.suffixIcon != null) ...[
              SizedBox(width: widget.type == ButtonType.link  ? kPadding/2:kPadding),
              Icon(
                widget.suffixIcon,
                size: widget.type == ButtonType.link ? 20 : widget.iconSize,
                color: widget.type == ButtonType.primary
                    ? DigitButtonConstants.defaultTextColor
                    : (widget.isDisabled
                    ? DigitButtonConstants.defaultDisabledColor
                    : DigitButtonConstants.defaultPrimaryColor),
              ),
            ],
          ],
        ),
      ),
    );

i was expecting something like this

enter image description here

but after deployment it is looking like this

enter image description here

and this is working fine is android devide only for web i am getting this issue.

0

There are 0 answers