### Complete SparkScan Web Example

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/sparkscan/get-started.md

This example demonstrates the full setup for SparkScan, including license key initialization, symbology configuration, event handling for scans, and view setup with custom feedback. Ensure you replace the placeholder license key and provide the correct library location.

```javascript
import {
  SparkScan,
  SparkScanBarcodeErrorFeedback,
  SparkScanBarcodeSuccessFeedback,
  SparkScanSettings,
  SparkScanView,
  SparkScanViewSettings,
  Symbology,
  barcodeCaptureLoader,
} from "@scandit/web-datacapture-barcode";
import { DataCaptureContext } from "@scandit/web-datacapture-core";

const context = await DataCaptureContext.forLicenseKey(
  "-- ENTER YOUR SCANDIT LICENSE KEY HERE --",
  {
    libraryLocation: "/self-hosted-sdc-lib/",
    moduleLoaders: [barcodeCaptureLoader()],
  }
);

const settings = new SparkScanSettings();
settings.enableSymbologies([
  Symbology.EAN13UPCA,
  Symbology.Code128,
  Symbology.QR,
]);

const sparkScan = SparkScan.forSettings(settings);

sparkScan.addListener({
  didScan: (sparkScan, session) => {
    const barcode = session.newlyRecognizedBarcode;

    if (barcode) {
      console.log("Scanned", barcode.symbology, barcode.data);
    }
  },
});

const viewSettings = new SparkScanViewSettings();

const view = SparkScanView.forElement(
  document.body,
  context,
  sparkScan,
  viewSettings
);

view.feedbackDelegate = {
  getFeedbackForBarcode: (barcode) => {
    if (barcode.data === "5901234123457") {
      return new SparkScanBarcodeErrorFeedback("Invalid barcode.", 60_000);
    } else {
      return new SparkScanBarcodeSuccessFeedback();
    }
  },
};

async function mount() {
  await view.prepareScanning();
}

async function unmount() {
  await view.stopScanning();
}

mount().catch(async (error) => {
  console.error(error);
  await unmount();
});
```

--------------------------------

### Start Development Server

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/getting-started.md

Start the development server to run the sample application locally.

```bash
npm run dev
```

--------------------------------

### Install Camera Sample Dependencies

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Install Video4Linux2 development files required for camera samples.

```bash
$ sudo apt-get install libv4l-dev
```

--------------------------------

### Install Dependencies

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/getting-started.md

Install the necessary npm packages for the sample application.

```bash
npm install
```

--------------------------------

### Setup V4L2 for Raspberry Pi

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Install v4l-utils and configure the bcm2835-v4l2 module for camera support on Raspberry Pi devices. A reboot is required after configuration.

```bash
sudo apt-get install v4l-utils
```

--------------------------------

### Install Image Processing Sample Dependencies

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Install SDL2 development files for loading images in the command-line image processing sample.

```bash
$ sudo apt-get install libsdl2-dev libsdl2-image-dev
```

--------------------------------

### Start Development Server with Yarn

Source: https://github.com/scandit/data-capture-documentation/blob/main/README.md

Starts a local development server for live preview of documentation changes. The server typically opens automatically in a browser.

```bash
$ yarn start
```

--------------------------------

### Complete Label Capture Implementation

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/label-capture/get-started.md

A comprehensive example demonstrating the initialization of Scandit Data Capture, camera setup, label definition, capture listener, and overlay configuration for Smart Label Capture.

```javascript
import {
  Camera,
  DataCaptureContext,
  DataCaptureView,
  FrameSourceState,
  RectangularViewfinder,
  RectangularViewfinderStyle,
} from "@scandit/web-datacapture-core";
import { Symbology } from "@scandit/web-datacapture-barcode";
import {
  CustomBarcodeBuilder,
  LabelCapture,
  LabelCaptureBasicOverlay,
  LabelCaptureSettingsBuilder,
  LabelDefinitionBuilder,
  TotalPriceTextBuilder,
  UnitPriceTextBuilder,
  labelCaptureLoader,
} from "@scandit/web-datacapture-label";

const context = await DataCaptureContext.forLicenseKey(
  "-- ENTER YOUR SCANDIT LICENSE KEY HERE --",
  {
    libraryLocation: "/self-hosted-sdc-lib/",
    moduleLoaders: [labelCaptureLoader()],
  }
);

const view = await DataCaptureView.forContext(context);
view.connectToElement(document.body);

const camera = Camera.pickBestGuess();
await context.setFrameSource(camera);

const cameraSettings = LabelCapture.createRecommendedCameraSettings();
await camera.applySettings(cameraSettings);

const priceLabel = await new LabelDefinitionBuilder()
  .addCustomBarcode(
    await new CustomBarcodeBuilder()
      .isOptional(false)
      .setSymbologies([Symbology.EAN13UPCA])
      .build("Barcode")
  )
  .addTotalPriceText(
    await new TotalPriceTextBuilder().isOptional(false).build("Total Price")
  )
  .addUnitPriceText(
    await new UnitPriceTextBuilder().isOptional(false).build("Unit Price")
  )
  .build("Price Label");

const settings = await new LabelCaptureSettingsBuilder()
  .addLabel(priceLabel)
  .build();

const labelCapture = await LabelCapture.forContext(context, settings);

labelCapture.addListener({
  didUpdateSession: async (labelCapture, session) => {
    session.capturedLabels.forEach((label) => {
      const barcode = label.fields.find((field) => field.name === "Barcode")
        ?.barcode?.data;

      const totalPrice = label.fields.find(
        (field) => field.name === "Total Price"
      )?.text;

      const unitPrice = label.fields.find(
        (field) => field.name === "Unit Price"
      )?.text;

      console.log("Captured:", { barcode, totalPrice, unitPrice });
    });

    await labelCapture.setEnabled(false);
  },
});

const overlay = await LabelCaptureBasicOverlay.withLabelCaptureForView(labelCapture, view);

const viewfinder = new RectangularViewfinder(RectangularViewfinderStyle.Square);
await overlay.setViewfinder(viewfinder);

async function mount() {
  await camera.switchToDesiredState(FrameSourceState.On);
}

async function unmount() {
  await camera.switchToDesiredState(FrameSourceState.Off);
  await labelCapture.setEnabled(false);
}

mount().catch(async (error) => {
  console.error(error);
  await unmount();
});
```

