Application - Source

Making an ItemRenderer for the List Smaller

the key is in the renderer code… and setting the padding to be negative…
<mx:HBox>
xmlns:mx="http://www.adobe.com/2006/mxml"
paddingTop="-3"
paddingBottom="-3"
>

doing this makes me feel like i’m back doing css again with html hacks… but this is a simple way of accomplishing making the rows smaller in the  <mx:List> tag… one important side note is:

DON’T FORGET TO SET THE rowHeight=”14″ so it’s actually smaller… please view the source to check it out… it looks something like the following:

<mx:List>
dataProvider =”{acData}”
width =”100%”
height =”100%”
rowHeight =”14″
itemRenderer =”SmallListRenderer”
>

this didnt take long, but took a little trickery to get what i wanted

Application - Source

So, I was talking with my pal John Wilker (one of the two masterminds behind 360flex conferences) and I was bitching to him saying that it’s gay when you have to debug mouse move events in flex, because you want to know what the mouse is at a certain point in the app, like dragging on something…

but it’s not like you can stop dragging on something put a debug point in your app, and then go back and drag again, because more than likely your going to then hit debuging before your mouse is where you want!!!! this makes me so angry, so i wrote a solution, but even then the solution sucks, because it’s just too much code, even though it’s only a couple functions, you just shouldn’t have to do that…

THE FIX THAT I PROPOSE

what if you could set up some kind of hot key in flex builder that when you were running the application, it skipped breakpoints? and when released it then picked up your breakpoints… so say your debug/run the app, then you go click on a list, drag it over to a tree, and you want to know what node your over, you have a debug point in the mouseMove function or whatever, and you all the while you are holding “d” on the keyboard, or something like that, and when you let up, it then hits the breakpoints like it should…

i dunno if that would even work because eclipse wouldnt have focus, so maybe thats a dumb idea that would go nowhere, but dammit, it’s bullshit!

sorry just frustrated…

360flex is an absolute blast, it’s great company, full of intelligent people, and I couldn’t ask for more of a conference to go to. If your a flash/flex developer, and or want to get in to flex, this is the conference for you.

Thanks to everyone that attended my session this morning it was great! and it was great to be in a room with such knowledgeable people. Everything went fantastic. Here is my presentation zip file.

360flex Preso

We are wrapping up with this great charting application at cfwebtools, and we get a call from a customer that says our data is wrong….

We listen to them, and debug, and for some reason we just can’t quite see the same thing he see’s… On top of that, no one else is having the problem, but the fact is that, he has showed us screen shots, he’s duplicated on Four pc’s of his own, and he’s talked to 10 friends telling us that our data is wrong, and that there is mismatched days in our chart.

The problem:

When he was bringing up the charting application, the charts showed up successfully, but when you ta
ke a closer look, and you know your stuff about Financial Charting applications, you know what your looking for, and you know it with GREAT detail. So this guy, tells us our data is wrong, and pretty much with all of his friends proved to us SOMETHING was going wrong, but we couldn’t duplicate it.We tried trapping the data he was requesting when the request came in, we tried trapping it right before it went out… then we were using Kevin Langdon’s Service Capture to introspect the data that was coming in to flex.

The data is not that complicated, it looks like this:

Date: 2/20/08

Close: 31.53

Open: 30.61

Date: 2/19/08

Close: 30.93

Open: 30.94

but on his computer it looked like this:

Date: 2/19/08

Close: 31.53

Open: 30.61

Date: 2/18/08

Close: 30.93

Open: 30.94

EVERYTHING WAS SLID BACK BY ONE DAY.

the Date/Time objects were coming back from coldfusion, and it was returning coldfusion sql. They looked like this:
‘2/20/08 00:00:00′

‘2/19/08 00:00:00′

‘2/18/08 00:00:00′

what was really happening is that, flash auto adjusts for your Timezone… so what was really happening is the data is getting turned into this in flash (if they come back to flash as date/time objects)

Pacific Standard Time

‘2/19/08 22:00:00′

‘2/18/08 22:00:00′

‘2/17/08 22:00:00′

