Accessibility in Flutter Signature Pad (SfSignaturePad)

18 Nov 20181 minute to read

Screen reader

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

DART

@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 colors of the SfSignaturePad using the following APIs to ensure sufficient contrast:

• Background
• Stroke

Easier touch targets

The SfSignaturePad has a touch target size of 48 × 48 pixels, which meets accessibility standards.