--------------------------------

### Install Python Image Processing Sample Dependencies

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Install SDL2 development files for Python 3, necessary for the Python image processing sample.

```bash
$ sudo apt-get install python3-sdl2
```

--------------------------------

### Install Barcode Generator Sample Dependencies

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Install libpng development files required for generating output images in the barcode generator sample.

```bash
$ sudo apt-get install libpng-dev
```

--------------------------------

### Start Local Docusaurus Development Server

Source: https://github.com/scandit/data-capture-documentation/blob/main/AGENTS.md

Use this command to start a local development server for previewing changes. Test navigation, links, and themes thoroughly.

```bash
npm start
```

--------------------------------

### MatrixScanCountViewController for iOS

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/ios/matrixscan-count/get-started-with-swift-ui.md

Implement the MatrixScan Count logic within a UIViewController. This class handles setup, camera management, and recognition listeners. Ensure to follow the main Get Started guide for the core implementation details.

```swift
import ScanditBarcodeCapture
import UIKit

class MatrixScanCountViewController: UIViewController {
    private var context: DataCaptureContext! 
    private var camera: Camera? 
    private var barcodeCount: BarcodeCount! 
    private var barcodeCountView: BarcodeCountView!

    override func viewDidLoad() {
        super.viewDidLoad()
        setupRecognition()
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        camera?.switch(toDesiredState: .on)
    }

    override func viewDidDisappear(_ animated: Bool) {
        super.viewDidDisappear(animated)
        camera?.switch(toDesiredState: .off)
    }

    func setupRecognition() {
        // Follow the implementation from the Get Started guide:
        // 1. Create data capture context
        // 2. Configure the Barcode Count Mode
        // 3. Obtain the camera instance and set frame source
        // 4. Register the listener to be informed when scan phase is complete
        // 5. Set the capture view and AR overlays
        // 6. Configure UI delegate for list and exit callbacks
    }
}

extension MatrixScanCountViewController: BarcodeCountListener {
    func barcodeCount(_ barcodeCount: BarcodeCount, 
                      didScanIn session: BarcodeCountSession, 
                      frameData: FrameData) {
        // Handle barcode count results
        // See the main Get Started guide
    }
}

extension MatrixScanCountViewController: BarcodeCountViewUIDelegate {
    func listButtonTapped(for view: BarcodeCountView) {
        // Handle list button tap
    }

    func exitButtonTapped(for view: BarcodeCountView) {
        // Handle exit button tap
    }
}
```

--------------------------------

### Barcode Selection View Controller Implementation

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/ios/barcode-selection/get-started-with-swift-ui.md

Implement a UIViewController to manage the barcode selection logic, including setup, camera control, and event handling. This class should follow the structure outlined in the main Get Started guide.

```swift
import ScanditBarcodeCapture
import UIKit

class BarcodeSelectionViewController: UIViewController {
    private var context: DataCaptureContext! 
    private var camera: Camera? 
    private var barcodeSelection: BarcodeSelection! 
    private var captureView: DataCaptureView! 
    private var overlay: BarcodeSelectionBasicOverlay! 

    override func viewDidLoad() {
        super.viewDidLoad() 
        setupRecognition()
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated) 
        barcodeSelection.isEnabled = true
        camera?.switch(toDesiredState: .on)
    }

    override func viewDidDisappear(_ animated: Bool) {
        super.viewDidDisappear(animated) 
        barcodeSelection.isEnabled = false
        camera?.switch(toDesiredState: .off)
    }

    func setupRecognition() {
        // Follow the implementation from the main Get Started guide:
        // 1. Create data capture context
        // 2. Configure the Barcode Selection Mode 
        // 3. Register the listener to receive scan events
        // 4. Obtain the camera instance and set as frame source
        // 5. Create capture view and overlay
    }
}

extension BarcodeSelectionViewController: BarcodeSelectionListener {
    func barcodeSelection(_ barcodeSelection: BarcodeSelection, 
                          didUpdateSelection session: BarcodeSelectionSession, 
                          frameData: FrameData?) {
        // Handle barcode selection results
        // See the main Get Started guide
    }
}
```

--------------------------------

### Navigate to Sample Directory

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/getting-started.md

Navigate to the specific sample application directory within the cloned repository.

```bash
cd datacapture-capacitor-samples/ListBuildingSample
```

--------------------------------

### Complete BarcodeCapture Setup with Rejection in TypeScript

Source: https://context7.com/scandit/data-capture-documentation/llms.txt

Set up BarcodeCapture for single barcode scanning in Web (TypeScript). Configure symbologies, set a duplicate filter, and implement a listener to process scanned barcodes, rejecting those that do not start with '09' and stopping the scan after a valid one. This example also includes camera setup and view connection.