I’m sort of at a loss and i’m looking for help, there is one post that was more clear than the rest, but still doesnt solve my issue, it’s written by Ted Patrick of adobe. He states to use Universal Time, (UTC).

I have a problem with this!

I’m not the one creating the date times, nor do I get a chance to touch the data before it goes to my components… Of course I could obviously go in, to my result function of my remote object, or my command of cairngorm, and loop over the data, and adjust it all manually… BUT NOOOOO, I Don’t want to, what if i’m dealing with 40,000 records in a charting application (how bout we make it an even MILLION records, just to prove a point), then obviously the flash player has enough work to do on it’s own, without me looping through the data.

How do I query my database, and have it be a 00:00:00 time, and not have flash offset my date when it comes back to it?

For now, we manually change things in our query to add hours to the date time, but that is kind of sloppy…

Please check the example, and help me out if you can… Like I said I’m at a loss with this one.

Application - Source

Lately I’ve been super busy, I’ve been getting some good hours for side work, and have been working on this really awesome charting application it’s not customizable to the extent of StockFetcher, but it’s cool in it’s own right.

Everything is driven and built dynamically based off of an xml file. The cool part of the app, is that in the xml I can specify the timeline I want to show, and customize all of these things called studies. Studies are calculations like On Balance Volume, Moving Average, and Double Smooth Stochastics. I have no clue what any of those things mean to a financial stock person, but looking at these graphs means something… pretty much whether or not to buy or sell stocks is what i presume.

Java, Coldfusion, and Flex marriage

We are using a customized java library for the calculations, and that helped out a lot. So we are leveraging three technologies here, Java, Coldfusion, Flex. It’s a great combonation, we’re not accessing any java directly with flex, but through coldfusion we are instantiating java objects in order to complete the calculations.

The Slider issue

FlexLib has a great slider class that I believe Doug Mccune is responsible for. It’s great because it adds the thumbskin and allows you to drage the area in between the thumbs.

The issues I needed to solve with the slider

• The slider had to be able to be dragged when clicked on
  • accomplished with the flexlib slider

• Things that weren’t possible yet
  • When clicking in the track the whole slider had to move
    • IT ALSO HAD TO MOVE BY WHATEVER AMOUNT IT WAS SHOWING!
    • so that means if the slider’s two thumbs were 60 datapoints apart, it would have to move 60 points to the left when the track was clicked on, or 60 points to the right when the track was clicked on
  • MY BIG BEEF
    • my beef with this was that, there really arent any events dispatched when you click on the track… it’s a private method that handles the animation and tweening of the slider to go to where ever it is on the track that you clicked…
    • I didn’t like that at all, but I didn’t have time to fix it either.
  • When you click and drag the slider (not the thumb, but the in between the thumbs) and you drag to the end of the track, the region that is locked shrinks or expands when you go out of it’s bounds…
    • that we couldn’t

My Solution

• I added the following attributes to the SliderBase
  • lockRegionsOnTrackClick=”true”
    • this solved the first issue stated above…. how the sliders had to move as a whole
      • this was a little complicated simply because if there were multiple sliders you have to loop through them and change all of them by the proper amount.
  • lockRegionsWhileDragging=”true”
    • this solved the last issue where the slider was changing sizes if your mouse was either too far to the left of the track, or to the right of the track.
  • moveByCurrentSpan=”true”
    • this solved my issue of needing the sliders to move by whatever the current difference of the first and last thumbs were.
      • again the challenge with this one, is you had to move the inner thumbs by the correct amount either to the right or left.

so now you have the new slider
<flexlib:hslider snapinterval="1" maximum="9000" minimum="-9000" values="[-2000, 4000]" width="200" thumbcount="2" showtrackhighlight="true" datatipoffset="3" datatipplacement="bottom" showdatatip="true" livedragging="true" movebycurrentspan="true" lockregionswhiledragging="true" lockregionsontrackclick="true" allowthumboverlap="true" allowtrackclick="true" trackhighlightskin="flexlib.skins.SliderThumbHighlightSkin"> </flexlib:hslider>

Please check out the source and feel free to comment.

Please note these are just the same links as the ones that were at the top, they were just put here for convenience.
Application - Source

