fix: initial popup illustration customization iOS

[murilofank]

Fix on iOS side.
There was a issue when trying to customize the document illustration displayed on the initial popup, on the document capture flow.

Fix evidences

SDK default configuration:

default-illustration.MP4

With Customization:

custom-illustration.MP4

How to test

1. First of all, install the pubspec in the main project and in the example app.

// in the root folder
flutter pub get

//after that
cd example
flutter pub get

2. Next, install the pods.

// in the root folder
cd example/ios
pod install

3. Open the Runner.xcworkspace, located inside Flutter/example/ios.
4. Add the image file to the app Assets.
5. Implement the customization on test app /example/lib/main.dart, you can replace the code with this:

import 'package:document_detector/caf_stage.dart';
import 'package:document_detector/ios/step_customization.dart';
import 'package:document_detector/document_detector_step.dart';
import 'package:document_detector/document_type.dart';
import 'package:document_detector/result/document_detector_failure.dart';
import 'package:document_detector/result/document_detector_result.dart';
import 'package:document_detector/result/document_detector_success.dart';
import 'package:flutter/material.dart';

import 'package:document_detector/document_detector.dart';
import 'package:flutter/services.dart';
import 'package:permission_handler/permission_handler.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _result = "";
  String _description = "";

// You will need to give a valid mobileToken here for .Beta environment
  String mobileToken = "INSERT YOUR MOBILETOKEN HERE";

  @override
  void initState() {
    super.initState();
    requestPermissions();
  }

  void requestPermissions() async {
    await [
      Permission.camera,
    ].request();
  }

// Here is the configuration to customize the illustration displayed in the initial popup
// replace the parameter with your image file name.
// this object is passed on as a parameter on line 101
  DocumentDetectorStepCustomizationIos stepCustomizationIos =
      DocumentDetectorStepCustomizationIos(
          illustration: 'YOUR IMAGE FILE NAME');

  void startDocumentDetector(List<DocumentDetectorStep> documentSteps) async {
    String result = "";
    String description = "";

    DocumentDetector documentDetector =
        new DocumentDetector(mobileToken: mobileToken);

    documentDetector.setStage(CafStage.BETA);
    documentDetector.setDocumentFlow(documentSteps);

    try {
      DocumentDetectorResult documentDetectorResult =
          await documentDetector.start();

      if (documentDetectorResult is DocumentDetectorSuccess) {
        result = "Success!";
      } else if (documentDetectorResult is DocumentDetectorFailure) {
        result = "Failure!";
      } else {
        result = "Closed!";
      }
    } on PlatformException catch (err) {
      result = "Excpection!";
      description = err.message!;
    }

    if (!mounted) return;

    setState(() {
      _result = result;
      _description = description;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            appBar: AppBar(
              title: const Text('DocumentDetector plugin example'),
            ),
            body: Container(
                margin: const EdgeInsets.all(20.0),
                child: Column(
                  children: [
                    Row(
                      children: [
                        ElevatedButton(
                          child: Text('Start DocumentDetector for CNH'),
                          onPressed: () async {
                            startDocumentDetector([
                              new DocumentDetectorStep(
                                  ios: stepCustomizationIos,
                                  document: DocumentType.CNH_FRONT)
                            ]);
                          },
                        )
                      ],
                    ),
                    Row(
                      children: [
                        Container(
                            margin: EdgeInsets.only(top: 10.0),
                            child: Text("Result: $_result"))
                      ],
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          child: Text("Description:\n$_description",
                              overflow: TextOverflow.clip),
                        )
                      ],
                    ),
                  ],
                ))));
  }
}

6. Run the test app.

[marcuscaf]

👍