```typescript
// Web (TypeScript) — complete BarcodeCapture setup with barcode rejection
import { DataCaptureContext, Camera, DataCaptureView, FrameSourceState, Brush } from '@scandit/web-datacapture-core';
import { BarcodeCaptureSettings, BarcodeCapture, BarcodeCaptureOverlay, Symbology, barcodeCaptureLoader } from '@scandit/web-datacapture-barcode';

const context = await DataCaptureContext.forLicenseKey('LICENSE_KEY', {
    libraryLocation: '/sdc-lib/',
    moduleLoaders: [barcodeCaptureLoader()],
});

const settings = new BarcodeCaptureSettings();
settings.enableSymbologies([Symbology.Code128, Symbology.Code39, Symbology.QR, Symbology.EAN13UPCA]);
settings.codeDuplicateFilter = 500;

const barcodeCapture = await BarcodeCapture.forContext(context, settings);
const view = await DataCaptureView.forContext(context);
view.connectToElement(document.getElementById('scanner'));
const overlay = await BarcodeCaptureOverlay.withBarcodeCaptureForView(barcodeCapture, view);
const defaultBrush = overlay.getBrush();

barcodeCapture.addListener({
    didScan: async (_, session) => {
        const barcode = session.newlyRecognizedBarcode;
        if (!barcode?.data?.startsWith('09')) {
            await overlay.setBrush(Brush.transparent);
            return;
        }
        await overlay.setBrush(defaultBrush);
        await barcodeCapture.setEnabled(false);
        console.log('Scanned:', barcode.data, barcode.symbology);
    },
});

const camera = Camera.pickBestGuess();
await camera.applySettings(BarcodeCapture.recommendedCameraSettings);
await context.setFrameSource(camera);
await context.frameSource.switchToDesiredState(FrameSourceState.On);
await barcodeCapture.setEnabled(true);

```

--------------------------------

### Compile Sample Applications

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Navigate to the samples directory and use 'make' to compile all sample applications.

```bash
cd samples
make
```

--------------------------------

### Start Barcode AR View Search

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/matrixscan-ar/get-started.md

Call the `start()` method on the Barcode AR View to begin the search process once the setup is complete.

```javascript
barcodeArView.start();
```

--------------------------------

### Filter Barcodes by Regex

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/net/android/matrixscan-count/advanced.md

Exclude barcodes that match a specific regular expression pattern, for example, those starting with four numbers.

```csharp
BarcodeCountSettings settings = new BarcodeCountSettings();

settings.FilterSettings.ExcludedCodesRegex = "^1234.*";
```

--------------------------------

### Rejecting Unwanted Barcodes

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/android/barcode-capture/get-started.md

Filter barcodes within the `onBarcodeScanned` method to prevent scanning unwanted codes. This example rejects barcodes not starting with '09:'.

```kotlin
import com.scandit.datacapture.barcode.data.Barcode
import com.scandit.datacapture.barcode.ui.overlay.BarcodeCaptureOverlay
import com.scandit.datacapture.core.ui.style.Brush
lateinit var barcode: Barcode
lateinit var overlay: BarcodeCaptureOverlay
val data = barcode.data
if (data == null || !data.startsWith("09:")) {
    overlay.brush = Brush.transparent()
    return
}
```

--------------------------------

### Execute Camera Sample

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Execute the command-line camera sample, specifying the video device and desired resolution.

```bash
./CommandLineBarcodeScannerCameraSample /dev/video0 640 480
```

--------------------------------

### Set Up DataCaptureView and Overlay

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/ios/barcode-capture/get-started.md

Initialize a DataCaptureView with the context and add it to your view hierarchy. Then, create a BarcodeCaptureOverlay to visualize the scanning process, linking it to the BarcodeCapture instance and the DataCaptureView.

```swift
let captureView = DataCaptureView(context: context, frame: view.bounds)
captureView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view.addSubview(captureView)

// To visualize the results of barcode scanning, the following overlay can be added:
let overlay = BarcodeCaptureOverlay(barcodeCapture: barcodeCapture, view: captureView)
```

--------------------------------

### Reject Barcodes Based on Data

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/net/android/barcode-capture/get-started.md

Implement logic within the barcode scanning process to reject specific barcodes. This example rejects barcodes that do not start with '09:'.

```csharp
if (barcode.Data?.StartsWith("09:") == false)
{
    this.overlay.Brush = Brush.TransparentBrush;
    return;
}
```

--------------------------------

### Execute MatrixScan Camera Sample

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Run the MatrixScan camera sample, providing the video device and desired resolution.

```bash
./CommandLineMatrixScanCameraSample /dev/video0 1920 1080
```

--------------------------------

### Filter Barcodes by Regex - Cordova

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/cordova/matrixscan-count/advanced.md

Configure MatrixScan Count to filter barcodes using a regular expression. This example excludes barcodes that start with four numbers.

```javascript
const settings = new Scandit.BarcodeCountSettings();

const filterSettings = settings.filterSettings;
filterSettings.excludedCodesRegex = '^1234.*';
```

--------------------------------

### Reject Barcodes Based on Criteria

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/cordova/barcode-capture/get-started.md

Implement logic within the `didScan` method to reject specific barcodes. This example rejects barcodes that do not start with '09:', preventing them from being processed further.

```javascript
...
if (!barcode.data || !barcode.data.startsWith('09:')) {
	window.overlay.brush = Scandit.Brush.transparent;
    return;
}
...
```

--------------------------------

### Production Build Command

Source: https://github.com/scandit/data-capture-documentation/blob/main/AGENTS.md

Execute this command to create a production-ready build of the site.

```bash
npm run build          # Production build
```

--------------------------------

### Reject Unwanted Barcodes

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/barcode-capture/get-started.md

Implement logic within the `didScan` method to reject specific barcodes based on custom criteria. This example rejects barcodes that do not start with '09:'.

```javascript
...
if (!barcode.data || !barcode.data.startsWith('09:')) {
	window.overlay.brush = Brush.transparent;
    return;
}
...
```

