<?xml version="1.0"?>
<rss version="2.0">
	<channel>
		<title>A5 Bitmap Fade In and Out</title>
		<link>http://www.allegro.cc/forums/view/609721</link>
		<description>Allegro.cc Forum Thread</description>
		<webMaster>matthew@allegro.cc (Matthew Leverton)</webMaster>
		<lastBuildDate>Fri, 09 Mar 2012 22:27:06 +0000</lastBuildDate>
	</channel>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Back in the Allegro 4 days, we had those nice high color fade in and out functions that made fading bitmaps in and out perty easy.  Now that I am using Allegro 5, I need to figure out all this blending and alpha channel stuff.  I have been reading the posts in the forums, and playing with some of the code in those posts, but it seems some people are using the blending methods, other are just multiplying by alpha values, and what not, and to be honest, I am still very much confused.</p><p>I guess what I am asking here is, if there is a tutorial, or some code snippets that are known to work as of (3/8/2012) that could help a dummy such as myself learn his way around this topic?</p><p>Thanks for any and all assistance.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (aravan72rs)</author>
		<pubDate>Fri, 09 Mar 2012 01:35:57 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>All you really need to know SPECIFICALLY is you can draw a translucent rectangle with:</p><div class="source-code snippet"><div class="inner"><pre><span class="c">// This is the default blend mode. You don't have to do this unless you changed it earlier</span>
