Show the scanner

You can use our samples to get a good overview of how to show the barcode scanner in an app: Run the samples.

The Scan User Interface can be presented in various ways. For alternative ways of presenting the scanner (e.g., with a UINavigationController, a UITabViewController, as a subview or in landscape mode), you can also check out the source code and the app of the ExtendedProjectSample that comes with the Scandit SDK.

All code snippets are taken from the source code of the ExtendedProjectSample that comes with the Scandit SDK (DemoViewController.m and OtherExamplesViewController.m).

Adding the SBSBarcodePicker as a view

Objective-C:

self.scanditBarcodePicker = [[SBSBarcodePicker alloc]
                             initWithSettings:[SBSScanSettings defaultSettings]];

/* Set the delegate to receive callbacks.
 * This is commented out here in the demo app since the result view with the scan results
 * is not suitable for this overlay view */
// self.scanditBarcodePicker.scanDelegate = self;

// Add a button behind the subview to close it.
self.backgroundButton.hidden = NO;

[self addChildViewController:self.scanditBarcodePicker];
[self.view addSubview:self.scanditBarcodePicker.view];
[self.scanditBarcodePicker didMoveToParentViewController:self];

[self.scanditBarcodePicker.view setTranslatesAutoresizingMaskIntoConstraints:NO];

// Add constraints to place the picker at the top of the controller with a height of 300 and
// the same width as the controller. Since this is not the aspect ratio of the video preview
// some of the video preview will be cut away on the top and bottom.
UIView *pickerView = self.scanditBarcodePicker.view;
NSDictionary *views = NSDictionaryOfVariableBindings(pickerView);
if (floor(NSFoundationVersionNumber) > NSFoundationVersionNumber_iOS_6_1) {
    id topGuide = self.topLayoutGuide;
    views = NSDictionaryOfVariableBindings(pickerView, topGuide);
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[topGuide][pickerView(300)]"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:views]];
} else {
    // There is no topLayoutGuide under iOS 6.
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(50)-[pickerView(300)]"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:views]];
}
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[pickerView]|"
                                                                  options:0
                                                                  metrics:nil
                                                                    views:views]];

[self.scanditBarcodePicker startScanning];

Swift:

let scanSettings = SBSScanSettings.default()
// Initialize picker with the the preferred settings.
let picker = SBSBarcodePicker(settings: scanSettings)
// Assign the scan delegate.
picker.scanDelegate = self

// Set up the UI. Check out the ExtendedSample for the specific implementation.
addBarcodeResult()
// Add barcode picker as child view controller.
addChildViewController(picker)
picker.view.translatesAutoresizingMaskIntoConstraints = false
overview.addSubview(picker.view)
picker.didMove(toParentViewController: parent)
picker.view.constrainToCenter(of: view, width: 200, height: 400)
overview.isHidden = false

// Start scanning process.
picker.startScanning()

Presenting the SBSBarcodePicker modally

Objective-C:

self.scanditBarcodePicker = [[SBSBarcodePicker alloc]
                             initWithSettings:[SBSScanSettings defaultSettings]];

// Always show a toolbar (with cancel button) so we can navigate out of the scan view.
[self.scanditBarcodePicker.overlayController showToolBar:YES];

// Show a button to switch the camera from back to front and vice versa but only when using
// a tablet.
[self.scanditBarcodePicker.overlayController setCameraSwitchVisibility:SBSCameraSwitchVisibilityOnTablet];

// Set the delegate to receive callbacks.
self.scanditBarcodePicker.scanDelegate = self;
self.scanditBarcodePicker.overlayController.cancelDelegate = self;

// Present the barcode picker modally and start scanning. We buffer the result if the code was
// already recognized while the modal view is still animating.
self.modalStartAnimationDone = NO;
[self presentViewController:self.scanditBarcodePicker animated:YES completion:^{
    if (self.modalBufferedResult != nil) {
        [self.scanditBarcodePicker pauseScanning];
        [self returnBuffer];
    }
    self.modalStartAnimationDone = YES;
}];

[self.scanditBarcodePicker startScanning];

Swift:

let scanSettings = SBSScanSettings.default()
// Initialize picker and apply settings.
let picker = SBSBarcodePicker(settings: scanSettings)
picker.overlayController.showToolBar(true)
picker.scanDelegate = self
picker.overlayController.cancelDelegate = self