--------------------------------

### Configure SparkScan Settings and Create Instance

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/net/android/sparkscan/get-started.md

Set up SparkScan by defining the symbologies to be scanned and then creating a SparkScan instance with these settings. Customize symbologies based on your use case.

```csharp
SparkScanSettings settings = new SparkScanSettings();
HashSet<Symbology> symbologies = new HashSet<Symbology>()
{
    Symbology.Ean13Upca
};
settings.EnableSymbologies(symbologies);

SparkScan sparkScan = new SparkScan(settings);
```

--------------------------------

### Add Label Capture Overlay and Viewfinder

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/label-capture/get-started.md

Visualize the label capture process by adding a DataCaptureView and a LabelCaptureBasicOverlay. This example also shows how to configure a RectangularViewfinder to guide the user.

```javascript
import { RectangularViewfinder, RectangularViewfinderStyle } from "scandit-capacitor-datacapture-core";
import { LabelCaptureBasicOverlay } from "scandit-capacitor-datacapture-label";

// Create the overlay for the label capture mode created earlier.
const overlay = new LabelCaptureBasicOverlay(labelCapture);

// Add the overlay to the data capture view.
dataCaptureView.addOverlay(overlay);

// Optionally, add a viewfinder to guide users through the capture process.
const viewfinder = new RectangularViewfinder(RectangularViewfinderStyle.Square);
overlay.viewfinder = viewfinder;
```

--------------------------------

### Add Label Capture Basic Overlay

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/label-capture/get-started.md

Visualize label capture results by adding a LabelCaptureBasicOverlay to your DataCaptureView. This example also shows how to configure a square viewfinder to guide the user.

```javascript
import {
  RectangularViewfinder,
  RectangularViewfinderStyle,
} from "@scandit/web-datacapture-core";
import {
  LabelCapture,
  LabelCaptureBasicOverlay,
} from "@scandit/web-datacapture-label";

// Create the overlay with the label capture mode created earlier
const overlay = await LabelCaptureBasicOverlay.withLabelCaptureForView(mode, view);

// Add a square viewfinder to the overlay to guide users through the capture process
const viewfinder = new RectangularViewfinder(RectangularViewfinderStyle.Square);
await overlay.setViewfinder(viewfinder);

```

--------------------------------

### Initialize Capacitor Project

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/add-sdk.md

Use these commands to create a new Capacitor project if you don't have one already.

```sh
npx cap init
npx cap add ios
npx cap add android
```

--------------------------------

### Initialize DataCaptureContext and Camera

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/partials/_migrate-5-to-6.mdx

Create a DataCaptureContext using your license key and set up the default device camera as the frame source.

```javascript
// Create data capture context using your license key.
context = ScanditCore.DataCaptureContext.forLicenseKey(SCANDIT_LICENSE_KEY);

// The device camera will serve as a frame source.
camera = ScanditCore.Camera.default;
context.setFrameSource(camera);
```

--------------------------------

### Rejecting Unwanted Barcodes

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/barcode-capture/get-started.md

Implement logic within the `didScan` callback to reject barcodes that do not meet specific criteria. This example rejects barcodes not starting with '09' and restores the default brush.

```typescript
import { Brush } from '@scandit/web-datacapture-core';
import type { FrameData } from '@scandit/web-datacapture-core';
import type { BarcodeCaptureListener, BarcodeCapture, BarcodeCaptureSession, Barcode } from '@scandit/web-datacapture-barcode';

function onBarcodeCaptured(barcode: Barcode): void {
  // Handle the captured barcode, e.g. look up information in a database
}

const defaultBrush = overlay.getBrush();

const listener: BarcodeCaptureListener = {
  didScan: (barcodeCapture: BarcodeCapture, session: BarcodeCaptureSession, frameData: FrameData) => {
    const barcode = session.newlyRecognizedBarcode;

    if (!barcode?.data?.startsWith('09')) {
      // Barcode does not match — make it transparent and continue scanning
      await overlay.setBrush(Brush.transparent);
      return;
    }

    // Valid barcode: restore the default brush, stop scanning and process the result
    await overlay.setBrush(defaultBrush);
    await barcodeCapture.setEnabled(false);
    onBarcodeCaptured(barcode);
  },
};

barcodeCapture.addListener(listener);
```

--------------------------------

### Build OpenCV C++ Sample

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/linux/add-sdk.md

Build the OpenCV C++ sample by creating a build directory, navigating into it, and running CMake and Make.

```bash
mkdir build
cd build
cmake ..
make
```

--------------------------------

### Reject Barcodes Based on Prefix

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/ios/barcode-capture/get-started.md

Implement logic within the `didScanIn` method to reject specific barcodes. This example rejects barcodes that do not start with '09:' and uses a transparent brush for visual feedback.

```swift
... 
guard barcodeData.hasPrefix("09:") else {
    self.overlay.brush = Brush.transparent
    return
}
...
```

--------------------------------

### Setup BarcodeFindView

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/cordova/matrixscan-find/get-started.md

Initialize BarcodeFindViewSettings for UI customization and create a BarcodeFindView instance, connecting it to the specified HTML element.

```javascript
const viewSettings = new Scandit.BarcodeFindViewSettings();
```

```javascript
const barcodeFindView = new Scandit.BarcodeFindView({ context: DataCaptureContext.sharedInstance, barcodeFind: mode, viewSettings });
barcodeFindView.connectToElement(htmlElement);
```

--------------------------------

### Setup BarcodePickView

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/flutter/matrixscan-pick/get-started.md

