{"id":1174,"date":"2014-09-19T16:56:07","date_gmt":"2014-09-19T15:56:07","guid":{"rendered":"http:\/\/www.aymericlamboley.fr\/blog\/?p=1174"},"modified":"2014-11-01T14:30:10","modified_gmt":"2014-11-01T13:30:10","slug":"planete-liege-anes-qrcode-camera-and-videos","status":"publish","type":"post","link":"http:\/\/www.aymericlamboley.fr\/blog\/planete-liege-anes-qrcode-camera-and-videos\/","title":{"rendered":"Plan\u00e8te Li\u00e8ge, ANEs, QRCode, Camera and Videos"},"content":{"rendered":"<p>I&#8217;m happy to introduce you a new app: Plan\u00e8te Li\u00e8ge (cork planet) for iOS &#038; Android. The application (in french only) gives lots of information about winemaking. Sometimes making institutional apps reveals many challenges as we will see below.<\/p>\n<p><!--more--><\/p>\n<p><strong>Camera<\/strong><br \/>\n<a href=\"http:\/\/www.aymericlamboley.fr\/blog\/wp-content\/uploads\/2014\/07\/screen568x568.jpg\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.aymericlamboley.fr\/blog\/wp-content\/uploads\/2014\/07\/screen568x568-169x300.jpg\" alt=\"screen568x568\" width=\"169\" height=\"300\" class=\"alignleft size-medium wp-image-1192\" srcset=\"http:\/\/www.aymericlamboley.fr\/blog\/wp-content\/uploads\/2014\/07\/screen568x568-169x300.jpg 169w, http:\/\/www.aymericlamboley.fr\/blog\/wp-content\/uploads\/2014\/07\/screen568x568.jpg 320w\" sizes=\"(max-width: 169px) 100vw, 169px\" \/><\/a><br \/>\nIn the corkstagram part (I&#8217;m sure you get the joke), we take a cork in photo and can customize it with several objects. We needed something integrated into the application, so we couldn&#8217;t use the <a href=\"http:\/\/help.adobe.com\/en_US\/FlashPlatform\/reference\/actionscript\/3\/flash\/media\/CameraUI.html\" target=\"_blank\">CameraUI<\/a> class. We used the <a href=\"http:\/\/help.adobe.com\/en_US\/FlashPlatform\/reference\/actionscript\/3\/flash\/media\/Camera.html\" target=\"_blank\">Camera<\/a> class, create the object and use the Video object to display it. Our app is forced into portrait mode whereas the Camera object expect a landscape mode on mobile. So we&#8217;d to rotate ourselves the Video object. For iOS it works great but for Android on some devices it&#8217;s flipped at 180. Unfortunately we can&#8217;t have this information, so we&#8217;d to put a button on Android for flipping the camera. That&#8217;s really a feature that AIR should handle directly.<\/p>\n<p><strong>Change orientation<\/strong><br \/>\nAs I said the application is in portrait mode, but the main part use landscape mode. With AIR you can easily rotate the main content using this snippet:<\/p>\n<pre class=\"brush: as3; title: ; notranslate\" title=\"\">stage.setOrientation(StageOrientation.ROTATED_RIGHT);<\/pre>\n<p>Be careful, on Android (if you&#8217;re using Stage3D &#038; <a href=\"http:\/\/gamua.com\/starling\/\" target=\"_blank\">Starling<\/a>) you will lost the context and so it will take time to see the full content of the new part!<\/p>\n<p><strong>StageVideo<\/strong><br \/>\nNeeding StageVideo with Starling? Just set visible false to stage3d! Be careful, it won&#8217;t remove touch interactivity etc.<\/p>\n<p><strong>QRCode<\/strong><br \/>\nWe&#8217;re in 2014 and it&#8217;s complicated to scan a QR Code with AS3. Firstly, I looked for ANEs and <a href=\"https:\/\/github.com\/saumitrabhave\/qr-zbar-ane\" target=\"_blank\">the only one<\/a> I found had several issues: really hard to recompile it due to its IntelliJ integration, managing all the camera stuff which is great but unfortunately we can&#8217;t put something on top of Objective-C \/ Java code, bugs with Android&#8230;<br \/>\nOk so no ANE. But finally I just need to check a bitmap data and there are plenty of AS3 libs making it. So time for a small benchmark? After several test, I was so frustrated&#8230; what are those shitty performances? 7 seconds for a QR Code scan, seriously?<br \/>\nCrazy that it&#8217;s complicated to scan a QR Code with AS3 nowadays. So I made <a href=\"https:\/\/github.com\/DaVikingCode\/ZXing-ANE\" target=\"_blank\">my first (public) ANE<\/a> using <a href=\"https:\/\/github.com\/zxing\/zxing\" target=\"_blank\">ZXing<\/a> library. I included the AS3 lib for the default platform, so it means this ANE works for iOS &#038; Android (using native code) and on all other targets supported by Flash using the AS3 code. Once I made it, I discovered <a href=\"https:\/\/github.com\/luarpro\/BitmapDataQRCodeScanner\" target=\"_blank\">an other one<\/a> which did the same thing using <a href=\"http:\/\/zbar.sourceforge.net\/\" target=\"_blank\">ZBar<\/a> lib. However since it isn&#8217;t packaged with a default platform, I <a href=\"https:\/\/github.com\/DaVikingCode\/ZBar-ANE\" target=\"_blank\">forked<\/a> it.<\/p>\n<p><strong>Instagram<\/strong><br \/>\nWe needed to be able to share the corckstagram picture on Instagram. I discovered those <a href=\"https:\/\/github.com\/sharkhack\" target=\"_blank\">ANEs<\/a> but I wasn&#8217;t happy with their structure. I really needed the same API between iOS &#038; Android, and everything into the same ANE. So I <a href=\"https:\/\/github.com\/DaVikingCode\/Instagram-ANE\" target=\"_blank\">forked<\/a> it and changed its structure.<\/p>\n<p>AIR is a very powerful tool, and ANEs make it so strong.<br \/>\n<a href=\"https:\/\/itunes.apple.com\/us\/app\/planete-liege\/id917237194?l=fr&#038;ls=1&#038;mt=8\" target=\"_blank\">iOS<\/a> &#038; <a href=\"https:\/\/play.google.com\/store\/apps\/details?id=air.com.planeteliege.PlaneteLiege\" target=\"_blank\">Android<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;m happy to introduce you a new app: Plan\u00e8te Li\u00e8ge (cork planet) for iOS &#038; Android. The application (in french only) gives lots of information about winemaking. Sometimes making institutional apps reveals many challenges as we will see below.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0},"categories":[161,162,4,33,98,90],"tags":[119,170,15,174,91],"_links":{"self":[{"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/posts\/1174"}],"collection":[{"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/comments?post=1174"}],"version-history":[{"count":13,"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/posts\/1174\/revisions"}],"predecessor-version":[{"id":1248,"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/posts\/1174\/revisions\/1248"}],"wp:attachment":[{"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/media?parent=1174"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/categories?post=1174"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.aymericlamboley.fr\/blog\/wp-json\/wp\/v2\/tags?post=1174"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}