<?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>Lavjaveler Labs &#187; actionscript</title>
	<atom:link href="http://labs.lavjaveler.com/?cat=6&#038;feed=rss2" rel="self" type="application/rss+xml" />
	<link>http://labs.lavjaveler.com</link>
	<description>The Lavjavaler Blog</description>
	<lastBuildDate>Wed, 26 Jan 2011 22:16:20 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>Inheritence and variables in Actionscript 3.0</title>
		<link>http://labs.lavjaveler.com/?p=6</link>
		<comments>http://labs.lavjaveler.com/?p=6#comments</comments>
		<pubDate>Thu, 24 Jul 2008 14:20:19 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[actionscript]]></category>

		<guid isPermaLink="false">http://labs.lavjaveler.com/?p=6</guid>
		<description><![CDATA[I am working on a lot of framework type stuff right now and ran into an interesting...I don't want to say "problem." Let's say "hurdle." I had worked out a base class for scrollbars (screw the AS 3.0 component library) and wanted to keep my base class light and fast. Seriously, stay light and fast [...]]]></description>
			<content:encoded><![CDATA[<p>I am working on a lot of framework type stuff right now and ran into an interesting...I don't want to say "problem."  Let's say "hurdle."  I had worked out a base class for scrollbars (screw the AS 3.0 component library) and wanted to keep my base class light and fast.  Seriously, stay light and fast with your framework components.  If you want to write a framework where the base classes can compete in the Olympics - don't bother.  Just use Flex.  But if you want light and fast - write it yourself and be smart.</p>
<p>Anyway, the idea was to keep the base classes really light but easy to extend.  In the case of scrollBars, the functionality is not changing for any subclass - just the skins and the animation.  I love the protected attribute for properties and methods in base classes.  Your subclasses will be able to access anything and override what needs to be overridden.  I simplified version of the base class is below. </p>
<pre class="actionscript">package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> ScrollBar <span style="color: #0066CC;">extends</span> <span style="color: #0066CC;">MovieClip</span>
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> ScrollBar<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">super</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
			createChildren<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
			addChild<span style="color: #66cc66;">&#40;</span> scrollTrack <span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span> scrollArrow1 <span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span> scrollArrow2 <span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span> scrollThumb <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//  Properties</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
&nbsp;
		protected <span style="color: #000000; font-weight: bold;">var</span> scrollArrow1 : ScrollArrow;
		protected <span style="color: #000000; font-weight: bold;">var</span> scrollArrow2 : ScrollArrow;
		protected <span style="color: #000000; font-weight: bold;">var</span> scrollThumb : ScrollThumb;
		protected <span style="color: #000000; font-weight: bold;">var</span> scrollTrack : ScrollTrack;
&nbsp;
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//  Methods</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
		<span style="color: #808080; font-style: italic;">//  createChildren</span>
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 *  @protected
		 *  Creates the default children of the ScrollBar.  Meant to be overridden when
		 *  the scrollBar has been reskinned.
		 */</span>
		protected <span style="color: #000000; font-weight: bold;">function</span> createChildren <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: #808080; font-style: italic;">// up arrow</span>
			scrollArrow1 = <span style="color: #000000; font-weight: bold;">new</span> ScrollArrow<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #808080; font-style: italic;">// down arrow</span>
			scrollArrow2 = <span style="color: #000000; font-weight: bold;">new</span> ScrollArrow<span style="color: #66cc66;">&#40;</span> ScrollArrow.<span style="color: #0066CC;">DOWN</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #808080; font-style: italic;">// scroll track</span>
			scrollTrack = <span style="color: #000000; font-weight: bold;">new</span> ScrollTrack<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #808080; font-style: italic;">// scroll thumb</span>
			scrollThumb = <span style="color: #000000; font-weight: bold;">new</span> ScrollThumb<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre>
<p>The hurdle came up when I tried to override a protected variable in a subclass.  it would be great to just say: </p>
<pre class="actionscript">package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> CoolerScrollBar <span style="color: #0066CC;">extends</span> ScrollBar
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> CoolerScrollBar <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">super</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;">//--------------------------------------------------------------------------</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//  Properties</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
&nbsp;
		override protected <span style="color: #000000; font-weight: bold;">var</span> scrollArrow1 : CoolerScrollArrow;
		override protected <span style="color: #000000; font-weight: bold;">var</span> scrollArrow2 : CoolerScrollArrow;
		override protected <span style="color: #000000; font-weight: bold;">var</span> scrollThumb : CoolerScrollThumb;
		override protected <span style="color: #000000; font-weight: bold;">var</span> scrollTrack : CoolerScrollTrack;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;</pre>
<p>This is NOT allowed.  In Actiosncript 2, we could override whatever we wanted - just redeclare the variable and it would take over whatever you were overriding.  AS 3 gives us an "incompatible override" compiler error.  Initially I found this frustrating - I did not want to take the time to cast all these variables and I didn't want to clog up a base class and sub classes with extra methods.  The solution to this is easier than all of that pain and makes sense when you think about.  The code:</p>
<pre class="actionscript">&nbsp;
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> CoolerScrollBar <span style="color: #0066CC;">extends</span> ScrollBar
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> ScrollBar<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">super</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
			createChildren<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
			addChild<span style="color: #66cc66;">&#40;</span> scrollTrack <span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span> scrollArrow1 <span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span> scrollArrow2 <span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span> scrollThumb <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//  Methods</span>
		<span style="color: #808080; font-style: italic;">//</span>
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
		<span style="color: #808080; font-style: italic;">//  createChildren</span>
		<span style="color: #808080; font-style: italic;">//--------------------------------------------------------------------------</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 *  overridden
		 */</span>
		override protected <span style="color: #000000; font-weight: bold;">function</span> createChildren <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: #808080; font-style: italic;">// up arrow</span>
			scrollArrow1 = <span style="color: #000000; font-weight: bold;">new</span> CoolerScrollArrow<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #808080; font-style: italic;">// down arrow</span>
			scrollArrow2 = <span style="color: #000000; font-weight: bold;">new</span> CoolerScrollArrow<span style="color: #66cc66;">&#40;</span> ScrollArrow.<span style="color: #0066CC;">DOWN</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #808080; font-style: italic;">// scroll track</span>
			scrollTrack = <span style="color: #000000; font-weight: bold;">new</span> CoolerScrollTrack<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #808080; font-style: italic;">// scroll thumb</span>
			scrollThumb = <span style="color: #000000; font-weight: bold;">new</span> CoolerScrollThumb<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;</pre>
<p>This code works as long as the CoolerScrollArrow is a subclass of ScrollArrow.  It is just that simple (and you can see why having methods like createChildren are great for base classes - so handy when extending later on).  </p>
<p>Why do I find this better than the days of Actionscript 2?  Well, the compiler can still police us a bit.  If you try to assign say, BlueButton to one of those variables, and BlueButton only extends Sprite and not ScrollArrow - you get an error right in FTD and can't even compile ("You cannot assign 'BlueButton' to an 'ScrollArrow'...").  If we could override anything we want, we would probably break our base class quickly by changing something to a data type where key properties and methods don't exist.</p>
]]></content:encoded>
			<wfw:commentRss>http://labs.lavjaveler.com/?feed=rss2&#038;p=6</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
