Search

 

March 2011
S M T W T F S
« Feb   Apr »
 12345
6789101112
13141516171819
20212223242526
2728293031  

Tags

Archives


« | Main | »

Flex QR Code Sample

By Rich Tretola | March 15, 2011
26,545 views

This is an extension of the sample application that was posted recently by Santori Canton at http://riarockstars.com/2011/03/11/creating-qr-codes-in-actionscript/ using the open source library Zxing.

This version will create the initial tab from the current URL (note: this app is running in an iFrame which is why you see a www.everythingflex URL) and also allow you to save the image you create.

Here is the app, right click for full source.

Here is the main source.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               applicationComplete="init()" viewSourceURL="srcview/index.html">
   
   
    <fx:Declarations></fx:Declarations>
    <fx:Script>
        <![CDATA[
            import com.google.zxing.BarcodeFormat;
            import com.google.zxing.MultiFormatWriter;
            import com.google.zxing.common.ByteMatrix;
           
            import mx.controls.Alert;
            import mx.graphics.codec.JPEGEncoder;
            import mx.utils.UIDUtil;
           
            private var _bmd:BitmapData;
           
           
            private var file:FileReference = new FileReference();
           
            private function geturlhttp():String {
                return ExternalInterface.call("window.location.href.toString");
            }
           
            protected function button1_clickHandler(event:MouseEvent):void
            {
               
                var jpg:JPEGEncoder = new JPEGEncoder();
                var ba:ByteArray = jpg.encode(bmp_qrCode.bitmapData);
                var uuid:String = UIDUtil.createUID();
                file.save(ba, uuid + '.jpg');
            }
           
           
            public function init():void
            {
                _bmd = new BitmapData(300, 300, false, 0x808080);
                bmp_qrCode.source = _bmd;
                txt_in.text = geturlhttp();
                updateQRCode();
            }
            protected function updateQRCode(e:Event = null):void
            {
                if(txt_in.text.length > 0)
                {
                    var textString:String = txt_in.text;
                    var qrEncoder:MultiFormatWriter = new MultiFormatWriter();
                    try
                    {
                        var result:ByteMatrix = (qrEncoder.encode(textString,BarcodeFormat.QR_CODE,300,300)) as ByteMatrix;
                    }
                    catch (e:Error)
                    {
                        Alert.show('Invalid input string');
                        return;
                    }
                    for (var h:int = 0; h < 300; h++)
                    {
                        for (var w:int = 0; w < 300; w++)
                        {
                            if (result._get(w, h) == 0)
                            {
                                _bmd.setPixel(w, h, 0);
                            }
                            else
                            {
                                _bmd.setPixel(w, h, 0xFFFFFF);
                            }        
                        }
                    }
                }
            }
        ]]>
    </fx:Script>
    <s:VGroup left="10" top="10">
        <s:HGroup>
            <s:Label text="Enter Text Data (URL)" />
            <s:TextInput id="txt_in" change="updateQRCode()" maxChars="4296" width="300" />
        </s:HGroup>
        <s:Label text="{txt_in.maxChars - txt_in.text.length} characters left" />
       
        <s:BitmapImage id="bmp_qrCode" width="300" height="300" />
        <s:Button label="Save QR" click="button1_clickHandler(event)"/>
       
       
    </s:VGroup>
</s:Application>

Topics: ActionScript 3, Flex 4 | 12 Comments »

