<?xml version="1.0"?>
<rss version="2.0">
	<channel>
		<title>Shader output is blocky</title>
		<link>http://www.allegro.cc/forums/view/616379</link>
		<description>Allegro.cc Forum Thread</description>
		<webMaster>matthew@allegro.cc (Matthew Leverton)</webMaster>
		<lastBuildDate>Tue, 05 Jul 2016 19:53:25 +0000</lastBuildDate>
	</channel>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Hi all,</p><p>Experimenting with shaders.</p><p>Just using a really simple pixel and vertex shader, based off the examples:
</p><div class="source-code snippet"><div class="inner"><pre><span class="c">// The vertex shader.</span>
attribute vec4 al_pos<span class="k2">;</span>
attribute vec4 al_color<span class="k2">;</span>
attribute vec2 al_texcoord<span class="k2">;</span>
uniform mat4 al_projview_matrix<span class="k2">;</span>
varying vec4 varying_color<span class="k2">;</span>
varying vec2 varying_texcoord<span class="k2">;</span>
<span class="k1">void</span> main<span class="k2">(</span><span class="k2">)</span>
<span class="k2">{</span>
   varying_color <span class="k3">=</span> al_color<span class="k2">;</span>
   varying_texcoord <span class="k3">=</span> al_texcoord<span class="k2">;</span>
   gl_Position <span class="k3">=</span> al_projview_matrix <span class="k3">*</span> al_pos<span class="k2">;</span>
<span class="k2">}</span>
</pre></div></div><p>

</p><div class="source-code snippet"><div class="inner"><pre><span class="c">// THE PIXEL SHADER</span>
varying vec4 varying_color<span class="k2">;</span>

<span class="k1">void</span> main<span class="k2">(</span> <span class="k1">void</span> <span class="k2">)</span> 
<span class="k2">{</span>
  gl_FragColor <span class="k3">=</span> varying_color<span class="k2">;</span>
<span class="k2">}</span>
</pre></div></div><p>

I assume that &quot;varying_color&quot; is passed between these two programs. Here is the my program without shaders.</p><p>In the attachments, &quot;snapshot2.png&quot; is my program with the shader; &quot;snapshot3.png&quot; is my program without it. </p><p>Is there any reason why this is happening?</p><p>I have very minimal experience with shaders.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Mon, 04 Jul 2016 15:35:52 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p><tt>al_color</tt> is the vertex color. Most geometry is sent as two triangles forming a quad, where the vertex color is the <tt>tint</tt> value in the <tt>al_draw_tinted*</tt> arguments (among others).</p><p>You aren&#39;t reading the texture data. <a href="http://liballeg.org/a5docs/trunk/shader.html#al_attach_shader_source">According to the manual</a>, the current texture is automatically bound to <tt>al_tex</tt>.</p><p>So you need to change your pixel shader to:</p><div class="source-code snippet"><div class="inner"><pre>uniform sampler2D al_tex<span class="k2">;</span>

varying vec4 varying_color<span class="k2">;</span>
varying vec2 varying_texcoord<span class="k2">;</span>

