Wednesday, December 26, 2012

zBar integeration with IOS iphone/ipad.


Few Days back I started learning IOS, and asked me to integrate Bar Code Scanner within application. After spent few hours I found the zBar SDK for iphone and found this very easy to implement within app.

So this simple scanner barcode view looks like.

















To build this interface I follow this steps.

  1. Create new project in xcode.
  2. Select Single View Application under IOS->Application Tab (Press Next)
  3. I used the app name ZbarExample in product name and select two checkboxes "Use storyboard" and "Use Automatic Reference Counting".
  4. Now click to mainStoryboard.storyboard file. Drag a label onto the view and customize the placement and appearance as you like.
  5. Drag a Round Rect Button onto the view and title it “Scan”. Customize the placement and appearance as you like.
Now we're going to make an outlet for this label field on the ViewController using Assistant Editor feature of Xcode. Open the Assistant Editor with the button from the toolbar (the one that looks like tuxedo/ alien face). it should automatically open on ViewController.h

Select the label field and ctrl-drag into the .h file:
Let go of the mouse button and a popup appears:

Name the new outlet "viewResult". After you click Connect, Xcode will add the following property to ViewController.h:

do the same for button and name it "scan" and select IBAction in connection this time.

and your file should look like this.

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (strong, nonatomic) IBOutlet UILabel *viewResult;

- (IBAction)scan:(id)sender;

@end

Entries of that code inserted in ViewController.m file automatically.

Now its time to integrate Zbar Sdk into our example.

Use this http://zbar.sourceforge.net/iphone/sdkdoc/install.html to download and integrating step to follow.

After download and add following framework in your app.

Open ZBarSDK-1.2.dmg in the Finder.(its appear like something)

















Drag the ZBarSDK folder into your Xcode project. In the dialog that appears, you should choose to copy the SDK into your project by checking the box.


















The target that you want to link with the library should also be selected in the target list.


Link the following additional frameworks to any targets that link with the ZBarSDK. You should set the first three to use weak references and configure an appropriate deployment target if you still need to support iOS 3:
  • AVFoundation.framework (weak)
  • CoreMedia.framework (weak)
  • CoreVideo.framework (weak)
  • QuartzCore.framework
  • libiconv.dylib
If you check “Link Binary With Libraries” for the target(s), you should see all of these frameworks followed by libzbar.a.

Import the SDK header from your prefix header to make the barcode reader APIs available and include ZBarReaderDelegate like this.


#import <UIKit/UIKit.h>
#import "ZBarSDK.h"

@interface ViewController : UIViewController <ZBarReaderDelegate> {
}

@property (strong, nonatomic) IBOutlet UILabel *viewResult;

- (IBAction)scan:(id)sender;

@end

now move to the ViewController.m file and replace this code into scan method and don't forget to import ZBarSDK.h in same.

- (IBAction)scan:(id)sender {
      
    //initialize the reader and provide some config instructions
    ZBarReaderViewController *reader = [ZBarReaderViewController new];
    reader.readerDelegate = self;
    
    [reader.scanner setSymbology: ZBAR_I25
                          config: ZBAR_CFG_ENABLE
                              to: 1];
    reader.readerView.zoom = 1.0; // define camera zoom property
    
    //show the scanning/camera mode
    [self presentModalViewController:reader animated:YES];
    // Do any additional setup after loading the view from its nib.

}


And add this method in same ViewController.m file.

- (void) imagePickerController: (UIImagePickerController*) reader
 didFinishPickingMediaWithInfo: (NSDictionary*) info {
    
    //this contains your result from the scan
    id results = [info objectForKey: ZBarReaderControllerResults];
    
    //create a symbol object to attach the response data to
    ZBarSymbol *symbol = nil;
    
    //add the symbol properties from the result
    //so you can access it
    for(symbol in results){
        
 //symbol.data holds the value        
        NSString *upcString = symbol.data;
        
        //print to the console
        NSLog(@"the value of the scanned UPC is: %@",upcString);
        
        NSMutableString *message = [[NSMutableString alloc] 
        initWithString: @"Scanned Barcode: "];
        
        [message appendString:[NSString stringWithFormat:@"%@ ",
        upcString]];
        
        //Create UIAlertView alert
        UIAlertView  *alert = [[UIAlertView alloc] 
        initWithTitle:@"Product Barcode" message: message delegate:self 
        cancelButtonTitle:@"Cancel" otherButtonTitles: nil];
        
        self.viewResult.text = upcString;
        [alert show];
        //After some time
        [alert dismissWithClickedButtonIndex:0 animated:TRUE];
        
        //make the reader view go away
        [reader dismissModalViewControllerAnimated: YES];
    }
    
}



Time for Testing. :)

Download Source Code.: https://github.com/m-saifuddin/iphone


10 comments:

John said...

hello,

Thank's for your code but nothing works for me if i run on ios 6.1

lot of errors !!!

Maybe you have solutions ?

Thank you.

Muhammad Saifuddin said...

Hi John,
Thanks for input.

Saying "nothing works and lot of errors !!!" doesn't help.

Can you share what kind of error you are facing? stacktrace? error log?

Thanks,

JOhn said...

Thank you for your reply, can you explain this :

Link the following additional frameworks to any targets that link with the ZBarSDK. You should set the first three to use weak references and configure an appropriate deployment target if you still need to support iOS 3:

AVFoundation.framework (weak)
CoreMedia.framework (weak)
CoreVideo.framework (weak)
QuartzCore.framework
libiconv.dylib

If you check “Link Binary With Libraries” for the target(s), you should see all of these frameworks followed by libzbar.a.

Sorry i am newbie in ios and this part can be useful if explained to beginners like me !

Thanks a lot for your help.

John said...

Okay i found the solution it was to go in Build Phases and add in link Binary With Libraries the

AVFoundation.framework (weak)
CoreMedia.framework (weak)
CoreVideo.framework (weak)
QuartzCore.framework
libiconv.dylib

Thank you for this useful tutorial !

Muhammad Saifuddin said...

Hi John,

It feels glad that things works for you :)

Ahsan said...

Good work Saifo bhai,

Just one thing you , you need to confirm the UIALERTVIEW protocol in your header file since you are using the relevant delegate methods.
Otherwise it is prone to errors.

yana Razor said...

hello,
can I test zbar using the emulator

Muhammad Saifuddin said...

Hi Yana,

Thanks for visit this blog, regarding you question you can't test scanner on you simulator because it required camera feature to scan.

Hope this answer to your question.

brian x said...

Hi,

I tried testing out your app i downloaded from git but its giving me an error

/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/clang failed with exit code 1

and it seems to be saying that the zbarExample-Prefix.pch is missing and i cant find it anywhere in the git file

Thanks

Brian

Muhammad Saifuddin said...

Hi Brain,

Thanks for pointed the missing file.. Its now added and found .pch entry in git .ignore the reason why this file ignored in initial commit :)

Cheers!!