12 Responses to “Flex QR Code Sample”

  1. Adrian Parr Says:
    March 15th, 2011 at 1:53 pm

    Hi Rich,

    Good stuff. I didn’t realise the Zxing library supported ActionScript.

    I did something similar and used a PHP proxy to circumvent Google’s lack of a crossdomain policy file.

    http://www.adrianparr.com/?p=140

    I then allow the user to save it out as PNG, JPEG, PDF or print.

    Reply to this comment

    Rich Tretola Reply:

    Yep, pretty cool stuff.

    Reply to this comment

  2. AB Basson Says:
    March 17th, 2011 at 3:16 am

    Hi Rich.

    I have a situation where some text makes the bar code not readable. I was wondering if you have any clue why.

    Here is the sample text which does NOT work.

    {“contactDetails”:{“postalAddress”:{“town”:”durbanville”,”prov”:”western cape”,”street”:”18de laan 35, langehenhoevenstraat singel

    Now change the text to this.

    {“contactDetails”:{“postalAddress”:{“town”:”durbanville”,”prov”:”western cape”,”street”:”18de laan 35 langehenhoevenstraat singel

    And it works again. In this case I removed the “,” after the 35.

    I would really appreciate any feedback. Thanks.

    Reply to this comment

    AB Basson Reply:

    This is the full text caption. And I use the xzing onlilne decoder.

    {“contactDetails”:{“postalAddress”:{“town”:”durbanville”,”prov”:”western cape”,”street”:”18de laan 35 , langehenhoevenstraat singel “,”postalCode”:”7530″},”telHome”:”234234234234″,”telCell”:”3333444555″,”telWork”:”2433334444″,”telFax”:”3334000099″,”email”:”abasson12@gmail.vom”,”physicalAddress”:{“town”:”durbanville”,”prov”:”western cape”,”street”:”18de laan 35, langehenhoevenstraat singel “,”postalCode”:”7530″}},”bankDetails”:{“accountNo”:”90009334009″,”accountHolder”:”du plessis moshela aj”,”name”:”AFRICAN BANK LTD”,”branchName”:”Tygervallei”,”branchCode”:”2423234″,”accountType”:{“key”:”savings”,”description”:”Savings account”}},”employmentDetails”:{“occupation”:”programmer”,”empNo”:”4t345″,”employer”:”115 : NAMAKWA DISTRIKSMUNISIPALITEIT”,”branch”:null,”costCentre”:10335,”joiningFundDate”:1299621600000,”branchID”:0,”annualPensionSalary”:4543453,”joiningServiceDate”:1300053600000,”costCenterDesc”:”NAMAKWA DISTRIKSMUNISIPALITEIT”},”transferDetails”:{“namePrevEmployer”:”cape town munisipality”,”prevFundTerminationDate”:8,”namePrevFund”:”cape retirement fund”,”memberNo”:”2343″,”fundType”:”bla bla “,”employeeNo”:”234″,”transferFromPrevFund”:”yes”,”benefitReceivedDetails”:”Jack Mogale, dubbed the West-End serial killer because he lured, raped and killed women at a factory near his home, was found guilty in the Johannesburg High Court on Wed”,”benefitFromPrevFundReceived”:”yes”},”formId”:1,”fundDetails”:{“fundName”:”CAPE JOINT PENSION FUND (CJPF)”,”employer”:”115 : NAMAKWA DISTRIKSMUNISIPALITEIT”,”employerId”:115,”fundId”:1},”personalDetails”:{“fname”:”johannes jacobus samual petrus du toit”,”gender”:”male”,”dob”:637192800000,”children”:2,”maritalStatus”:”Married”,”corrLang”:”english”,”spouseFname”:”moses botha smith puphela”,”incomeTaxNo”:”0001335090″,”dom”:1300053600000,”spouseSurname”:”johanna magdalene susanna katarina”,”sdob”:637538400000,”revenueOffice”:”Bellville, cape town, western cape”,”nationalityID”:7,”id”:0,”passportNum”:9001119,”surname”:”van niekerk du plessis”}}

    Reply to this comment

    Tom Chiverton Reply:

    Shouldn’t the comma after the 35 be either escaped, or the whole field in quote marks ?

    Reply to this comment

  3. Kaushk Datta Says:
    March 17th, 2011 at 8:58 am

    http://doyouflex.com/zxing/zxing.html Straight from the google code zxing project. Thanks to Bas Vijfwinkel.

    http://doyouflex.com/readqrcode/ReadQRCode.html

    I have created Android AIR app too using the actionscript library. Soon to be published.

    Reply to this comment

    Paul Reply:

    Was just wondering if the Android AIR app had been published anywhere yet ?

    Thanks

    Reply to this comment

  4. Michael B Says:
    April 19th, 2011 at 10:21 am

    http://codeknow.blogspot.com/2011/04/quick-reader-flex4-xzing-android-air-26.html <– here is the reader for droid … built in flex *open source of course :)

    Reply to this comment

  5. Bill B Says:
    July 13th, 2011 at 4:22 pm

    Looks like there’s a bug in the encoding on the 64 byte barrier. For instance, if you have

    http://123.345.678.54/assets/Manager/addRegisteredUser?tableId=TIA
    (65 Characters)
    the QR code generated is not readable

    if I backspace until it does scan:

    http://123.345.678.54/assets/Manager/addRegisteredUser?tableID=TI
    (64 characters) or add until it scans:

    http://123.345.678.54/assets/Manager/addRegisteredUser?tableId=TIA123
    (68 characters)

    Any ideas? It must be a bug in the QR encoding software.

    Reply to this comment

    ivan Reply:

    I encoutered the same problem, some text will generate unreadable QRCode. Any way to report bug?

    Reply to this comment

  6. Flex QR Code Sample « EverythingFlex: Flex & AIR « marcusjpotter Says:
    September 22nd, 2011 at 6:01 am

    [...] http://blog.everythingflex.com/2011/03/15/flex-qr-code-sample/ //bookmark forself, interested in.performance differences of this and other AS based qr code readers. Like this:LikeBe the first to like this post. [...]

  7. Bas Vijfwinkel Says:
    November 2nd, 2011 at 1:26 am

    I traced the error that causes some QRcodes to be invalid :

    In MaskUtil.as :
    Look for the method : public static function applyMaskPenaltyRule4(matrix:ByteMatrix):int
    and change the return statement to :
    return int(Math.abs(int(darkRatio * 100 – 50)) / 5) * 10;

    Look for method : public static function getDataMaskBit(maskPattern:int,x:int,y:int):int
    and change the case 4 statement to:
    return ((int(y / 2) + int(x / 3)) % 2 == 0) ? 1 : 0;

    Actionscript and Java cast numbers in a different way and this causes small differences that
    rendered some QRcodes invalid.

    I will update the files in the repository soon.

    If you find any other issues, feel free to post them in the ZXing mail group.

    Reply to this comment

Comments