Advanced Draw widget

[EricVenden]

I'm looking for assistance with the Advanced Draw widget.  I'm trying to add the widget to a FB project and I am wondering where to put the component classes in the project.  Do they go in their own folder(s) or should I add them to existing folders.
Thanks
Eric V

[DonCopple]

Make a new folder under the src/Widgets folder.  Open FB and then Project > properties in the dropdown. In the properties dialog, select Flex Modules, and add, then browse to the AdvancedDraw.mxml file you just copied into your new folder under the widgets folder.  This will allow you to make modifications, and recompile when you run the project.  Hope that helps.....

When calling th widget in your config xml, you will have to use config="widgets/<your folder>/AdvancedDrawWidget.xml" and url="widgets/<your folder>/AdvancedDrawWidget.swf", or whatever you call the particular widget you are working on.

[EricVenden]

Thanks for the reply Don,
I was mainly referring to the files in the assets and com folders under the src folder in the download you provided.  I am not a full-fledged developer and am not sure if I just add the files in these folders to their appropriate existing folders in the existing FB project or if I just add those folders/files as they exist (file structure) to the FB project.
Thanks for your time.
Eric V

Make a new folder under the src/Widgets folder.  Open FB and then Project > properties in the dropdown. In the properties dialog, select Flex Modules, and add, then browse to the AdvancedDraw.mxml file you just copied into your new folder under the widgets folder.  This will allow you to make modifications, and recompile when you run the project.  Hope that helps.....

When calling th widget in your config xml, you will have to use config="widgets/<your folder>/AdvancedDrawWidget.xml" and url="widgets/<your folder>/AdvancedDrawWidget.swf", or whatever you call the particular widget you are working on.

[DonCopple]

Eric,
I don't know if that was my download or Robert's, I don't remember posting one in the gallery.  But anyway to answer your questions:

Normally when you download the source code there is a compiled folder, and uncompiled.  Depending on how the file structure was built in the zipped code will dictate how you need to go about unzipping.

If you are just using the viewer you would move the images in the zipped assets folder, and past them in your in your assets folder, and then the <xxxx>Widget.xml and <xxxx>.Widget.swf into a new <xxxx> folder under widgets. I would do this with your file explorer.

I am assuming you are using FB to do some other coding, but you don't have to to add custom widgets to the Flex Viewer, as long as you have compile code (xml, and swf).

Now if you are using Flash Builder to recompile the widget then it is a little more complicated, but not impossible (I am still a beginner too).  You want to copy files out of the uncompiled zipped folder.

Again copy the images out of the zipped assets folder and paste them into the assets/images folder in the source folder (src).  Then unzip the a full zipped code folder for the <xxxx> widget and paste in to the Widgets folder.  When you open your new folder under the Widgets folder you should see the xml, and mxml.  if you leave the assets in the same folder it is ok, you'll just have to reference that in your config file.  Attached is the structure you would have in FB.  You don't have to put anything in the com folder, just assets and widgets, unless you start programming the API itself.  You have one more step to compile the widget now. You will have your open project click on project > properties.  It will open the properties dialog.  On the levt side of the screen select Flex Modules, then click add and browse to the new widget folder and the mxml file for that widget.  I have attached a picture of what that looks like too.  Add the widget to the config file (the one under the src file) and run, it will recompile the widget and place everything in the bin-debug folder compiled.  Hope that helps.....


[ATTACH=CONFIG]11541[/ATTACH][ATTACH=CONFIG]11542[/ATTACH]

[EricVenden]

Thanks for the response Don,
I downloaded Ryan's Advanced Draw Widget for FV 2.4

Based on the readme - the source code references several skins and components included in the Flex API library.  The source code has the widget components and also has skins, events, and utils folders. 

I will try various scenarios to get the widget into my FB project.
Thanks
Eric V

Eric,
I don't know if that was my download or Robert's, I don't remember posting one in the gallery.  But anyway to answer your questions:

Normally when you download the source code there is a compiled folder, and uncompiled.  Depending on how the file structure was built in the zipped code will dictate how you need to go about unzipping.