and thought it might come in useful at a later date… then I could have eclipse, cfeclipse and flex builder back together like I used to….

http://www.eclipsezone.com/articles/howto-flexbuilder2/

Making Flex LOOK 3D!!!

Just to state, this in no way talks about papervision3d.

I was asked to put a bid out for a project that required walking through a 3D house, and I thought to myself… “Flash vs. Flex” granted either one, could make it happen… I didn’t want to over complicate it and think i would have to draw everything myself in flex so I started to think about it, and look at more examples…

Mixing swf files with swf loader

I’m simply using mx:SWFLoader to load the swfs and adding them to a container and removing them whenever i need to. The simplest way to do so is to use a ViewStack. When i tried the viewstack it was removing the child when changing the index which is one of the things i knew it would do, but wanted to test to see how flickery the result would be…

It indeed was too “flickery” so i chose to just add the children myself and go about doing things more manually…

PLEASE NOTE: it still is a bit flickery, but i can only test outside my network so it seems to be a bit odd… i’ve decided not to really fix it… because i just don’t have the time… kinda sucks being soooo busy… but all in all its still a good day

I have a blog post “Drawing with the UIComponent” that I talk about drawing with the UIComponent… I’m using the same classes in the source here, and i’m just using it to draw the rectangle around the drawn guys hand in the swf… I was too lazy to write new classes because it’s getting to be about 3am… and I’m tired…

I’ve had to save my blog posts for all wee hours of the night… I’ve been so busy with business I haven’t had time to write.

Anyway… the project entailed walking through a 3d house of sorts and clicking on different products and having it seem like it is animated through the shots… so if you’ve got an animation rockstar that can make things like the dlink media lounge this should give you some type of an idea of how they accomplish the task… they obviously put 2 billion times more flair into it, and ton more time as well (this only took a little over an hour to throw together) but, none the less this does show how you would make something “APPEAR” as 3D but not having to be 3D.

Hope you all enjoy, and hopefully I will have some more time to write in the upcoming future…

Oh yeah, Hope to see EVERYONE at 360Flex in Atlanta

Application - Source

http://fleksray.org/adobe_flex_components_en.html

Our XML MP3 Player is even on this link! woot!

http://flex.org/components/

I’ve always had the urge to sit down and come up with a way to do a family tree, and have images of my family and what not, and map them to each other, that way i don’t have such a hard time remembering distant relatives names at those big family reunions…

So I wanted images that drew a line to one another in a tree type structure, but wanted to to be dragable and what not… and andrew released the source for his relationship mapper, and I couldn’t thank him enough…

Relationship Mapper Application - Relationship Mapper Source

Also does a drawing canvas much similar to my drawing blog post Drawing with the UIComponent in Flex (part 3) Application - Drawing with the UIComponent in Flex (part 3) Source

Paint Canvas Application

Paint Canvas Source

Application - Source

This upgrade added more white board like enhancement, now you can highlight a tool that is on the wrapper, after you have drawn it, and press delete on your keyboard to delete it, you can also drag and move the drawings…

Application - Source

http://www.brightworks.com/technology/adobe_flex/testing_debugging_agile_methods.html

Joe Rineharts entry/tutorial on CF and FlexUnit
http://www.firemoss.com/blog/index.cfm?mode=entry&entry=658DF66B-3048-55C9-43662A44BE6E39A9

Flex Unit w/ cairngorm
http://jharbs.com/blog/?p=96

//create connection

var myService:mx.remoting.NetServiceProxy;

//make an object that will handle the response

myService.getDate(mask.text);


this code is great… you set up a service (called myService in this example, it’s calling a cfc called ‘flashRemotingResponder’)

When flex2 came out, and all of the examples starting coming out with it, and how to use it with ColdFusion, there were a lot of remoting examples using mx:RemoteObject… something like the following<mx:RemoteObject source="com.SomeCFC" destination="ColdFusion" result="someResultHandler(event)" fault="someFaultHandler(event)"/>

