4Q-s-r-o / signature

Flutter plugin that creates a canvas for writing down a signature
MIT License
252 stars 83 forks source link

Fixed an issue where the signature export to svg was not working correctly #91

Closed dubydu closed 10 months ago

dubydu commented 1 year ago

The bug described in issue #87 has been fixed in this PR.

henry2man commented 1 year ago

Please review the colorToHex method. We're getting weird colors because current implementation creates HEX colors with alpha values, which is not supported. For example Colors.black creates #ff000000. In some engines this is treated like red color (#ff0000).

Here it is a fixed implementation:

 String colorToHex(Color c) => '#${c.red.toRadixString(16).padLeft(2, '0')}'
        '${c.green.toRadixString(16).padLeft(2, '0')}'
        '${c.blue.toRadixString(16).padLeft(2, '0')}';

Also, if we want to add some kind of opacity / alpha color, we can use stroke-opacity attribute:

    double colorToOpacity(Color c) => c.opacity;
    ...
    return MapEntry<int, String>(
              index,
              '<polyline '
              'fill="none" '
              'stroke="${colorToHex(penColor)}" '
              // 🔥 Set Stroke Opacity here
              'stroke-opacity="${colorToOpacity(penColor)}" '
              'points="$stroke" '
              'stroke-linecap="$toSvgLineCap" '
              'stroke-width="$penStrokeWidth" '
              '/>');
MartinHlavna commented 10 months ago

@henry2man thanks I will also use your suggestions in fix