Accessibility in Flutter SignaturePad (SfSignaturePad)

18 May 20211 minute to read

Screen reader

The SfSignaturePad can be accessed by the screen readers by wrapping the SfSignaturePad widget to the Semantics widget.

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Center(
      child: Semantics(
        label: 'Syncfusion Flutter SignaturePad',
        hint: 'Mark your signature in this',
        child: Container(
          child: SfSignaturePad(
            strokeColor: Colors.black,
            backgroundColor: Colors.white,
            maximumStrokeWidth: 5,
            minimumStrokeWidth: 1,
          ),
          width: 200,
          height: 200,
        ),
      ),
    ),
  );
}

Sufficient contrast

You can customize the color of the SfSignaturePad using the following APIs for the sufficient contrast.

Easier touch targets

The SfSignaturePad has touch target as 48 * 48 as per the standard.