ActionScript 3.0 :: Flex - Complexity Of ItemRenderers In Lists

I'm building fairly simple item renderers, in fact, here's the code for one of them...

Code:
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
implements="mx.controls.listClasses.IListItemRenderer"

[Code].....

It's a really simple renderer that has an image and some text sitting next to it, or just the text if no image is in that item's data provider. There is also some basic rollover, rollout and click functionality...

So my question: Why is it that if my list needs to scroll it gets messed up? By "messed up" I mean that the text changes from being to the right of the image (when image is present) to moving over top of the image, as if it isn't realizing that the image is there. There's also sometimes an issue of the item renderer shrinking down so there is no longer anything even visible in the box (just some black with a grey border on the bottom about 5 - 10 pixels big...

I'm wondering if maybe my item renderer is too complex? I'm having the same issue with text working like that in another renderer, but no images, just text placed in certain positions (as well as some strage blue tints showing up at the top or bottom depending on how I am scrolling)

By the way... here is the MXML where I am initializing my list...

Code:
<mx:Canvas width="100%" height="100%" id="list">
<mx:List
width="100%"

[Code].....