Create and configure the BarcodePickView for the MatrixScan Pick UI. This view includes buttons and overlays to guide the user. Remember to connect the view to the widget lifecycle by calling `widgetPaused` and `widgetResumed`.

```dart
var viewSettings = BarcodePickViewSettings(
  // ...
);

var barcodePickView = BarcodePickView.forModeWithViewSettings(DataCaptureContext.sharedInstance, mode, viewSettings);
```

```dart
@override
void didChangeAppLifecycleState(AppLifecycleState state) {
  if (state == AppLifecycleState.resumed) {
    // Resume finding by calling the BarcodePickView widgetResumed function.
    // Under the hood, it re-enables the BarcodePick mode and makes sure the view is properly
    // setup.
    barcodePickView.widgetResumed();
  } else {
    // Pause finding by calling the BarcodePickView widgetPaused function.
    // Under the hood, it will disable the mode and free resources that are not needed in a
    // paused state.
    barcodePickView.widgetPaused();
  }
}
```

--------------------------------

### Initialize Camera and Set Frame Source

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/react-native/barcode-capture/get-started.md

Creates recommended camera settings, initializes a camera with these settings, and attaches it as the frame source to the DataCaptureContext. Remember to switch the camera state to 'On' afterwards.

```typescript
const cameraSettings = BarcodeCapture.createRecommendedCameraSettings();
// cameraSettings.preferredResolution = VideoResolution.FullHD; // or adjust default camera settings

const camera = Camera.withSettings(cameraSettings);

// Attaches the Camera object as FrameSource to the DataCaptureContext
context.setFrameSource(camera);

... // Setup the BarcodeCaptureMode, BarcodeCaptureListener, etc.

camera.switchToDesiredState(FrameSourceState.On);
```

```javascript
const cameraSettings = BarcodeCapture.createRecommendedCameraSettings();
// cameraSettings.preferredResolution = VideoResolution.FullHD; // or adjust default camera settings

const camera = Camera.withSettings(cameraSettings);

// Attaches the Camera object as FrameSource to the DataCaptureContext
context.setFrameSource(camera);

... // Setup the BarcodeCaptureMode, BarcodeCaptureListener, etc.

camera.switchToDesiredState(FrameSourceState.On);
```

--------------------------------

### Initialize and Start Camera

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/label-capture/get-started.md

Initializes the camera and sets it as the frame source for the data capture context. Recommended camera settings are applied.

```javascript
import { Camera } from "@scandit/web-datacapture-core";

const camera = Camera.pickBestGuess();
await context.setFrameSource(camera);

const cameraSettings = LabelCapture.createRecommendedCameraSettings();

// Depending on the use case further camera settings adjustments can be made here.
await camera.applySettings(cameraSettings);
```

--------------------------------

### Complete BarcodeCapture Setup in Swift

Source: https://context7.com/scandit/data-capture-documentation/llms.txt

Set up BarcodeCapture for single barcode scanning in iOS (Swift). Configure symbologies and implement a listener to process scanned barcodes, rejecting those that do not start with '09' and stopping the scan after a valid one.

```swift
// iOS (Swift) — complete BarcodeCapture setup
import ScanditCaptureCore
import ScanditBarcodeCapture

let settings = BarcodeCaptureSettings()
settings.set(symbology: .code128, enabled: true)
settings.set(symbology: .code39, enabled: true)
settings.set(symbology: .qr, enabled: true)
settings.set(symbology: .ean8, enabled: true)
settings.set(symbology: .upce, enabled: true)
settings.set(symbology: .ean13UPCA, enabled: true)

let barcodeCapture = BarcodeCapture(context: context, settings: settings)
barcodeCapture.addListener(self)

// Listener conformance
extension ViewController: BarcodeCaptureListener {
    func barcodeCapture(_ barcodeCapture: BarcodeCapture,
                        didScanIn session: BarcodeCaptureSession,
                        frameData: FrameData) {
        guard let barcode = session.newlyRecognizedBarcode,
              let data = barcode.data,
              data.hasPrefix("09") else {
            overlay.brush = .transparent
            return
        }
        barcodeCapture.isEnabled = false
        DispatchQueue.main.async { self.showResult(data) }
    }
}

```

--------------------------------

### Initialize and Start Camera for Label Capture

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/net/android/label-capture/get-started.md

Initialize the camera using recommended settings for Label Capture and set it as the frame source for the data capture context. Ensure the camera is switched on to begin capturing.

```csharp
var cameraSettings = LabelCapture.RecommendedCameraSettings;
var camera = Camera.GetDefaultCamera(cameraSettings);

if (camera == null)
{
    throw new InvalidOperationException("Failed to init camera!");
}

dataCaptureContext.SetFrameSourceAsync(camera);
```

```csharp
camera.SwitchToDesiredStateAsync(FrameSourceState.On);
```

--------------------------------

### Complete BarcodeCapture Setup in Kotlin

Source: https://context7.com/scandit/data-capture-documentation/llms.txt

Set up BarcodeCapture for single barcode scanning in Android (Kotlin). Configure symbologies, set a duplicate filter, and implement a listener to process scanned barcodes, rejecting those that do not start with '09' and stopping the scan after a valid one.

