<?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>Random Fractals&#187; video</title>
	<atom:link href="http://randomfractals.com/blog/category/video/feed/" rel="self" type="application/rss+xml" />
	<link>http://randomfractals.com/blog</link>
	<description></description>
	<lastBuildDate>Sat, 27 Mar 2010 13:57:26 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=abc</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Simple Flex Video Player</title>
		<link>http://randomfractals.com/blog/2009/01/16/simple-flex-video-player/</link>
		<comments>http://randomfractals.com/blog/2009/01/16/simple-flex-video-player/#comments</comments>
		<pubDate>Fri, 16 Jan 2009 22:12:08 +0000</pubDate>
		<dc:creator>Taras</dc:creator>
				<category><![CDATA[Flex]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[flex animation effects]]></category>
		<category><![CDATA[flex video player]]></category>
		<category><![CDATA[player ui skins]]></category>

		<guid isPermaLink="false">http://tarasnovak.com/blog/?p=567</guid>
		<description><![CDATA[Since I am on the media playa&#8217; streak this week, I figured I might as well clean up and publish my Simple Flex Video Player.
It&#8217;s been sitting in my lab for a few months now (Hint: check out my right side bar links). I just did not have the time lately to polish and publish [...]]]></description>
			<content:encoded><![CDATA[<p>Since I am on the media playa&#8217; streak this week, I figured I might as well clean up and publish my <a href="http://www.tarasnovak.com/lab/SimpleVideoPlayer/SimpleVideoPlayer.html">Simple Flex Video Player</a>.</p>
<p>It&#8217;s been sitting in my lab for a few months now (Hint: check out my right side bar links). I just did not have the time lately to polish and publish it.</p>
<p>This <a href="http://www.tarasnovak.com/lab/SimpleVideoPlayer/srcview/index.html " target="_blank">Video Player Flex component</a> has similar look and feel of my <a href="http://www.tarasnovak.com/lab/FlexMusicPlayer/FlexMusicPlayer.html">Flex Music player</a> and wraps the VideoDisplay control with some video resize and skinning options.</p>
<p>Here is a sample &#8220;<a title="&quot;Little Toy Gun&quot; on YouTube" href="http://www.youtube.com/watch?v=PtQw94OpNKw" target="_blank">Little Toy Gun</a>&#8221; video by <a href="http://www.honeyhoneymusic.com/honeyhoney/honeyhoney_home.html" target="_blank">Honey Honey</a>. Click on the video screenshot to <a href="http://www.tarasnovak.com/lab/SimpleVideoPlayer/SimpleVideoPlayer.html" target="_blank">play it</a>. Drag the slider thumb to seek video.</p>
<p style="text-align: center;"><a href="http://www.tarasnovak.com/lab/SimpleVideoPlayer/SimpleVideoPlayer.html" target="_blank"><img class="size-full wp-image-573 aligncenter" title="Play Little Toy Gun by Honey Honey" src="http://tarasnovak.com/blog/wp-content/uploads/2009/01/littletoygun.jpg" alt="littletoygun" width="342" height="325" /><br />
</a></p>
<p>The video player skin and resize controls are located in the bottom right corner.</p>
<p>It&#8217;s amazing how simple it is to add some quick and yet visually appealing animation effects with <a href="http://code.google.com/p/tweener/" target="_blank">Tweener</a>. I am also looking forward to find some free time to check out and compare Tweener with Grant Skinner&#8217;s new <a href="http://www.gskinner.com/blog/archives/2008/12/gtween_beta_3_t.html" target="_blank">GTween library</a>.</p>
<p>If you like that default Shadow UI skin I&#8217;ve used for this player, you can download it from <a href="http://www.scalenine.com/themes/shadow/shadow.html">scalenine.com</a></p>
<p><strong>Source Code and Example</strong></p>
<p>You can <a href="http://www.tarasnovak.com/lab/SimpleVideoPlayer/srcview/index.html" target="_blank">view VideoPlayer component source</a> and <a href="http://www.tarasnovak.com/lab/SimpleVideoPlayer/srcview/SimpleVideoPlayer.zip" target="_blank">download it</a> for further customizations. Feel free to use it in your Flex applications as long as you give me some credit for the grunt UI work and all the video playback wiring.</p>
<p>BTW, those are original icons I&#8217;ve designed with <a href="http://www.microangelo.us/" target="_blank">Microangelo</a>. I find pixel plugging exercise very relaxing in the late hours :)</p>
<p>Here is an example of how to embed my Video Player component in your Flex application:</p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Application</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span></span>
<span style="color: #000000;"> 	xmlns:rf=<span style="color: #ff0000;">&quot;com.randomFractals.media.controls.*&quot;</span></span>
<span style="color: #000000;"> 	layout=<span style="color: #ff0000;">&quot;vertical&quot;</span>	</span>
<span style="color: #000000;">	width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span>  </span>
<span style="color: #000000;">	color=<span style="color: #ff0000;">&quot;#FFFFFF&quot;</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Style</span> source=<span style="color: #ff0000;">&quot;/assets/skins/shadow.css&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;rf:VideoPlayer</span> id=<span style="color: #ff0000;">&quot;player&quot;</span> autoPlay=<span style="color: #ff0000;">&quot;true&quot;</span> </span>
<span style="color: #000000;">			url=<span style="color: #ff0000;">&quot;video/Honey_Honey_-_Little_Toy_Gun.flv&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>				
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p>Just upload your sample video and give Video Player an flv url for video playback. That&#8217;s it!</p>
<p>I have not looked into live streaming for this one. So, no guarantees there, but do let me know if you try it.</p>
<p><a href="http://code.google.com/apis/youtube/chromeless_player_reference.html" target="_blank">YouTube&#8217;s Chromeless Video Player</a> and <a href="http://code.google.com/apis/youtube/getting_started.html#data_api" target="_blank">Data API</a> hook up is the next good step for this player to search and play some vids. I&#8217;ll probably wire it to YouTube in v.2.</p>
<p>For now you can embed your vids or load them from your server.</p>
<p>And, yes. You can follow me on <a href="http://twitter.com/TarasNovak" target="_blank">Twitter</a>. If you watched the whole video and use Twitter you&#8217;ll get the joke.</p>
<h3  class="related_post_title">Related Posts</h3><ul class="related_post"><li>No Related Post</li></ul>]]></content:encoded>
			<wfw:commentRss>http://randomfractals.com/blog/2009/01/16/simple-flex-video-player/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