This is just psuedo code, so don’t copy and paste it… but I myself got caught up in this… we’ve recently been trying to hire another flex developer… we’ve got projects to do, and so we’re considering doing some contracting, but the problem is, we need someone that knows coldfusion and flex, and that seems to be a Hot combo right now, and most of the developers that know both of those things well are getting paid fairly well, and full of work… the point is, you can still use the RemoteObject tag to call cfc’s remotely, and call services like you used to be able to in flashremoting. you use the ‘endpoint’ attribute in remoteObject.

<mx:RemoteObject id="remoteService"
source="com.test"
destination="ColdFusion" endpoint="http://127.0.0.1:8500/flex2gateway/"
result="onResult(event)"
fault="onFault(event)"/>

You use the source like you would as if the objects are local to the webroot, and use the endpoint to specify a remote domain. This may be common knowledge to everyone out there, but I simply just forgot about even trying it… I got so caught up with having coldfusion locally installed, and working with the cfc’s myself, I simply got close minded about it…

anyway, check out the post about it at the following link, it’s where I got my answer.
http://www.flashcomguru.com/index.cfm/2006/11/11/flex2remoting

http://lab.orangeflash.eu/flex2/examples/modules/

My friend is over here, and he’s the one that wanted me to watch lost, and so we’ve spent the weekend catching me up on Lost because he raves about how good it is… that way when this season starts i can be caught up, and we can hang out and watch it… (people might think i’m gay, but when your not married and don’t have kids, you seriously value friendship and family over anything…)

Anyway… this friend is also way into world of warcraft, and he brought his headset with him (so he could use teamspeak) to go on some raid with this group he’s in on wow… (wow: means world of warcraft) that way he could still hangout while he plays the game…

NOTE: From what my friend was saying… raids take about an hour…Anyway… he just took a break, and said that someone in his group was in another raid, with another group… and in this other group there was a girl that was in the group…. this whole story pretty much revolves around this girl….

This girl was nine months pregnant, and while on the raid, she went into labor… I’m not sure about anyone else… I don’t know much about pregnancy… but out of common sense, I would think, just from watching movies and what not… there would be a water breaking here soon… or something along those lines?

Before going to the hospital, this girl finished playing her raid before going to the hospital… i just find it hilarious that this woman finished playing her game before going to the hospital… i don’t know if she had the baby, and if all went well, i sure hope it did, but i’m all for the fun video games, and i’m sure glad that a video game can bring so many MILLION (last i heard there were like 7 million people with accounts granted not all of them play at one given time) people together… but this game must be addicting… people i know talk about it all the time… how wow is taking over their lives and what not… i watch my room mate play it like 50 hours a week (he’s unemployed at the moment) I just figure he’s played the game for months… my other friend has played for way over a year… my nephew was addicted for over a year… my other friend is also addicted… and has been playing for like two years…

I have over 5 friends that have been taken in by this game… and by taken in, I mean, it has taken over their lives… some still can function (hold a job) while playing it… (by playing i mean not just one session…) others can not, my nephew kicked it, and when he talked about how he doesn’t play it anymore, he talks about it, like he kicked drugs or something… my other friend quit playing it because it interfered with college… (after letting it take his life over for over four months)

I just think this game is hilarious… but the woman in labor and having to finish the raid before going to the hospital by far tops it all off…

One of the points of debugging is to make your life easier…

Have you ever tried to debug the dragOver event on any ListBase Component? It’s a little hard to do… simply because it fires whenever your dragging over anything… whether your just starting to drag, or your over the item you wish to debug. You know… it’s like when your dragging over the item you wish to debug, you want to pause everything, then go over to flex builder, and add a breakpoint, then continue on with dragging over wherever it was when you paused everything….

You may not know what I mean if you haven’t really dealt with a whole lot of drag and drop…

One solution I’ve caught myself doing that has worked out fairly well for me is place a textarea on the screen somewhere, and adding a chunk of code to the dragOver() method i’m calling to just my variables in this text area so I can see them change as I drag over things. The code may look somewhat like this.