<a href="http://www.allegro.cc/manual/al_set_blender"><span class="a">al_set_blender</span></a><span class="k2">(</span>ALLEGRO_ADD, ALLEGRO_ONE, ALLEGRO_INVERSE_ALPHA<span class="k2">)</span><span class="k2">;</span>
<a href="http://www.allegro.cc/manual/al_draw_filled_rectangle"><span class="a">al_draw_filled_rectangle</span></a><span class="k2">(</span><span class="n">0</span>, <span class="n">0</span>, <a href="http://www.allegro.cc/manual/SCREEN_W"><span class="a">SCREEN_W</span></a>, <a href="http://www.allegro.cc/manual/SCREEN_H"><span class="a">SCREEN_H</span></a>, <a href="http://www.allegro.cc/manual/al_map_rgba"><span class="a">al_map_rgba</span></a><span class="k2">(</span><span class="n">0</span>, <span class="n">0</span>, <span class="n">0</span>, alpha_from_0_to_1<span class="k2">)</span><span class="k2">;</span>
</pre></div></div><p>

The alpha value there is a float and SCREEN_W/H are not real variables, substitute those as necessary.</p><p>So you&#39;re set up some timing method, and draw progressively higher alpha (0, 0.1, 0.2 -&gt; 1.0 or whatever) as above. That&#39;s a fade out to black. To fade in, do it in reverse, ie: 1.0, 0.9, 0.8 -&gt; 0.0 or whatever calculated values for alpha you have based on time of your timing method.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Trent Gamblin)</author>
		<pubDate>Fri, 09 Mar 2012 04:38:35 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Thanks for the reply.  Call me crazy, but I fiddled with your code there, and I had to tweak it a bit to get it to work. I had to change the al_map_rgba call you had below to al_map_rgba_f and multiply each value by the alpha value. So basically I did the following:</p><div class="source-code"><div class="toolbar"><span class="button numbers"><b>#</b></span><span class="button select">Select</span><span class="button expand">Expand</span></div><div class="inner"><span class="number">  1</span><span class="k1">for</span><span class="k2">(</span><span class="k1">float</span> alpha <span class="k3">=</span> <span class="n">1</span>.<span class="n">0</span><span class="k2">;</span> alpha <span class="k3">&gt;</span> <span class="n">0</span>.<span class="n">0</span><span class="k2">;</span> alpha <span class="k3">-</span><span class="k3">=</span> <span class="n">0</span>.<span class="n">1</span><span class="k2">)</span>
<span class="number">  2</span>      <span class="k2">{</span>
<span class="number">  3</span>        <a href="http://www.allegro.cc/manual/al_draw_filled_rectangle"><span class="a">al_draw_filled_rectangle</span></a><span class="k2">(</span><span class="n">55</span>,<span class="n">55</span>,<span class="n">60</span>,<span class="n">60</span>,<a href="http://www.allegro.cc/manual/al_map_rgb"><span class="a">al_map_rgb</span></a><span class="k2">(</span><span class="n">255</span>,<span class="n">0</span>,<span class="n">0</span><span class="k2">)</span><span class="k2">)</span><span class="k2">;</span>
<span class="number">  4</span>        <a href="http://www.allegro.cc/manual/al_draw_filled_rectangle"><span class="a">al_draw_filled_rectangle</span></a><span class="k2">(</span><span class="n">50</span>,<span class="n">50</span>,<span class="n">100</span>,<span class="n">100</span>,<a href="http://www.allegro.cc/manual/al_map_rgba_f"><span class="a">al_map_rgba_f</span></a><span class="k2">(</span><span class="n">1</span><span class="k3">*</span>alpha,<span class="n">1</span><span class="k3">*</span>alpha,<span class="n">1</span><span class="k3">*</span>alpha,alpha<span class="k2">)</span><span class="k2">)</span><span class="k2">;</span>
<span class="number">  5</span>        <a href="http://www.allegro.cc/manual/al_flip_display"><span class="a">al_flip_display</span></a><span class="k2">(</span><span class="k2">)</span><span class="k2">;</span>
<span class="number">  6</span>        <a href="http://www.allegro.cc/manual/al_clear_to_color"><span class="a">al_clear_to_color</span></a><span class="k2">(</span><a href="http://www.allegro.cc/manual/al_map_rgb"><span class="a">al_map_rgb</span></a><span class="k2">(</span><span class="n">0</span>,<span class="n">0</span>,<span class="n">0</span><span class="k2">)</span><span class="k2">)</span><span class="k2">;</span>
<span class="number">  7</span>        <a href="http://www.allegro.cc/manual/al_rest"><span class="a">al_rest</span></a><span class="k2">(</span><span class="n">0</span>.<span class="n">1</span><span class="k2">)</span><span class="k2">;</span>
<span class="number">  8</span>      <span class="k2">}</span>
</div></div><p>

It also appears that progressively higher alpha (0,0.1,0.2 -&gt; 1.0) is a fade in and the reverse (1.0,0.9,0.8 -&gt; 0.0) is a fade out.  So unless I totally botched something, the above fades a white square to black.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (aravan72rs)</author>
		<pubDate>Fri, 09 Mar 2012 07:51:26 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>1*alpha should be same as alpha <img src="http://www.allegro.cc/forums/smileys/huh.gif" alt="???" /><br />You&#39;ve got the hang of it. &quot;Alpha&quot; just means how opaque<span class="ref"><sup>[<a href="#">1</a>]</sup></span> the pixel is. 0 alpha means you can look through it. You can change the background colour to see that. So technically you&#39;re not doing a fade to black; you are making the square less transparent or more transparent.<br />You were right to use the &#39;_f&#39; suffixed function. Otherwise you&#39;d have to use int&#39;s ranging from 0 to 255. It is easier to understand using float colours.<br />Especially when doing &#39;multiplication&#39; on tinted bitmaps.
</p><div class="source-code snippet"><div class="inner"><pre><a href="http://www.allegro.cc/manual/al_map_rgb_f"><span class="a">al_map_rgb_f</span></a><span class="k2">(</span><span class="n">0</span>.<span class="n">5</span>, <span class="n">0</span>.<span class="n">5</span>, <span class="n">0</span>.<span class="n">5</span><span class="k2">)</span> tinted by <a href="http://www.allegro.cc/manual/al_map_rgb_f"><span class="a">al_map_rgb_f</span></a><span class="k2">(</span><span class="n">0</span>.<span class="n">1</span>, <span class="n">0</span>.<span class="n">2</span>, <span class="n">0</span>.<span class="n">3</span><span class="k2">)</span>
gives the same colour as: <a href="http://www.allegro.cc/manual/al_map_rgb_f"><span class="a">al_map_rgb_f</span></a><span class="k2">(</span><span class="n">0</span>.<span class="n">5</span> <span class="k3">*</span> <span class="n">0</span>.<span class="n">1</span>, <span class="n">0</span>.<span class="n">5</span> <span class="k3">*</span> <span class="n">0</span>.<span class="n">2</span>, <span class="n">0</span>.<span class="n">5</span> <span class="k3">*</span> <span class="n">0</span>.<span class="n">3</span><span class="k2">)</span>
                         <span class="k3">=</span><a href="http://www.allegro.cc/manual/al_map_rgb_f"><span class="a">al_map_rgb_f</span></a><span class="k2">(</span><span class="n">0</span>.<span class="n">05</span>, <span class="n">0</span>.<span class="n">10</span>, <span class="n">0</span>.<span class="n">15</span><span class="k2">)</span>
</pre></div></div><p>
</p><div class="ref-block"><h2>References</h2><ol><li>The opposite of transparent is opaque.</li></ol></div></div>]]>
		</description>
		<author>no-reply@allegro.cc (weapon_S)</author>
		<pubDate>Fri, 09 Mar 2012 14:05:33 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>DOH!!!::), you would be correct... 1*alpha is just alpha.  I guess what I was confused about was I had seen other examples where they were doing something like 1*fadeSpeed... Anyhoots, thanks for the push in the right direction, I will goof around with this a little more.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (aravan72rs)</author>
		<pubDate>Fri, 09 Mar 2012 19:56:56 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>They do 1*fadespeed sort of things so that other things can run at the same time in the game loop. With your for loop, everything stops while a block fades.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Trent Gamblin)</author>
		<pubDate>Fri, 09 Mar 2012 22:27:06 +0000</pubDate>
	</item>
</rss>