If you are just using the viewer you would move the images in the zipped assets folder, and past them in your in your assets folder, and then the <xxxx>Widget.xml and <xxxx>.Widget.swf into a new <xxxx> folder under widgets. I would do this with your file explorer.

I am assuming you are using FB to do some other coding, but you don't have to to add custom widgets to the Flex Viewer, as long as you have compile code (xml, and swf).

Now if you are using Flash Builder to recompile the widget then it is a little more complicated, but not impossible (I am still a beginner too).  You want to copy files out of the uncompiled zipped folder.

Again copy the images out of the zipped assets folder and paste them into the assets/images folder in the source folder (src).  Then unzip the a full zipped code folder for the <xxxx> widget and paste in to the Widgets folder.  When you open your new folder under the Widgets folder you should see the xml, and mxml.  if you leave the assets in the same folder it is ok, you'll just have to reference that in your config file.  Attached is the structure you would have in FB.  You don't have to put anything in the com folder, just assets and widgets, unless you start programming the API itself.  You have one more step to compile the widget now. You will have your open project click on project > properties.  It will open the properties dialog.  On the levt side of the screen select Flex Modules, then click add and browse to the new widget folder and the mxml file for that widget.  I have attached a picture of what that looks like too.  Add the widget to the config file (the one under the src file) and run, it will recompile the widget and place everything in the bin-debug folder compiled.  Hope that helps.....


[ATTACH=CONFIG]11541[/ATTACH][ATTACH=CONFIG]11542[/ATTACH]

[EricVenden · Accepted solution]

Pretty straightforward in the end.  I looked at some of the paths in the source code and managed to put all the files where they needed to go.
Eric V

Thanks for the response Don,
I downloaded Ryan's Advanced Draw Widget for FV 2.4

Based on the readme - the source code references several skins and components included in the Flex API library.  The source code has the widget components and also has skins, events, and utils folders. 

I will try various scenarios to get the widget into my FB project.
Thanks
Eric V

[RobertScheitlin__GISP]

Eric,

   The adding of the source code is a little complicated...

1. The easy part is copy the DrawAdvanced folder to the widgets folder in Flash builder.


2. Right click on src folder and choose new package and type com.nzgc.viewer


3. Copy the four folder in the Source Code\src\com\nzgc\viewer and paste them in the new package from step 2.


4. Right Click on assets and choose new package and type skins.


5. Copy "Source Code\src\assets\skins" and paste by right clicking the assets package and say yes to overwrite.


6. Copy "Source Code\src\assets\viewer" and paste by right clicking the assets package.


7. Then just add it to the modules list as usual.

Don't forget to click the top arrow (promote) and to click the Mark as answer check as shown below:

[EricVenden]

Robert,
Wondering if I need to do the process you describe...I copied the source folders/files to the appropriate/new folders in my FB project, changed a couple things in the DrawWidget.mxml, and compiled the project.  My changes worked and the new swf has not caused any errors...

Did I get lucky on this?  Might something happen down the line?
Thanks Robert
Eric

Eric,

   The adding of the source code is a little complicated...

1. The easy part is copy the DrawAdvanced folder to the widgets folder in Flash builder.


2. Right click on src folder and choose new package and type com.nzgc.viewer


3. Copy the four folder in the Source Code\src\com\nzgc\viewer and paste them in the new package from step 2.


4. Right Click on assets and choose new package and type skins.


5. Copy "Source Code\src\assets\skins" and paste by right clicking the assets package and say yes to overwrite.


6. Copy "Source Code\src\assets\viewer" and paste by right clicking the assets package.


7. Then just add it to the modules list as usual.

Don't forget to click the top arrow (promote) and to click the Mark as answer check as shown below:

[RobertScheitlin__GISP]

Eric,

   You are likely OK. These were just the steps I recommend. I posted them before I saw your post that you had figured it out. I was waiting for someone with experience using this widget to post some instructions, but when no one surfaced I started to look at how to add it myself.

[EricVenden]

Thanks for looking into this Robert.

Eric,

   You are likely OK. These were just the steps I recommend. I posted them before I saw your post that you had figured it out. I was waiting for someone with experience using this widget to post some instructions, but when no one surfaced I started to look at how to add it myself.