```kotlin
// Android (Kotlin) — complete BarcodeCapture setup
import com.scandit.datacapture.barcode.capture.BarcodeCapture
import com.scandit.datacapture.barcode.capture.BarcodeCaptureListener
import com.scandit.datacapture.barcode.capture.BarcodeCaptureSession
import com.scandit.datacapture.barcode.capture.BarcodeCaptureSettings
import com.scandit.datacapture.barcode.data.Symbology
import com.scandit.datacapture.core.data.FrameData
import com.scandit.datacapture.barcode.ui.overlay.BarcodeCaptureOverlay
import com.scandit.datacapture.core.ui.style.Brush

// 1. Configure settings — only enable symbologies your app needs
val settings = BarcodeCaptureSettings().apply {
    enableSymbology(Symbology.CODE128, true)
    enableSymbology(Symbology.CODE39, true)
    enableSymbology(Symbology.QR, true)
    enableSymbology(Symbology.EAN8, true)
    enableSymbology(Symbology.UPCE, true)
    enableSymbology(Symbology.EAN13_UPCA, true)
    // Prevent the same barcode from being scanned twice within 500 ms
    codeDuplicateFilter = 500
}

// 2. Create mode
val barcodeCapture = BarcodeCapture.forDataCaptureContext(dataCaptureContext, settings)

// 3. Register listener
barcodeCapture.addListener(object : BarcodeCaptureListener {
    override fun onBarcodeScanned(
        barcodeCapture: BarcodeCapture,
        session: BarcodeCaptureSession,
        frameData: FrameData
    ) {
        val barcode = session.newlyRecognizedBarcode ?: return
        val data = barcode.data

        // Reject barcodes that don't start with "09"
        if (data == null || !data.startsWith("09")) {
            overlay.brush = Brush.transparent()
            return
        }

        // Stop scanning after a valid scan
        barcodeCapture.isEnabled = false
        runOnUiThread { showResult(data) }
    }
})

```

--------------------------------

### Complete ID Capture Example in JavaScript

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/id-capture/get-started.md

This snippet shows the full integration of the ID Capture SDK, including context setup, camera configuration, ID capture settings, event listeners for successful captures and rejections, and overlay management. It also includes functions to mount and unmount the camera and ID capture.

```javascript
import {
  Camera,
  DataCaptureContext,
  DataCaptureView,
  FrameSourceState,
} from "@scandit/web-datacapture-core";
import {
  IdCapture,
  IdCaptureOverlay,
  IdCaptureSettings,
  IdCard,
  Passport,
  Region,
  FullDocumentScanner,
  IdCaptureScanner,
  RejectionReason,
  idCaptureLoader,
} from "@scandit/web-datacapture-id";

const context = await DataCaptureContext.forLicenseKey(
  "-- ENTER YOUR SCANDIT LICENSE KEY HERE --",
  {
    libraryLocation: "/self-hosted-sdc-lib/",
    moduleLoaders: [idCaptureLoader({ enableVIZDocuments: true })],
  }
);

const view = await DataCaptureView.forContext(context);
view.connectToElement(document.body);

const camera = Camera.pickBestGuess();
await camera.applySettings(IdCapture.recommendedCameraSettings);
await context.setFrameSource(camera);

const settings = new IdCaptureSettings();
settings.acceptedDocuments.push(new IdCard(Region.Any));
settings.acceptedDocuments.push(new Passport(Region.Any));
settings.scanner = new IdCaptureScanner({
  physicalDocument: new FullDocumentScanner(),
});

const idCapture = await IdCapture.forContext(context, settings);

idCapture.addListener({
  didCaptureId: async (capturedId) => {
    await idCapture.setEnabled(false);

    console.log("Captured ID:", {
      fullName: capturedId.fullName,
      dateOfBirth: capturedId.dateOfBirth,
      documentNumber: capturedId.documentNumber,
      dateOfExpiry: capturedId.dateOfExpiry,
    });
  },
  didRejectId: (capturedId, reason) => {
    console.log("ID rejected:", reason);

    if (reason === RejectionReason.Timeout) {
      console.log("Scan timed out. Please try again.");
    } else if (reason === RejectionReason.NotAcceptedDocumentType) {
      console.log("Document type not accepted.");
    }
  },
});

const overlay = await IdCaptureOverlay.withIdCaptureForView(idCapture, view);

async function mount() {
  await camera.switchToDesiredState(FrameSourceState.On);
  await idCapture.setEnabled(true);
}

async function unmount() {
  await camera.switchToDesiredState(FrameSourceState.Off);
  await idCapture.setEnabled(false);
}

mount().catch(async (error) => {
  console.error(error);
  await unmount();
});

```

--------------------------------

### Create Recommended Camera Settings and Default Camera

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/cordova/barcode-capture/get-started.md

Obtain recommended camera settings for optimal performance and initialize the default device camera. Further settings can be adjusted as needed.

```javascript
const cameraSettings = Scandit.BarcodeCapture.createRecommendedCameraSettings();

// Depending on the use case further camera settings adjustments can be made here.

const camera = Scandit.Camera.default;

if (camera) {
	camera.applySettings(cameraSettings);
}
```

--------------------------------

### Local Development Server Command

Source: https://github.com/scandit/data-capture-documentation/blob/main/AGENTS.md

Use this command to start a local development server for testing changes.

```bash
npm start              # Local dev server
```

--------------------------------

### Complete ID Bolt Workflow Configuration

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/hosted/id-bolt/workflow.md

An example demonstrating a comprehensive ID Bolt workflow setup. It includes license key, document selection, return data mode, scanner configuration (MRZ only), and workflow options like skipping the result screen and allowing image uploads. The `onCompletion` callback logs the successful result.

```typescript
const idBoltSession = IdBoltSession.create(ID_BOLT_URL, {
  licenseKey: LICENSE_KEY,
  documentSelection: DocumentSelection.create({
    accepted: [new Passport(Region.Any), new IdCard(Region.Any)],
  }),
  returnDataMode: ReturnDataMode.Full,
  // Configure scanner to only use MRZ reading (good for e.g. passports)
  scanner: new SingleSideScanner(false, true, false),
  // skip result screen
  workflow: {
    showResultScreen: false,
    // also offer image upload possibility
    allowImageUpload: true,
  },
  onCompletion: (result) => {
    console.log("Successfully completed workflow", result);
  },
});

await idBoltSession.start();
```

