I have a flex application to work on an iPad. What is the best way to convert this application?
Your subject line is a separate question from your post LizaM, but I'm assuming you specifically want to convert a Flex application into HTML5 and not something natively iOS.
If the Flex application is complex and you need to convert to markup that you can work with for further development then you might not have any options other than to get your hands dirty and start from scratch. Good ol AJAX/HTML (or call it HTML5 - whatever sexy words you want to use for the markup you're using to run on Safari).
There are tools out there (e.g. Swiffy and SoThink SWF Decompiler), but I don't think they'll help much if you're trying to convert rich Flex library classes. I could be wrong about this, but that seems to be the state of affairs at the moment.
J
If you want to convert a Flex application to the iPad, you should consider porting it to a Native App. There are plenty of tools and documentation for doing that.
If you create a Flash Builder Mobile Project, you'll have an output option for iOS devices.
Flex 4.5 can compile your air applications for IOS. Simply use the compile for IOS options.
You can also compile for Android, RIM/Blackberry etc...
Related
just downloaded the Adobe XD and i think i am going to love it. I just have a problem Exporting it from Adobe XD into HTML / JS / CSS and port it to my code in Visual Studio, so i can do WebForm.
How is this possible.
Adobe XD has a plugin ecosystem where you can download a third-party built plugin to achieve tasks not supported by Adobe XD itself. For web export, I can recommend a plugin called "Web Export."
In order to use the plugin,
Make sure you have the latest version of XD
Go to Plugins > Discover Plugins > Search "Web Export"
Click "Install"
Hope this helps!
Natively, you can't (yet), although some external plugins can help you achieve that.
Adobe XD is a prototyping tool, ie it has been designed for producing the designs of websites and app before passing it to a developer that will "manually" build the HTML/CSS/JS out of it.
However, the export to HTML/CSS/JS feature has been asked before by the community many times and the Adobe team is currently working on it (check this and this).
AdobeXD positions elements on a canvas with x and y coordinates. This is not how HTML/CSS works for websites. You need to create an html structure and position elements with grids, flex, etc.
You could use position:absolute and position the html nodes like you would do in AdobeXD, but that will not play well with different devices and when you will do the responsive code.
There are applications and plugins that will import the html and css with absolute position, but there's not much you can do with that code. There's also Desech Studio that imports AdobeXD relatively, but it will not be pixel perfect and you then have to adjust margins and widths yourself.
Right now most people write the html/css by hand without any tools, because the tools have limitations.
You can use Anima plugin for that.
To use Anima for XD: www.animaapp.com/xd
I'm currently developing an Adobe Air application, using Adobe Flash CC 2005, Flash Builder 4.7, and ActionScript 3.
I notice that the UI Components like the List Component don't scroll up or down with finger on mobile devices.
If I'm understanding right, the Flex Framework has components like a List that support mobile.
Is it possible to integrate Flex Components to the existing Adobe Air project? If so, how?
Use feathers instead.. it's similar to flex.
http://feathersui.com/
I don't think so. You can wrap Flash Classes for use in Flex, but Flex components depend on the Flex Framework, which is contradictory with the timeline and the way Flash gets used in Flash. I believe that Air will generate those events when you publish your project for Air, so you should be able to add the functionality by listening for the events yourself and updating the scroll position. Good luck--the Flash component code isn't the easiest in the world to work with. You might be better off writing your own implementation so you know what's in it.
To give a little more insights on top of the answers already given. Yes it's possible but it's probably not worth the trouble because of the hacky way this must be done and the potential troubles this will bring. As said to one answer you should probably create your own specific components or try to find some in a custom library like MadComponents or others.
2 possible ways:
You can include all relevant Flex .swc in your project and then try for each component needed to instantiate yourself those components and follow strictly the Flex object instantiation workflow. This can be easy (Button) to very difficult depending on the component.
Create the needed component in a Flex project. Export the resulting .swf. Load that .swf in your AIR project (can be difficult in Ios). Access objects within the loaded .swf and create clones or use those objects directly in your app. This is a hack and results can be deceiving. The loading app will have to listen to the relevant Flex Event in order to determine if the components are ready to be used.
In a nutshell: it's possible to use Flex for creating Adobe AIR applications. Here are few articles from the official Adobe website:
Creating your first desktop AIR application with the Flex SDK
Creating your first desktop Flex AIR application in Flash Builder
Also, please, pay attention, that Flex-based applications require a different version of Flex SDK, than regular AS3-based applications.
http://www.adobe.com/devnet/air/air-sdk-download.html - here at the bottom you may find links to the AIR SDK for the Flex-based applications and text:
Note: Flex users will need to download the original AIR SDK without
the new compiler.
I want to start building hybrid HTML5 mobile apps; build the core functionalities via HTML5, then wrap this with a native layer for iOs, Android, BB..etc
After some research: I found I need to be familiar with plenty of technologies, namely: HTML5, JS, CSS3. Other technologies/frameworks I was advised to be familiar with: JQuery for Mobile, Sencha touch, Node.JS, Backbone.JS, PhoneGap..etc
Till now I just know the basics of HTML5, JS & CSS.
My question is:
Is there a "single" place (Book/Tutorial/Screen casts) where I can find a walkthrough Tutorial that deals with some of these technologies and guide me to building hybrid HTML5 apps (Maybe on iOs for example)..
I would want to learn the mentioned technologies among these, yet I am pretty keen on learning them in the context of building a hybrid mobile app and not on separate basis. I much prefer learning by doing real work (The app in the Tutorial/Book/Screen cast here) rather than learning each technology on its own.
Much appreciate your answers.
Omar
OK, let me expand my original answer:
HTML is short for hypertext markup language.
It is used to specify how to display STATIC content via the HTTP protocol, vulgo web.
HTML5 is version 5 of the HTML language specification, and is a RECOMMENDATION to a standard, but not really a standard by itsself.
CSS is used to apply advanced STATIC formatting to STATIC text/images, such as alternating background colors for even/odd rows in a table, text-flow, text-direction, size, boldness, font etc..
To make static content DYNAMIC, you need JavaScript.
JavaScript is a scripting language, that runs in the webbrowser of a vistor (client) to the website. Theoretically, it is meant to behave the same on each browser, but in reality, Microsoft used unfair competition and intentionally crippled the JavaScript implementation in it's browser (Internet Explorer), by diverging from the ECMA standard, and by implementing proprietary features, to stifle competition (Netscape) and make it impossible to develop compelling web applications, for example online office software.
JavaScript, the client-side programming language, is complemented by PHP/ASP.NET/JSP, which are programming languages & frameworks that run on the server, and are there to dynamically create static pages, for example by filling in data from a database, and to process and save user input, such as orders, payment, emails, feedback, etc, and to process input from HTML forms (input masks).
JQuery is a JavaScript framework.
That mainly means, it's a library of JavaScript functions that were designed to provide often-needed functions that do the same on each browser, effectively bypassing the anticompetitive practises of software vendors such as Microsoft and Apple.
It also provides basic functionality for event handling, graphics and AJAX (asynchronous JavaScript and XML), and functions for serializing/deserializing JSON (JavaScript object notation).
JQuery for Mobile is a version of JQuery optimized for mobile devices, such as Android or the iAnything. So are Sencha touch, Node.JS, Backbone.JS, etc.
The difference between HTML 5 / and HTML4/XHTML is mainly that HTML5 provides a so-called "unified" way to embed audio video. Which is not necessarely true, because each browser supports different audio and video formats, and there is NOT ONE audio & video format that is universally supported across all browsers.
HTML 5 also provides the very useful WebSockets, which basically allow you to make client-server applications on the web. Since this would enable compelling web applications and office applications that would be on par with Microsoft Office, Microsoft hasn't implemented WebSockets in the standard browser. It's available as separate plugin, which basically nobody bothers to download, which means one cannot use web sockets anytime soon if the web application should work with internet explorer. Additionally, HTML5 is only implemented by IE9+, and not by IE8. IE9 however is only available for operating systems newer than windows XP (vista, 7, 8). Which means one cannot install IE9 on Windows XP (35 percent of current windows installations, Windows makes up 85 percent of the desktop market).
To embed web applications on mobile phones, you need to embed your applications in a embedded WebBrowser. For Android, the interface to the embedded browser is called WebView, and you need to learn the Java programming language to use it. For Apple, I have no idea whether they have such a thing at all, but I'd suppose they have, though it's probably going to be more complicated, since that's Objective C, and not Java. Since I have neither a iPhone nor an Apple computer, I cannot tell you anything about it, except that it's crap because it doesn't support Flash, and that it costs 10 times more than what it's worth..
Screencasts, you'll probably find on youtube, if there are any.
Again, google search will provide you with the necessary answers if you have a specific question.
My question is: Is there a "single" place (Book/Tutorial/Screen casts)
where I can find a walkthrough Tutorial that deals with some of these
technologies and guide me to building hybrid HTML5 apps (Maybe on iOs
for example)..
Yes, http://www.google.com/ncr
You know, it has a wonderful search box for just about any problem...
Other good pages:
http://www.w3schools.com/html5/default.asp
http://www.w3schools.com/js/
http://docs.jquery.com/Tutorials
Here is an update on this question, as building hybrid apps have come a long way in three years.
I would start with looking into Phonegap, or the Adobe owned version called Cordova. This is a very popular route in quickly developing and distributing hybrid cross platform mobile apps. So popular in fact many other frameworks are built around the Cordova framework to give it a more native feel, such as
Ionic - this is by far the most popular, it's open source (free) and my favorite as I find the quickest and easiest to work with. In addition they have great documentation and great pre-builds. It's command line interface framework that works combines the Cordova, Bower (a package/plugin manager), Grunt and Angular JS frameworks into one powerful and quick CLI. If you are unaware of these frameworks they're definitely worth looking up if you're looking into building web or hybrid apps.
Mobile Angular UI - is an HTML 5 framework which uses bootstrap 3 and AngularJS to create interactive mobile apps.
Titanium - is a "complete" solution for creating hybrid mobile apps with all you need in one place with there downloadable program Titanium studio
Telerik - a website based program similar to Ionic and titanium for rapid development
Those are great places to start. If you don't already have a subscription to Lynda.com I would highly suggested it. The subscription is roughly $25 a month depending on your location. They have hundreds online video courses that can run a few hours long and are very great I giving you a good scope and how-to do many projects and understanding many frameworks. teamtreehouse.com is another great tutorial tool they have a lot smaller selection of videos better more in depth and hands-on and will work with many other frameworks with in the project.
You want to learn how to develop a hybrid app that works with multiple platforms such as android, iOS, Windows, etc. This means you need to learn PhoneGap and Cordova(preferred). These are almost the same, one really is part of the other.
Google both phonegap and cordova, install the packages (requires a little bash command line knowledge). It is relatively quick and easy to get the example HelloWorld app in both Phonegap and Cordova.
After that? well, you will have to learn HTML, CSS, javascript at minimum for the web side of a hybrid application. The native side (Android, iOS, etc.) will require learning Android Studio/java for android, or Xcode/swift for iOS.
Everything you want to learn is either on youtube.com for free, or Udemy, Udacity, Lynda. Some sites you will have to pay for, but its WORTH IT.
Or do you know of anyone working on one? I've been checking all the stuff you can do with HTML 5 here and some other sites and is amazing. I think such a big library should have some IDE with intellisense and easy documentation (like when you press F1 on Visual Studio while a symbol is highlighted) and all that stuff. And if there is not then I should probably start working on one :).
Most of known IDEs and their latest version, like Netbeans, Eclipse, Dreamweaver, support natively HTML5. You can find more info and pick one according to your preferences.
There are numerous HTML 5 IDEs, it's important to not necessarily separate current web technologies with HTML5 as they are really are very close to being one and the same. For example, the latest version of Adobe's tool offer support for HTML5, as well as other IDEs such as Aptana. Unfortunately, the HTML5 spec is not done yet so there will be discrepancies between browsers, which a builder could work around, but will put a lot of onus on you.
Alternatively, there are numerous client and server-side frameworks that abstract HTML5 and some of its features, each of these have varying levels of support, a builder, and intellisense. For example, I'm a co-founder of the NOLOH development platform (http://www.noloh.com), which abstracts away browser differences and supports HTML5 transparently to you the developer, allowing you to concentrate on your application and functionality without worrying about the plumbing. We also have what's known as "code stubs" that you can add to any IDE most IDEs and get intellisense/auto-complete functionality. We also have a visual builder in the works that should be out relatively soon.
Whatever you pick, just make sure you're comfortable with it, but you definitely don't want to re-invent the wheel here.
You should definitely try HTML5 Builder.
Try this, HTML5 Boilerplate
if you are looking for something that builds mobile sites or ads html5 builder, maybe you could try http://mobdis.com.
I have made an application that is coded only in ActionScript 3.0, and uses HTML and JavaScript for the display.
I would like to have the same result, but using Adobe AIR. I do not know Adobe AIR at all, so I was wondering if you could direct to some good tutorials that will teach me how I can move my .html/.js/.as files to Adobe AIR please. I am using Adobe Flash Builder 4.
Thank you very much,
Rudy
Are you using HTML and JavaScript for anything other than embedding the SWF? If not, you can create a Flex project from Flash Builder (at least that was the way in Flex Builder 3 - I don't know if they've changed it) and mark output format as AIR to start with. The easiest way would be to add the main Sprite of your AS project as a child to the rawChildren of the WindowedApplication class of the AIR from the creationComplete event handler.
It is hard to say more without knowing what type of project you're talking about.
You could still do this, but you would have to embed your own browser. Look at HTMLLoader:
At the very simplest, your air app would create an html display, where you would then embed your swf into an html page. (almost exactly like what you're doing now). However, AIR's webkit seems fairly old, and they didn't import everything, so some css stuff like corner-radius, etc, will not display as you would in any other browser.
However, this will only get you so far, as you won't have AIR capabilities yet. You would have to extend HTMLHost to create an API for the javascript container to access desktop'y capabilities, when you when then again have to use ExternalInterface again. This is probably where things will get a lot more tricky.