You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by qu...@apache.org on 2013/01/13 21:01:50 UTC

svn commit: r1432715 - /flex/site/trunk/content/v2/doc-getstarted.cmsPage

Author: quetwo
Date: Sun Jan 13 20:01:49 2013
New Revision: 1432715

URL: http://svn.apache.org/viewvc?rev=1432715&view=rev
Log:
updating getting-started page on v2 site.

Modified:
    flex/site/trunk/content/v2/doc-getstarted.cmsPage

Modified: flex/site/trunk/content/v2/doc-getstarted.cmsPage
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/v2/doc-getstarted.cmsPage?rev=1432715&r1=1432714&r2=1432715&view=diff
==============================================================================
--- flex/site/trunk/content/v2/doc-getstarted.cmsPage (original)
+++ flex/site/trunk/content/v2/doc-getstarted.cmsPage Sun Jan 13 20:01:49 2013
@@ -14,7 +14,9 @@ please contact us on the [mailing list][
 4. **Run the SDK installer**  The first question you will be asked is the installation directory.  If you are on a Mac, use /Appplications/Adobe Flash Builder 4.7/sdks/4.9.0/.  If you are on a PC, use C:\Program Files(x86)\Adobe Flash Builder 4.7\sdks\4.9.0\.  You will need to create the 4.9.0 folders.  Press Next.
 5. **Accept SDK Licenses and Install**  Check the red boxes to accept each of the licenses.  Read the licenses, of course ;)  Click Install to download all the components into the new 4.9.0 directory.  This can take a few minutes.
 6. **Run Flash Builder** Launch Adobe Flash Builder.  You may need to login with your Adobe ID to activate the trial.
-7. **Tell Flash Builder abou the SDK** On Windows, go to the Window Menu -> Preferences.  On the Mac, go to the Flash Builder menu -> Preferences.  Go to the Flash Builder node, then select the Installed Flex SDKs node.  Click [ADD], then choose the directory in which you saved the 4.9.0 SDK (Step 4).
+7. **Tell Flash Builder abou the SDK** On Windows, go to the Window Menu -> Preferences.  On the Mac, go to the Flash Builder menu -> Preferences.  Go to the Flash Builder node, then select the Installed Flex SDKs node.  Click [ADD], then choose the directory in which you saved the 4.9.0 SDK (Step 4). The name should be populated with Apache Flex 4.9.0 FP11.1 en_US.  Press OK, and OK again.
+8. **Create a new project**  Right-click in the empty Package Explorer area, choose New -> Flex Project.  Give the project a name.  Under the Flex SDK version, choose Apache Flex 4.9.0.  Press Finish.  Flash Builder will create the new project.
+9. **Start Coding!**  Jump down below to make your first Hello World application.
 
 <div class="headline"><h4>Setting up Apache Flex with Jetbrain's IntelliJ</h4></div>
 1. **Download JetBrains IntelliJ**  IntelliJ IDEA is available from the [JetBrain's Website][2]. They offer a 30-day trail and it retails for about $200.  It is available for both Windows and MacOS X
@@ -22,8 +24,40 @@ please contact us on the [mailing list][
 3. **Download the SDK installer** Go to the [Download the SDK Installer][4] on the menu above and install the SDK installer.  Click on the Download link on the installer badge, which will download the proper installer for your computer.
 4. **Run the SDK installer**  The first question you will be asked is the installation directory.  Note where you save the SDK (as you will need it later).  Press Next.
 5. **Accept SDK Licenses and Install**  Check the red boxes to accept each of the licenses.  Read the licenses, of course ;)  Click Install to download all the components into the new 4.9.0 directory.  This can take a few minutes.
+6. **Run IntelliJ**  Run IntelliJ.  You will need to start the 30 day trial, and accept the license agreement when the app runs the first time.  You will be launched into the configuration wizard.  Select which VCS Plugins you want (we suggest Git Subversion).  Next, select the Web/J2EE Plugins (We suggest Database, SQL and WebServices).  Next, select the HTML Development tools (You must select FLash/Flex, CSS, JavaScript, JavaScript Debugger, but we suggest keeping them all selected).  Finally, select which other plugins you wisht ot use (Select ANT, Properties, Copyright, Coverage, IntelliLang, Inspection Gadgets, Type Migration, UML.  We suggest keeping most of the defaults).
+7. **Create your new project** When at the welcome screen, select "Create New Project". In the left menu, choose Flash Module under the Other heading.  Give the project a name, and select Next.
+8. **Configure the new project**  On the "New Project" screen, select Web for the target platform, and keep the rest of the options the same.  Keep the Flex SDK as [none] for this step. Click Finish.
+9. **Tell IntelliJ about the SDK** Right click on your project name in the Project Explorer, and click Open Module Settings. In the second pane, click the application settings (it says (app) behiend the name -- it should have red squigglies under it).   Go to the dependancy tab.  To the right of the Flex SDK drop down, select New... to add the 4.9.0 SDK to the project.  Find the 4.9.0 directory you created in step 4, and select Choose. Press Ok to return to the project.  Wait for IntelliJ to index the project and the new SDK.
+10. **Create your Application file** Add a new MXML component under the /src/ directory by right clicking on src.  Give it a name of your choosing, Template of "Flex 4 Component" and Parent Component of Application (spark.components).
+11. **Finish configurating your project** Go back to the project settings (right-click on the project name in the project explorer -> Module Settings).  Go to the General Tab of the app settings.  Click the ... button to the right of the Main Class box, and choose the filename you just created.  This will set the project root.
+11. **Start Coding!**  Jump down below to make your first Hello World application.
+
+<div class="headline"><h4>Creating your first Hello World application</h4></div>
+This is a very simple, generic hello world application.  You can learn a lot more by checking out some of our other resources below, or some of our [tutorial videos][5].
+
+1.  Set the height and width of your application.  Add the following tags to the Application tag (2nd line) :  `width="640" height="480"`
+2.  Add a new Layout tag within the Application tags.  This will tell Flex how we plan on laying out our app.  `<s:layout></s:layout>`
+3.  Within the layout tags, add a BasicLayout tag.  This will tell Flex we intend on telling it where to place our components.  `<s:BasicLayout />`
+4.  Between the Layout and Application tags, Add a Label tag.  We will be setting the `text` `horizontalCenter` and `verticalCenter` properties.  `<s:Label text="Hello World!" horizontalCenter="0" verticalCenter="0" />`
+5.  Find the Debug toolbar icon and click it.  Your application should be launched in your default web browser and you should see the words Hello World! in the middle of the screen.
+
+The complete code listing is :
+
+    <?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" width="640" height="480">
+
+        <s:layout>
+            <s:BasicLayout />
+        </s:layout>
+
+        <s:Label text="Hello World!" horizontalCenter="0" verticalCenter="0" />
+
+    </s:Application>
 
  [1]:  http://www.adobe.com/products/flash-builder-family.html
  [2]:  http://www.jetbrains.com/idea/
  [3]:  community-mailinglists.html
- [4]:  download-installer.html
\ No newline at end of file
+ [4]:  download-installer.html
+ [5]:  doc-videos.html
\ No newline at end of file