--------------------------------

### Install Dependencies with Yarn

Source: https://github.com/scandit/data-capture-documentation/blob/main/README.md

Installs all project dependencies using Yarn. Ensure Node.js and Yarn are installed and configured.

```bash
$ yarn
```

--------------------------------

### Add Camera and Configure Settings

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/id-capture/get-started.md

Create and set the default camera as the frame source for the Data Capture Context. Apply recommended camera settings for ID Capture.

```javascript
const camera = Camera.default;
DataCaptureContext.sharedInstance.setFrameSource(camera);

const cameraSettings = IdCapture.createRecommendedCameraSettings();

// Depending on the use case further camera settings adjustments can be made here.

if (camera != null) {
	camera.applySettings(cameraSettings);
}
```

--------------------------------

### Install ID Bolt with yarn

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/hosted/id-bolt/getting-started.md

Install the ID Bolt package using yarn. This is an alternative to npm for package installation.

```bash
yarn add @scandit/web-id-bolt
```

--------------------------------

### Complete CDN Example for Scandit Web SDK

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/add-sdk.md

This HTML file demonstrates a full integration of the Scandit Web SDK using a Content Delivery Network (CDN). It includes setting up the necessary imports, initializing the DataCaptureContext, configuring the camera, and setting up barcode capture with a listener for scan events. Replace '-- ENTER LICENSE KEY HERE --' with your actual Scandit license key.

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Scandit CDN Simple sample</title>
    <script type="importmap">
      {
        "imports": {
          "@scandit/web-datacapture-core": "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-core@8/build/js/index.js",
          "@scandit/web-datacapture-barcode": "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-barcode@8/build/js/index.js",
          "@scandit/web-datacapture-parser": "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-parser@8/build/js/index.js",

          "@scandit/web-datacapture-barcode/": "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-barcode@8/",
          "@scandit/web-datacapture-core/": "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-core@8/",
          "@scandit/web-datacapture-parser/": "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-parser@8/"
        }
      }
    </script>
    <!-- 
    You can optionally preload the modules. 
    More info about this feature here https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/modulepreload 
    -->
    <link
      rel="modulepreload"
      href="https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-core@8/build/js/index.js"
    />
    <link
      rel="modulepreload"
      href="https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-barcode@8/build/js/index.js"
    />
    <link
      rel="modulepreload"
      href="https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-parser@8/build/js/index.js"
    />
    <style>
      html,
      body {
        margin: 0;
        padding: 0;
        height: 100%;
      }
      #app {
        height: 100%;
      }
    </style>
    <!-- Check the latest version here https://github.com/guybedford/es-module-shims/releases -->
    <script
      async
      src="https://ga.jspm.io/npm:es-module-shims@2.6.2/dist/es-module-shims.js"
    ></script>
    <script type="module">
      import {
        DataCaptureView,
        Camera,
        DataCaptureContext,
        FrameSourceState,
      } from "@scandit/web-datacapture-core";

      import {
        barcodeCaptureLoader,
        BarcodeCaptureSettings,
        BarcodeCapture,
        Symbology,
        SymbologyDescription,
      } from "@scandit/web-datacapture-barcode";

      let view = new DataCaptureView();
      view.connectToElement(document.getElementById("app"));
      view.showProgressBar();

      const context = await DataCaptureContext.forLicenseKey("-- ENTER LICENSE KEY HERE --", {
        libraryLocation:
          "https://cdn.jsdelivr.net/npm/@scandit/web-datacapture-barcode@8/sdc-lib/",
        moduleLoaders: [barcodeCaptureLoader()],
      });
      view.hideProgressBar();

      const camera = Camera.pickBestGuess();

      await view.setContext(context);

      // Depending on the use case further camera settings adjustments can be made here.
      const cameraSettings = BarcodeCapture.recommendedCameraSettings;
      await camera.applySettings(cameraSettings);

      await context.setFrameSource(camera);
      await context.frameSource.switchToDesiredState(FrameSourceState.On);

      const settings = new BarcodeCaptureSettings();
      settings.enableSymbologies([Symbology.Code128, Symbology.QR]);

      let barcodeCapture = await BarcodeCapture.forContext(context, settings);

      barcodeCapture.addListener({
        didScan: async (barcodeCaptureMode, session) => {
          const barcode = session.newlyRecognizedBarcode;
          if (!barcode) {
            return;
          }
          const symbology = new SymbologyDescription(barcode.symbology);
          alert(`Scanned: ${barcode.data ?? ""}\n(${symbology.readableName})`);
        },
      });

      await barcodeCapture.setEnabled(true);
    </script>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

```

--------------------------------

### Setup SparkScanView

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/sparkscan/get-started.md

Create SparkScanViewSettings to customize the appearance and then create a SparkScanView instance, associating it with the DataCaptureContext and SparkScan.

```javascript
const viewSettings = new SparkScanViewSettings();
// setup the desired appearance settings by updating the fields in the object above
```

```javascript
const sparkScanView = SparkScanView.forContext(DataCaptureContext.sharedInstance, sparkScan, viewSettings);
```

--------------------------------

### Install iOS Cocoapods

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/react-native/add-sdk.md

After installing React Native node modules, navigate to the 'ios' directory and run 'pod install' to set up native dependencies.

```sh
cd ios && pod install && cd ..
```

--------------------------------

### Set up DataCaptureView (.NET Android)

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/partials/_migrate-5-to-6.mdx

Creates the DataCaptureView, associating it with the DataCaptureContext, and sets it as the content view of the activity. This displays the camera preview and any scanning overlays.

```csharp
dataCaptureView = DataCaptureView.Create(this, dataCaptureContext);
SetContentView(dataCaptureView);
```

--------------------------------

### Install Scandit React Native Data Capture Packages

Source: https://context7.com/scandit/data-capture-documentation/llms.txt

Install the necessary Scandit React Native packages using yarn. Remember to install pods for iOS after the node_modules are ready.

```sh
# Install core (always required) then the feature modules you need
yarn add scandit-react-native-datacapture-core
yarn add scandit-react-native-datacapture-barcode  # for barcode scanning
yarn add scandit-react-native-datacapture-id        # for ID capture
yarn add scandit-react-native-datacapture-label     # for label capture