// Set up the barcode result UI.
picker.addChildViewController(barcodeResult)
barcodeResult.view.translatesAutoresizingMaskIntoConstraints = false
picker.view.addSubview(barcodeResult.view)
// Add constraints to view. Check out the ExtendedSample for the specific implementation.
barcodeResult.view.constrainToEdges(of: picker.view)
barcodeResult.view.isHidden = true
barcodeResult.didMove(toParentViewController: picker)

// Present the barcode picker.
present(picker, animated: true)

// Start scanning process.
picker.startScanning()

Pushing the SBSBarcodePicker in a Navigation Controller

Objective-C:

SBSScanSettings *settings = [SBSScanSettings defaultSettings];
// We allocate a picker without keeping a reference and don't set a delegate. The picker will
// simply track barcodes that have been recognized.
SBSBarcodePicker *barcodePicker = [[SBSBarcodePicker alloc] initWithSettings:settings];

// Show the navigation bar such that we can press the back button.
[self.navigationController setNavigationBarHidden:NO animated:NO];

// Show a button to switch the camera from back to front and vice versa but only when using
// a tablet.
[barcodePicker.overlayController setCameraSwitchVisibility:SBSCameraSwitchVisibilityOnTablet];

// Set the delegate to receive callbacks.
// This is commented out here in the demo app since the result view with the scan results
// is not suitable for this navigation view

// self.scanditBarcodePicker.scanDelegate = self;

// Push the picker on the navigation stack and start scanning.
[self.navigationController pushViewController:barcodePicker animated:YES];
[barcodePicker startScanning];

Swift:

let scanSettings = SBSScanSettings.default()
// Initialize picker with the the preferred settings.
let picker = SBSBarcodePicker(settings: scanSettings)
// Assign the scan delegate.
picker.scanDelegate = self

// Set up the barcode result UI. Check out the ExtendedSample for the specific implementation.
picker.addChildViewController(barcodeResult)
barcodeResult.view.translatesAutoresizingMaskIntoConstraints = false
picker.view.addSubview(barcodeResult.view)
barcodeResult.view.constrainToEdges(of: picker.view)
barcodeResult.view.isHidden = true
barcodeResult.didMove(toParentViewController: picker)

// Push the picker on the navigation controller.
navigationController?.pushViewController(picker, animated: true)

// Start scanning process.
picker.startScanning()

Adding the SBSBarcodePicker to a tab view

Objective-C:

// Instantiate the barcode picker using the settings defined by the user.

// To change the allowed orientations you will have to set those in the TabBarController
// (which contains the picker as a tab)
self.scanditBarcodePicker = [[SBSBarcodePicker alloc]
                             initWithSettings:[self currentScanSettings] ];

// Set all the settings as they were set in the settings tab.
[self setAllSettingsOnPicker:self.scanditBarcodePicker];

// Set the delegate to receive "barcode scanned" callbacks.
self.scanditBarcodePicker.scanDelegate = self;

// Create a tab item for the picker, possibly with an icon.
UITabBarItem *tabItem = [[UITabBarItem alloc] initWithTitle:@"Scan"
                                                      image:[UIImage imageNamed:@"icon_barcode.png"]
                                                        tag:3];
self.scanditBarcodePicker.tabBarItem = tabItem;

// Add the picker to the array of view controllers that make up the tabs.
NSMutableArray *tabControllers = (NSMutableArray *) [[self tabBarController] viewControllers];
[tabControllers addObject:self.scanditBarcodePicker];
// And set the array as the tab bar controllers source of tabs again.
[[self tabBarController] setViewControllers:tabControllers];

// Switch to the fourth tab, where the picker is located and start scanning.
[[self tabBarController] setSelectedIndex:3];
[self.scanditBarcodePicker startScanning];

Swift:

guard let tabBarController = tabBarController,
    let viewControllers = tabBarController.viewControllers else { return }
// Instantiate the barcode picker using the settings defined by the user.
// To change the allowed orientations you will have to set those in the TabBarController
// (which contains the picker as a tab)
let scanSettings = SBSScanSettings.default()
let picker = SBSBarcodePicker(settings: scanSettings)

// Set the delegate to receive "barcode scanned" callbacks.
picker.scanDelegate = self
// Create a tab item for the picker, possibly with an icon.
let tabItem = UITabBarItem(title: "Scan", image: UIImage(named: "icon_barcode"), tag: 3)
picker.tabBarItem = tabItem
var tabControllers = viewControllers
tabControllers.append(picker)
// And set the array as the tab bar controllers source of tabs again.
tabBarController.setViewControllers(tabControllers, animated: true)
// Switch to the fourth tab, where the picker is located and start scanning.
tabBarController.selectedIndex = 3
picker.startScanning()