tattlerStr = "Selected Item: " + selectedNode + "\n" + "Over Target: " + hoverTarget.level
+ "\n"
+ "calculateDropIndex " + rowIndex
+ "\n"
+ "halfRow " + halfRow.toString()
+ "\n"
+ "certerRowY " + certerRowY.toString()
+ "\n"
+ "bottomRowY " + bottomRowY.toString()
+ "\n"
+ "mouseY " + currTree.mouseY.toString()
+ "\n"
+ "isItemOpen " + currTree.isItemOpen(currNodeOver).toString()
+ "\n"
+ "isDebugMode " + currTree.isItemOpen(currNodeOver).toString()
+ "\n" + "\n";

tattler.text = tattlerStr;

those variables are specific to my example, so don’t try copying and pasting that.

A Simple Solution - Add a Key Listener

This is not the most elegant solution, but might get you through a tough struggle… it’s nothing to leave in your production code… but when in need you can do this when strictly working on your drag and drop task…

1. use creationComplete to addEventListeners for keyUp, and KeyDown

   private function init():void{
addEventListener(KeyboardEvent.KEY_DOWN,onKeyDown);
addEventListener(KeyboardEvent.KEY_UP,onKeyUp);
}

2. create a bindable var and a static var for your debug status

   private function init():void{
addEventListener(KeyboardEvent.KEY_DOWN,onKeyDown);
addEventListener(KeyboardEvent.KEY_UP,onKeyUp);
}

   [Bindable] private var isDebugMode:Boolean = false;
private static var DEBUG:uint = 68; //68 is the d key on the keyboard

3. create your listeners

   /*********************listeners*********************/
private function onKeyDown(event:KeyboardEvent):void{
switch(event.keyCode){
case DEBUG:
isDebugMode = true;
//trace('keyDown');

   break;
   }
   }
   private function onKeyUp(event:KeyboardEvent):void{
   switch(event.keyCode){
   case DEBUG:
   isDebugMode = false;
   //trace('keyUp');

   break;
}
}

4. in your dragOver method that your calling create an if statement where you want to debug like this

   if (this.isDebugMode){
trace('put your debug point on this line')
tattler.text += '\n' + 'put your debug on this line';
}

5. in flexbuilder put a breakpoint on the trace line inside that if statment in the last step
6. now you should be able to drag whatever you like over the destination, and whenever you want to hit your breakpoint use your keyboard, and press ‘d’, you should then jump to flex builder to your breakpoint.

it’s not the most elegant solution, but it will work and get you to your debugger when you wish, while dragging and dropping.

Please refer to the link i’ve provided both at the top, and bottom to view the application, and to view the source as well… (I took the example from another blog post I had, so your going to see some code that might not be relevant to this, like the spring loaded folders, but it’s valuable as well)

APPLICATION - SOURCE

your going to need PHYSICAL access to the machine… so if your trying to break your servers at work, and you don’t have a key to the server room, your not gonna like this entry.

loginrecover.com offers free password recovery…

Recover password

i’ve only used the product with the floppy disk, and now-a-days some computers don’t have that, so i’m not real sure on how to go about it, but i’m sure the site has great instructionsstick the floppy in, it runs when you boot… (pending bios… make sure your floppy is set to boot first), when it runs it writes back to the floppy, and you then eject the disk and restart…

go to a different computer, and upload whatever was saved to the floppy to loginrecovery.com and they will send you the password in a few days… (there is a que of people waiting)… they do have a pay version, where you will get the password within an hour or something like that… it only costs like 12 bucks!!! it’s totally worth it.

I can’t really stress how cool this site is, and how it absolutely SAVES your butt, when in desperate need…

so this is why everyone should kinda lock up their machine right? as in, get a lock on your door to your office, and lock up… otherwise you risk giving away your password….

like i said, i haven’t tried this for a while… but someone called me and asked where they could do it, and i referred them to this… it’s a great site, and totally useful.

APPLICATION - SOURCE

In my last post I kind of talked about drawing a line in flex, (not just programmatically) but how to let the user draw the line… for example, in photoshop, you use the line tool to draw a straight line…

Create a simple whiteboard type application with flex and actionscript 3 extending the UIComponent

After making the example files, I realized I’m really not THAT far off of a somewhat white boarding application… granted mine doesn’t share the information, or save it anywhere, but the example just simply shows how to get it started…

