Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
My favorite feature about Flash CS5 is the ability to create iPhone applications. In this movie, we'll look at exactly how to do that. On the stage here, I have a pre-built file. Now, if you don't have the Exercise Files, you can just go to File > New and then choose iPhone to create an iPhone FLA file. The thing that makes it an iPhone file is basically the Publish Settings. So, we'll talk more about that throughout the rest of this movie. So, on the stage here, I have some artwork, and you'll notice that the artwork is all bitmap images.
Bitmap images tend to work a little bit better on the iPhone than vector images. So, I have actually had all bitmaps on here. You can experiment with vector artwork and see the results that you get, but for this example, I chose to go with bitmaps. So, I have some buttons on the stage: oil1_btn, oil2_btn, oil3_btn. I have the Background, which is bg_mc. Then I have this bottom movie clip, which is results_mc.
This app is actually really simple. It's a promotional application, and basically, when you click, or tap, the olive oil bottle all the way on the left, then that results movie clip will slide up and say that you guessed right, and you can tap on that and link to a Web site. So, let's take a look at the coding for this application. I'm going to select the first key from the Actions layer and Open up the Actions panel. I use the Animate Vertically code snippet to make the results movie clip move up, and then what I did is I took a simple mouse click code snippet and I used Find and Replace to change click to TOUCH_TAP, so you can see here.
Then I changed MouseEvent to TouchEvent. So, you'll need to do that to have your iPhone app detect touches. So, I just changed MouseEvent.CLICK to TouchEvent.TAP, and you can use a Find and Replace to do that. So, this app is really simple, and it navigates to a webpage. Again, I use code snippets to this. It's going to explorecalifornia.org. Notice that I used the standard navigateToURL method to go there. That actually is recognized on the iPhone when you publish your application.
So, that will open up Safari on the iPhone, and you'll see this Web site there. One thing you can do to optimize a Flash iPhone application is cache all the objects as bitmaps and then set something called a bitmap matrix. What that does is it allows the iPhone to render the bitmap graphics very quickly, using hardware acceleration. That means the processing load is placed on the iPhone's video card, so that you can get smoother animations.
I'm actually going to do that for every object on the stage. Now the reason I do that is because this works for both animated objects and objects that are behind animated objects. Since everything in this application is either animated or behind something animated, it is going to apply to everything. So, I'm going to create a variable called bmpMatrix, capital M. I'll data type that to a Matrix. Notice that Flash automatically imports the Matrix class. I'll set it equal to a new Matrix.
Don't worry. You're not going to have to learn any kinds of complex math or anything here. We're just going to create that Matrix, and then we're going to apply it to all of the objects on the stage. So, results_mc.cacheAsBitmapMatrix = bmpMatrix. Then on the next line, results_mc.cacheAsBitmap = true. So, we need to do both of these lines of code for each object on the stage.
So, we will just copy and paste this code a few times and make the necessary modifications. Okay, now I'll close the Actions panel. Then we'll go to the iPhone Publish Settings. So, I'm going to deselect everything on the stage and then click Edit, next to iPhone Settings in the Properties panel. This is the menu you'll use to set up all the information for your iPhone applications, so you can publish it from Flash. So, you can choose the Output file name, the official App name - this is what's going to show up on the actual device when App is loaded on it - your application Version.
aspect ratio - whether you want it Full screen, or you want the app to Auto Orient to Portrait or Landscape, based on the accelerometer data. You can choose the Rendering. I'm going to use the graphics card, so I'm choosing GPU. For Included files, I'm going to click the Plus button, and then I'm going to add my Default file. This is what files shows up when you tap on the icon in the iPhone, and then you see that expanding image that comes up. That's what this image is. So I'm going to set it right here, and it's Default.png.
Now you need to name it Default.png, with a capital D, so make sure to do that. And it also needs to be in the same directory as your FLA file. So, it can't be in a subdirectory. It needs to be in the exact same directory. It needs to be name Default.png, with a capital D. If you're having trouble creating this file, you can actually just open up your application later on your iPhone and then take a screenshot of it, e-mail to yourself, change it to a PNG and all that stuff. So, I'll click Open to set that file. Then I'll go to the Icons tab.
For the Icons, you need to set icons of the size mentioned here, 29x29, 57x57 and 512x512. These all need to be PNG files. So, you can use the application of your choice to create those files. I actually just used Flash to do that. So, I'm going to set the files now. So the 29 file, and then the 57 file, and then the 512 file. Then I'll go back to the Deployment tab. Then I'm going to set my Certificate and my Provisioning Profile.
I actually stored both of these files inside the same directory as my FLA, but you may not want to do that. You might want to have it in some kind of documents folder on your computer, somewhere else. So, I have my P12 file. Type in my password here. I'll check Remember password for this session. That way, when I close this window and open it up again, I don't have to retype my password. My Provisioning Profile is also in the same directory as my FLA, so I'll set that too. My App ID is already set.
Its com.lynda.oliveoilgame. Then I'm going to select Quick publishing for device testing. You can also choose for device debugging. That will allow trace statements to show up in the output window in Flash, if you're testing on your device while it's still connected. We can also deploy it using Ad hoc Deployment or deploy to the App Store. You can find more information about Ad hoc and App Store Deployment on the Apple Developer Center site. So that's it. I am going to click OK. Then I'm going to publish the file by choosing File > Publish.
Depending on the Publish Setting you choose, publishing your iPhone app could take a varying amount of time. Once Flash has created your IPA file, you can then open that file in iTunes. So, I'll go over to Finder and double- click the file to open it with iTunes. The file is then copied into the Applications section, and then I can go to my iPod, or iPhone, and then click the Sync button to sync the app to the device. The app is now synced to my device, and I can actually see it right here in iTunes.
So, now I can have this application on my iPhone or any other compatible device. For more information about publishing iPhone applications from Flash, see adobe.com/iphone.
Get unlimited access to all courses for just $25/month.Become a member
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.