# iOS: install pods after node_modules are ready
cd ios && pod install && cd ..
```

--------------------------------

### Initialize and Apply Camera Settings

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/ios/label-capture/get-started.md

Initialize the default camera and apply recommended settings for label capture. This prepares the camera for streaming previews and capturing images.

```swift
camera = Camera.default
context.setFrameSource(camera, completionHandler: nil)

let recommendedCameraSettings = LabelCapture.recommendedCameraSettings
camera?.apply(recommendedCameraSettings)
```

--------------------------------

### Create Recommended Camera Settings and Camera

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/capacitor/barcode-capture/get-started.md

Obtain recommended camera settings for barcode scanning and initialize the default camera. Further settings can be adjusted if needed.

```javascript
const cameraSettings = BarcodeCapture.createRecommendedCameraSettings();

// Depending on the use case further camera settings adjustments can be made here.

const camera = Camera.default;

if (camera) {
	camera.applySettings(cameraSettings);
}
```

--------------------------------

### WedgeHost Initialization

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/hosted/express/configuration/device-pairing/bluetooth-pairing.md

Initialize the WedgeHost to manage Bluetooth connections and receive events. Ensure you replace placeholders with your actual project details.

```APIDOC
## WedgeHost Initialization

### Description
Initializes the `WedgeHost` to manage Bluetooth connections and receive events. This is the primary entry point for Bluetooth device pairing.

### Method Signature
```swift
WedgeHost(
    hostName: String,
    projectCode: String,
    baseUrl: String,
    eventCallback: (WedgeHostEvent) -> Void
)
```

### Parameters

- **hostName** (String) - The name you specify for the host.
- **projectCode** (String) - Your Scandit Express project code provided in the dashboard.
- **baseUrl** (String) - The base URL for the QR code that will be generated. This can be used to directly open your app by specifying a universal link. For example, `https://express.scandit.com/bluetooth` or `scanditExpress://bluetooth`.
- **eventCallback** ((WedgeHostEvent) -> Void) - The callback function to handle events sent to the host.
```

--------------------------------

### IdBoltSession.create

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/hosted/id-bolt/api-overview.md

Creates a new ID Bolt session with your configuration. The session is not started until you call `start()`.

```APIDOC
## IdBoltSession.create

### Description
Creates a new ID Bolt session with your configuration. The session is not started until you call `start()`.

### Method
Static method of `IdBoltSession`

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Parameters
- `serviceUrl` (string) - Your ID Bolt service URL from the Scandit dashboard
- `options` (IdBoltCreateSessionOptions) - Configuration object defining the session behavior
```

--------------------------------

### Install Scandit Web SDK with deno

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/add-sdk.md

Use deno to install the core and barcode capture packages for your web project.

```sh
deno add npm:@scandit/web-datacapture-core npm:@scandit/web-datacapture-barcode
```

--------------------------------

### Initialize DataCaptureContext

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/matrixscan/get-started.md

Create a DataCaptureContext instance with your license key and necessary module loaders. Ensure the libraryLocation is correctly set.

```javascript
import { DataCaptureContext } from "@scandit/web-datacapture-core";
import { barcodeCaptureLoader } from "@scandit/web-datacapture-barcode";

const context = await DataCaptureContext.forLicenseKey('-- ENTER YOUR SCANDIT LICENSE KEY HERE --', {
 libraryLocation: new URL('library/engine/', document.baseURI).toString(),
 moduleLoaders: [barcodeCaptureLoader()],
});
```

--------------------------------

### Install Scandit Web SDK with bun

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/add-sdk.md

Use bun to install the core and barcode capture packages for your web project.

```sh
bun add @scandit/web-datacapture-core @scandit/web-datacapture-barcode
```

--------------------------------

### Initialize Camera and Settings

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/barcode-capture/get-started.md

Configure and initialize the built-in camera with recommended settings for barcode capture. Ensure necessary imports are included.

```typescript
import { Camera } from '@scandit/web-datacapture-core';
import { BarcodeCapture } from '@scandit/web-datacapture-barcode';

const cameraSettings = BarcodeCapture.recommendedCameraSettings;

// Depending on the use case further camera settings adjustments can be made here.

const camera = Camera.pickBestGuess();
await camera.applySettings(cameraSettings);
```

--------------------------------

### Install Scandit Web SDK with pnpm

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/web/add-sdk.md

Use pnpm to install the core and barcode capture packages for your web project.

```sh
pnpm add @scandit/web-datacapture-core @scandit/web-datacapture-barcode
```

--------------------------------

### Set up DataCaptureView

Source: https://github.com/scandit/data-capture-documentation/blob/main/versioned_docs/version-8.3.1/sdks/flutter/id-capture/get-started.md

Create a DataCaptureView instance for the DataCaptureContext to display the camera preview and UI elements. Add this view to your widget tree.

```dart
 var dataCaptureView = DataCaptureView.forContext(DataCaptureContext.sharedInstance);
 // Add the dataCaptureView to your widget tree
```