<span class="k1">void</span> main<span class="k2">(</span> <span class="k1">void</span> <span class="k2">)</span> 
<span class="k2">{</span>
  vec4 tex_sample <span class="k3">=</span> texture<span class="k2">(</span>al_tex, varying_texcoord<span class="k2">)</span><span class="k2">;</span>
  gl_FragColor <span class="k3">=</span> tex_sample <span class="k3">*</span> varying_color<span class="k2">;</span>
<span class="k2">}</span>
</pre></div></div><p>
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Mon, 04 Jul 2016 17:16:27 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Thanks for the reply. </p><p>However, it shows black now. When I touch certain widgets, it doesn&#39;t show the text as blocky anymore. Instead it shows a black screen until I find one of the list cells (snapshot5.png). If I touch the bottom-most cell in the list, I get the corresponding window appearing (snapshot4.png). All of these, except the text, are drawn with the primitive drawing functions with no textures.</p><p>Is it possible I have misused the primitive drawing functions?
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Mon, 04 Jul 2016 17:59:20 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Oh, you don&#39;t want to use <tt>al_tex</tt> if you aren&#39;t performing textured rendering. You&#39;ll get garbage values depending on the previous render commands.</p><p>If no texture is set, for example, <tt>tex_sample</tt> will be (0, 0, 0, 0), which will result in a black image. If, say, the font texture is set from previously drawing some text, you&#39;d retrieve a pixel from the font atlas, which will cause a darkening effect if the font is stored in a greyscale or greyscale-alpha format.</p><p>You can use a different shader for textured and non-textured rendering, or use a small (e.g., 1x1) white texture when rendering non-textured primitives so the multiplication is essentially a no-op.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Mon, 04 Jul 2016 19:10:32 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Hey, I did that and it worked perfectly... For a while. Seriously, shaders are a little bipolar.</p><p>I wanted to see the effects of the shader on a bitmap. Now, I&#39;m not using al_draw_bitmap for this. Instead, I&#39;ve used a textured quad.</p><p>Why is it that when I draw without the shader, I get &#39;snapshot6.png&#39;, but if I use the shader, I get &#39;snapshot7.png&#39;?</p><p>I know what&#39;s happenning. See, when I use the textured quad, I specify the UV coords in bitmap space (i.e. number of pixels in the bitmap). And this works without the shader. When I use the shader, I have to normalise it down to 0-1 like I always thought I should (I also have to flip the vertical coordinate, because the texture comes out upside down). I just don&#39;t understand why it works one way but not the other. This is really inconsistent.</p><p>Also, my untextured quads that make up the UI are now not being drawn properly. For some reason, they&#39;re being shrunk to tiny size (look closely at the top-left of where the window should be. I do use an orthogonal transform as the projection transform for the UI and an identity transform as the main world transform. It seems the shader I&#39;ve written is a little screwy.</p><p>Clearly I have completely missed something somewhere....</p><p>EDIT 1:<br />I use the textured quad instead of al_draw_bitmap because I needed to add a Z component. <img src="http://www.allegro.cc/forums/smileys/smiley.gif" alt=":)" /></p><p>EDIT 2:<br />Tried using the al_tex_matrix in the shader, but this caused stack-smashing at shader compile time... :-S
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Tue, 05 Jul 2016 17:11:49 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Are you using the built-in <tt>ALLEGRO_VERTEX</tt>? If not, can you provide the vertex structure, vertex declaration, vertex data, and parameters to <tt>al_draw_prim</tt> (or whichever low-level primitive drawing routine you are using)?
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Tue, 05 Jul 2016 18:07:11 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Yes I am. Here&#39;s my drawing code.</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="c">/**</span>
<span class="number">  2</span><span class="c"> *  Draw the bitmap.</span>
<span class="number">  3</span><span class="c"> *  @param srcRect The sub-rect within the bitmap to draw.</span>
<span class="number">  4</span><span class="c"> *  @param dstRect The screen rectangle in which to draw the bitmap.</span>
<span class="number">  5</span><span class="c"> *  @param z The location of the rectangle within the scene.</span>
<span class="number">  6</span><span class="c"> *  @param tint The colour to tint the bitmap.</span>
<span class="number">  7</span><span class="c"> */</span>
<span class="number">  8</span><span class="k1">void</span> BitmapAsset::Draw<span class="k2">(</span> AppFramework2::Geometry::Rect srcRect, AppFramework2::Geometry::Rect dstRect, AppFramework2::Math::Real z, AppFramework2::Graphics::Colour tint <span class="k2">)</span> <span class="k1">const</span> <span class="k2">{</span>
<span class="number">  9</span>
<span class="number"> 10</span>  <a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a> vertices<span class="k2">[</span><span class="k2">]</span> <span class="k3">=</span> <span class="k2">{</span>
<span class="number"> 11</span>    <span class="k2">{</span>                dstRect.location.x,                dstRect.location.y, z,                  srcRect.location.x,                  srcRect.location.y, tint <span class="k2">}</span>,
<span class="number"> 12</span>    <span class="k2">{</span> dstRect.size.x<span class="k3">+</span>dstRect.location.x,                dstRect.location.y, z, srcRect.size.x <span class="k3">+</span> srcRect.location.x,                  srcRect.location.y, tint <span class="k2">}</span>,
<span class="number"> 13</span>    <span class="k2">{</span>                dstRect.location.x, dstRect.size.y<span class="k3">+</span>dstRect.location.y, z,                  srcRect.location.x, srcRect.size.y <span class="k3">+</span> srcRect.location.y, tint <span class="k2">}</span>,
<span class="number"> 14</span>    <span class="k2">{</span> dstRect.size.x<span class="k3">+</span>dstRect.location.x, dstRect.size.y<span class="k3">+</span>dstRect.location.y, z, srcRect.size.x <span class="k3">+</span> srcRect.location.x, srcRect.size.y <span class="k3">+</span> srcRect.location.y, tint <span class="k2">}</span>
<span class="number"> 15</span>  <span class="k2">}</span><span class="k2">;</span>
<span class="number"> 16</span>
<span class="number"> 17</span>  <a href="http://www.allegro.cc/manual/al_draw_prim"><span class="a">al_draw_prim</span></a><span class="k2">(</span> <span class="k3">&amp;</span>vertices, NULL, mBitmapData, <span class="n">0</span>, <span class="n">4</span>, ALLEGRO_PRIM_TRIANGLE_STRIP <span class="k2">)</span><span class="k2">;</span>
<span class="number"> 18</span>
<span class="number"> 19</span><span class="k2">}</span>
</div></div><p>
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Tue, 05 Jul 2016 18:08:30 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>The texture coordinates for <span class="source-code"><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a></span> are <span class="source-code">ALLEGRO_PRIM_TEX_COORD_PIXEL</span>, which are measured in pixels. You want to use <span class="source-code">ALLEGRO_PRIM_TEX_COORD</span>, which are normalized. When using <span class="source-code"><a href="http://www.allegro.cc/manual/al_draw_prim"><span class="a">al_draw_prim</span></a></span>, if you pass <span class="source-code">NULL</span> as the <span class="source-code"><span class="k1">const</span> <a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX_DECL"><span class="a">ALLEGRO_VERTEX_DECL</span></a><span class="k3">*</span> decl</span> parameter, the default vertex declaration will be used.</p><p>Try creating a custom vertex declaration for <span class="source-code"><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a></span>, where the texture coordinates are <span class="source-code">ALLEGRO_PRIM_TEX_COORD</span>:</p><div class="source-code snippet"><div class="inner"><pre><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX_ELEMENT"><span class="a">ALLEGRO_VERTEX_ELEMENT</span></a> elements<span class="k2">[</span><span class="k2">]</span> <span class="k3">=</span> <span class="k2">{</span>
   <span class="k2">{</span> ALLEGRO_PRIM_POSITION, ALLEGRO_PRIM_FLOAT_3, offsetof<span class="k2">(</span><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a>, x<span class="k2">)</span> <span class="k2">}</span>,
   <span class="k2">{</span> ALLEGRO_PRIM_TEX_COORD, ALLEGRO_PRIM_FLOAT_2, offsetof<span class="k2">(</span><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a>, u<span class="k2">)</span> <span class="k2">}</span>,
   <span class="k2">{</span> ALLEGRO_PRIM_COLOR_ATTR, <span class="n">0</span>, offsetof<span class="k2">(</span><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a>, color<span class="k2">)</span> <span class="k2">}</span>,
   <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>

<a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX_DECL"><span class="a">ALLEGRO_VERTEX_DECL</span></a><span class="k3">*</span> custom_decl <span class="k3">=</span> <a href="http://www.allegro.cc/manual/al_create_vertex_decl"><span class="a">al_create_vertex_decl</span></a><span class="k2">(</span>elements, <span class="k1">sizeof</span><span class="k2">(</span><a href="http://www.allegro.cc/manual/ALLEGRO_VERTEX"><span class="a">ALLEGRO_VERTEX</span></a><span class="k2">)</span><span class="k2">)</span><span class="k2">;</span>
</pre></div></div><p>

Do that in some single place, kind of like how you&#39;d only create or load a bitmap once. Then provide <tt>custom_decl</tt> as an argument to <span class="source-code"><a href="http://www.allegro.cc/manual/al_draw_prim"><span class="a">al_draw_prim</span></a></span>, as so:</p><div class="source-code snippet"><div class="inner"><pre><a href="http://www.allegro.cc/manual/al_draw_prim"><span class="a">al_draw_prim</span></a><span class="k2">(</span> <span class="k3">&amp;</span>vertices, custom_decl, mBitmapData, <span class="n">0</span>, <span class="n">4</span>, ALLEGRO_PRIM_TRIANGLE_STRIP <span class="k2">)</span><span class="k2">;</span>
</pre></div></div><p>

Everything else should be able to stay the same, assuming you&#39;re using normalized texture coordinates.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Tue, 05 Jul 2016 18:35:19 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Ok, that fixed the issue with the scale of the texture coords. But not the fact that it vertically flips the texture when the shader is in use. This also doesn&#39;t fix the scaling issue of my untextured primitives.</p><p>EDIT:<br />I added this line to my fragment shader:
</p><div class="source-code snippet"><div class="inner"><pre>varying_texcoord.y <span class="k3">=</span> <span class="n">1</span> <span class="k3">-</span> varying_texcoord.y<span class="k2">;</span>
</pre></div></div><p>
which flips the y coordinate of the texture.</p><p>However, notice what happens to the UI quads? (See the attachment) The fill areas are flipped vertically as well. I was sure to draw them with the custom vertex declaration too.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Tue, 05 Jul 2016 19:09:32 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>(0, 0) is the bottom-left corner in OpenGL and GLSL, not top-left as with most everything else (Allegro, DirectX, etc). Since you&#39;re using GLSL, you&#39;ll have to adjust your coordinates accordingly.</p><p>I&#39;m not sure about the untextured primitives. How do you use the shader? How do you render the untextured primitives?
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Tue, 05 Jul 2016 19:22:07 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Fair enough. Can&#39;t do much about that then. I&#39;ll just remember to add that line to all my shaders... Now if I can just get the untextured quads working...
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Tue, 05 Jul 2016 19:29:15 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Are you using a blank, white texture, or a shader that doesn&#39;t use the texture, for the untextured quads?
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Tue, 05 Jul 2016 19:51:31 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Blank white texture 1x1.<br />It&#39;s all being run with a single shader.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (The Master)</author>
		<pubDate>Tue, 05 Jul 2016 19:53:25 +0000</pubDate>
	</item>
</rss>