Dynamically create classes

I added a DrawingToolManger class in this, I found out how to dynamically create classes… I opened up the code to the PopUpManager to get ideas for doing things, and thats where I started to look at the createPopUp function.

I decided a component like the PopUpManager was fairly complicated for the example I want to show… I don’t really care about the display list and grabbing child components right now (with say… a hand tool)… the example isn’t that far yet…

I need to be able to create any type of class, and add it to the display… my manager returns the new class, and then I can add it to the display…

the coolest part of this was finding out, by typing the class as a type:Class, i can then create a new instance of any class… say i pass a LineTool to my manager it would be something like this:

by calling className, i can then invoke the newClass, by ANY class I pass in, by calling the contructor newClass() (technically being resolved to LineTool() in this case! it’s sooo dynamic! it’s great!

You also can’t forget about the function flash.utils.getDefinitionByName(string:String):Object;

you can use that to invoke an object by passing it a string… like this:

var o:Object = flash.utils.getDefinitionByName(’com.acj.paperClasses.LineTool’):Object;

var d:DrawingTool = new o();

that will evaluate into d = (an instance of)com.acj.paperClasses.LineTool

it’s another way of doing things dynamically…

it’s not really ground breaking stuff… but hopefully someone gets something out of it…

(same links that were at the top, just here in case blog entry gets long)

APPLICATION - SOURCE

]]> http://www.axelscript.com/2008/06/12/drawing-in-flex-using-the-uicomponent-part-2-note-dynamic-classes-too/feed/ http://www.axelscript.com/2008/06/11/flex-explorers/ http://www.axelscript.com/2008/06/11/flex-explorers/#comments Wed, 11 Jun 2008 17:42:48 +0000 admin http://www.axelscript.com/?p=137 this is a link for a bunch of flex explorer links…

http://kanuwadhwa.wordpress.com/2007/08/07/flex-links/

target="_blank">http://www.franto.com/blog2/collected-links-to-actionscript-30-examples

APPLICATION - SOURCE

I was asked by a fellow coldfusion buddy if it was possible to take an image into flash, and be able to draw on it, i said absolutely…

They basically have a stock chart that they want to draw straight lines on… I don’t know much about charting or stock trading, but it’s what they wanted… the project never went through for this simple step, they took a great bid that we through out, and we’re going to do some full on flex charting for them…

my plan for the line tool was to just bring in the image, and said a UIComponent over it, and then they could draw on it… they said there was no purpose of saving the data… it was a strange thing….. but anyway… this is the starts of that project.

(note: these links are the sames as the ones at the top, they are just here in case the blog gets long)

APPLICATION - SOURCE

• First download LCDS Express (free for one cpu)
• Video on LCDS ES
• Learn how to integrate LCDS with coldfusion 8 - the instructions on this page are really confusing and they are a bitch… i woulda thought some kind of update would have been made to make it a little easier and less confusing
  
• Make the mistake of following the first link like i did when i started googling stuff, here is the lcds 2.6 beta along with the cf 8 compiler module, but again, i’m not even sure what i need that for yet…
• Here is how to integrate cf8 with BlazeDS as well
• Take a look at an example coldfusion flex app from joao onflexwithcf

I think with all of the manual adjustments of all of the xml config files, it’s a pain in the ass, and a bit confusing… it reminds me of flex 1.5 and the feeling i got when going through all of the intall stuff with that… it was like… do i really have to do all this just to try and learn it… ? i mean this isn’t even using the language, or the feature of the program, this is simply trying to get it up and running… and when you stumble on the setup and it doesn’t work, you tend to steer away to something that you do get… for me when flex 1.5 was out, i focused on coldfusion, and building my skills in that… but when flex 2 came out, it was much more simplified… and you no longer needed the server, and i jumped on full force…

so to me l think lcds has some ways to go… maybe an air app to adjust all of the xml files for you? how bout that one adobe? where you at?

anyway, i eventually got it all up and running and it went very smoothly, it was just scary copying and pasting all of these files, and backing them up manually…

anyway hopefully some of these links will help someone.