<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Gordon&#039;s Blog &#187; bug</title>
	<atom:link href="http://www.hempton.com/tag/bug/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.hempton.com</link>
	<description>Thoughts and rants from a Seattle entrepreneur.</description>
	<lastBuildDate>Tue, 27 Jul 2010 19:56:41 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Two Nasty Flex Bugs to Watch Out For</title>
		<link>http://www.hempton.com/2008/11/two-nasty-flex-bugs-to-watch-out-for/</link>
		<comments>http://www.hempton.com/2008/11/two-nasty-flex-bugs-to-watch-out-for/#comments</comments>
		<pubDate>Wed, 05 Nov 2008 21:52:54 +0000</pubDate>
		<dc:creator>gordon</dc:creator>
				<category><![CDATA[flex]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[module]]></category>
		<category><![CDATA[tween]]></category>

		<guid isPermaLink="false">http://blog.hempton.com/?p=36</guid>
		<description><![CDATA[I ran across several bugsfeatures today that I thought would be worthwhile to share. These are of the variety that take a while to figure out and are not very intuitive. Both were encountered using Flex 3.1 Modules Loading Events Never Fire This one I encountered while manually loading modules using the ModuleManager. Apparently the [...]]]></description>
			<content:encoded><![CDATA[<p>I ran across several <strike>bugs</strike>features today that I thought would be worthwhile to share. These are of the variety that take a while to figure out and are not very intuitive. Both were encountered using Flex 3.1</p>
<h4>Modules Loading Events Never Fire</h4>
<p>This one I encountered while manually loading modules using the ModuleManager. Apparently the ModuleManager maintains nothing but weak references to the IModuleInfo object returned using getModule. If you do not maintain a reference to the IModuleInfo object, the object can potentially be garbage collected and any event handlers you added to it will be lost. For instance, the following example will not work as expected:</p>


<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> initApp<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">var</span> info:IModuleInfo = ModuleManager.<span style="color: #006600;">getModule</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;ColumnChartModule.swf&quot;</span><span style="color: #66cc66;">&#41;</span>;
	info.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>ModuleEvent.<span style="color: #006600;">READY</span>, modEventHandler<span style="color: #66cc66;">&#41;</span>;
&nbsp;
	info.<span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> modEventHandler<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:ModuleEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
	container.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>.<span style="color: #006600;">module</span>.<span style="color: #006600;">factory</span>.<span style="color: #006600;">create</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> as ColumnChartModule<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>



<p>In the above example, the IModuleInfo instance will be garbage collected before the modEventHandler method is called. Instead, the above example should be changed to the following:</p>


<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">var</span> info:IModuleInfo;
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> initApp<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
    info = ModuleManager.<span style="color: #006600;">getModule</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;ColumnChartModule.swf&quot;</span><span style="color: #66cc66;">&#41;</span>;
    info.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>ModuleEvent.<span style="color: #006600;">READY</span>, modEventHandler<span style="color: #66cc66;">&#41;</span>;
&nbsp;
    info.<span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> modEventHandler<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:ModuleEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
    container.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>info.<span style="color: #006600;">factory</span>.<span style="color: #006600;">create</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> as ColumnChartModule<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>



<p>This was actually <a href="http://bugs.adobe.com/jira/browse/SDK-14021" onclick="pageTracker._trackPageview('/outgoing/bugs.adobe.com/jira/browse/SDK-14021?referer=');">filed as a bug against flex</a>, but was closed as &#8220;Not a bug&#8221;, despite the fact that it is a regression from Flex 2.</p>
<h4>Tweens Mysteriously Stop and Never Finish</h4>
<p>A common pattern when using tweens is the following:</p>


<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> _tween:Tween;
&nbsp;
<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> eventHandler<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span>_tween<span style="color: #66cc66;">&#41;</span>
	<span style="color: #66cc66;">&#123;</span>
		_tween.<span style="color: #0066CC;">stop</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	<span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #808080; font-style: italic;">// do something and possibly return</span>
&nbsp;
	_tween = <span style="color: #000000; font-weight: bold;">new</span> Tween<span style="color: #66cc66;">&#40;</span>...<span style="color: #66cc66;">&#41;</span>;
	_tween.<span style="color: #006600;">setTweenHandlers</span><span style="color: #66cc66;">&#40;</span>updateHandler, updateHandler<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> updateHandler<span style="color: #66cc66;">&#40;</span>c:<span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #808080; font-style: italic;">// update something</span>
<span style="color: #66cc66;">&#125;</span></pre></div></div>



<p>However, when dealing with complex user interfaces that use the above pattern in multiple places simultaneously, I noticed that some Tween instances will stop and never finish, ostensibly at random times. After examining the Flex internal code, I discovered that the logic which manages the Tween objects and invokes their handlers re-uses tween identifiers. Thus, if a Tween has had its stop() method called, its identifier will be reused by future Tween objects. Moreover, if you call the stop() method on a Tween after it has already been stopped, if there is a new Tween which took the identifier of the already stopped Tween, this new Tween will also be stopped by the second stop call.</p>
<p> This fix for this is rigorously make sure that all stop() method calls are called only once, or not at all if the Tween has stopped because it has ended. The above code should be changed to:</p>


<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> _tween:Tween;
&nbsp;
<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> eventHandler<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span>_tween<span style="color: #66cc66;">&#41;</span>
	<span style="color: #66cc66;">&#123;</span>
		_tween.<span style="color: #0066CC;">stop</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		_tween = <span style="color: #000000; font-weight: bold;">null</span>;
	<span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #808080; font-style: italic;">// do something and possibly return</span>
&nbsp;
	_tween = <span style="color: #000000; font-weight: bold;">new</span> Tween<span style="color: #66cc66;">&#40;</span>...<span style="color: #66cc66;">&#41;</span>;
	_tween.<span style="color: #006600;">setTweenHandlers</span><span style="color: #66cc66;">&#40;</span>updateHandler, finishHandler<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> updateHandler<span style="color: #66cc66;">&#40;</span>c:<span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #808080; font-style: italic;">// update something</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> finishHandler<span style="color: #66cc66;">&#40;</span>c:<span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	updateHandler<span style="color: #66cc66;">&#40;</span>c<span style="color: #66cc66;">&#41;</span>;
	_tween = <span style="color: #000000; font-weight: bold;">null</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>


]]></content:encoded>
			<wfw:commentRss>http://www.hempton.com/2008/11/two-nasty-flex-bugs-to-watch-out-for/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
		<item>
		<title>Flex ScrollPolicy.AUTO Not Good Enough</title>
		<link>http://www.hempton.com/2008/05/flex-scrollpolicyauto-not-good-enough/</link>
		<comments>http://www.hempton.com/2008/05/flex-scrollpolicyauto-not-good-enough/#comments</comments>
		<pubDate>Fri, 23 May 2008 23:26:33 +0000</pubDate>
		<dc:creator>gordon</dc:creator>
				<category><![CDATA[flex]]></category>
		<category><![CDATA[rants]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[ui]]></category>

		<guid isPermaLink="false">http://64.13.249.118/wordpress/?p=3</guid>
		<description><![CDATA[One of my biggest gripes so far with the flex scrolling system is the automatic scrolling policy: a container’s viewing area is not changed by the introduction of scroll bars. This is especially troublesome in the vertical case and seems to be a pretty shitty way of doing things in general. For example, if the [...]]]></description>
			<content:encoded><![CDATA[<div class="main">
<div class="snap_preview">

One of my biggest gripes so far with the flex scrolling system is the automatic scrolling policy: a container’s viewing area is not changed by the introduction of scroll bars. This is especially troublesome in the vertical case and seems to be a pretty shitty way of doing things in general. For example, if the vertical size of the children increases beyond the height of their container, a vertical scroll bar will be created and displayed, however the children will not be resized. Consequently, if some of the children have variable widths (e.g. width=”100%”), they may be overlapped by the vertical scroll bar, causing a horizontal scroll bar to be displayed. When the scrolling policy is set to ScrollPolicy.ON, however, the children are resized to take the scroll bar into account at the price of the scroll bar always displaying, even when it is not needed. Yuck.

I have heard several justifications for this. One is that it prevents a cascading resize effect where all the descendants of the container are resized, each one introducing a vertical scroll bar. Another is that it is faster due to the fact that it requires only a single pass on the children, whereas to do it the correct way would require sizing the children, checking if scroll bars are required, and then adjusting the size of the children based on the new size when scroll bars are introduced. In both cases the justification is entirely dwarfed by the current behavior.

Fortunately there is a fix for this: create a custom container and add the following override for the validateDisplayList method:


<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">import</span> mx.<span style="color: #006600;">core</span>.<span style="color: #006600;">ScrollPolicy</span>;
<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> validateDisplayList<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
    <span style="color: #0066CC;">super</span>.<span style="color: #006600;">validateDisplayList</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
    <span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">null</span> <span style="color: #66cc66;">!</span>= verticalScrollBar <span style="color: #66cc66;">&amp;</span>amp;<span style="color: #66cc66;">&amp;</span>amp; verticalScrollBar.<span style="color: #006600;">maxScrollPosition</span> == <span style="color: #cc66cc;">0</span>
        <span style="color: #66cc66;">&amp;&amp;</span> verticalScrollPolicy <span style="color: #66cc66;">!</span>= ScrollPolicy.<span style="color: #006600;">AUTO</span><span style="color: #66cc66;">&#41;</span>
    <span style="color: #66cc66;">&#123;</span>
        verticalScrollPolicy = ScrollPolicy.<span style="color: #006600;">AUTO</span>;
    <span style="color: #66cc66;">&#125;</span>
&nbsp;
    <span style="color: #b1b100;">else</span> <span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">null</span> <span style="color: #66cc66;">!</span>= verticalScrollBar<span style="color: #66cc66;">&#41;</span>
    <span style="color: #66cc66;">&#123;</span>
        verticalScrollPolicy = ScrollPolicy.<span style="color: #0066CC;">ON</span>;
    <span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></div></div>



This is a hack which toggles between ScrollPolicy.AUTO and ScrollPolicy.ON as needed to gain the desired behavior. It comes at the price of invalidating the verticalScrollPolicy property. Hopefully this behavior will be more tightly integrated into future versions of Flex (maybe another ScrollPolicy is in order?).

</div>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.hempton.com/2008/05/flex-scrollpolicyauto-not-good-enough/feed/</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
	</channel>
</rss>
