templeos-info/public/Wb/Doc/GraphicsOverview.DD.HTML

149 lines
13 KiB
HTML
Executable File

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="generator" content="TempleOS V5.03">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="/style/templeos.css">
<script src="/script/templeos.js"></script>
<style type="text/css">
.cF0{color:#000000;background-color:#ffffff;}
.cF1{color:#0000aa;background-color:#ffffff;}
.cF2{color:#00aa00;background-color:#ffffff;}
.cF3{color:#00aaaa;background-color:#ffffff;}
.cF4{color:#aa0000;background-color:#ffffff;}
.cF5{color:#aa00aa;background-color:#ffffff;}
.cF6{color:#aa5500;background-color:#ffffff;}
.cF7{color:#aaaaaa;background-color:#ffffff;}
.cF8{color:#555555;background-color:#ffffff;}
.cF9{color:#5555ff;background-color:#ffffff;}
.cFA{color:#55ff55;background-color:#ffffff;}
.cFB{color:#55ffff;background-color:#ffffff;}
.cFC{color:#ff5555;background-color:#ffffff;}
.cFD{color:#ff55ff;background-color:#ffffff;}
.cFE{color:#ffff55;background-color:#ffffff;}
.cFF{color:#ffffff;background-color:#ffffff;}
</style>
</head>
<body>
<pre id="content">
<a name="l1"></a><span class=cF5> Graphics Overview</span><span class=cF0>
<a name="l2"></a>
<a name="l3"></a>Dive into </span><a href="/Wb/Doc/DemoIndex.DD.HTML#l1"><span class=cF4>Demo Index</span></a><span class=cF0> to learn.
<a name="l4"></a>
<a name="l5"></a>The order layers are drawn on top of each other is:
<a name="l6"></a>
<a name="l7"></a>
<a name="l8"></a>
<a name="l9"></a>
<a name="l10"></a>
<a name="l11"></a>
<a name="l12"></a>
<a name="l13"></a>
<a name="l14"></a>
<a name="l15"></a>
<a name="l16"></a></span><span class=cFA>
<a name="l17"></a>/* Graphics Not Rendered in HTML */</span><span class=cF0>
<a name="l18"></a>
<a name="l19"></a>
<a name="l20"></a>
<a name="l21"></a>
<a name="l22"></a>
<a name="l23"></a>
<a name="l24"></a>
<a name="l25"></a>
<a name="l26"></a>
<a name="l27"></a>
<a name="l28"></a>
<a name="l29"></a>
<a name="l30"></a>
<a name="l31"></a>
<a name="l32"></a>
<a name="l33"></a>
<a name="l34"></a>
<a name="l35"></a>
<a name="l36"></a>
<a name="l37"></a>
<a name="l38"></a>
<a name="l39"></a>
<a name="l40"></a>
<a name="l41"></a>
<a name="l42"></a>
<a name="l43"></a>
<a name="l44"></a>
<a name="l45"></a>* See </span><a href="/Wb/Adam/Gr/GrScrn.HC.HTML#l398"><span class=cF4>GrUpdateScrn</span></a><span class=cF0>(), </span><a href="/Wb/Adam/Gr/GrScrn.HC.HTML#l58"><span class=cF4>GrUpdateTasks</span></a><span class=cF0>() and </span><a href="/Wb/Adam/Gr/GrScrn.HC.HTML#l18"><span class=cF4>GrUpdateTaskWin</span></a><span class=cF0>() called by the WinMgr
<a name="l46"></a>task 30fps. Notice the task's </span><a href="/Wb/Adam/Gr/GrScrn.HC.HTML#l35"><span class=cF4>draw_it</span></a><span class=cF0>() callback being called. Only tasks on </span><span class=cF2>C
<a name="l47"></a>ore0</span><span class=cF0> are allowed to have windows. There is one window per task, no child
<a name="l48"></a>windows. You can have pop-up child tasks.
<a name="l49"></a>
<a name="l50"></a>* </span><a href="/Wb/Kernel/KernelA.HH.HTML#l3599"><span class=cF4>CDC</span></a><span class=cF0>s (device contexts) are a data type for controlling graphics on the scrn or
<a name="l51"></a>graphics in mem. The device context structure has thick and color. You use </span><span class=cF4>
<a name="l52"></a></span><a href="/Wb/Adam/Gr/GrDC.HC.HTML#l168"><span class=cF4>DCAlias</span></a><span class=cF0>() to create your own structure, with its own color and thick. Free it
<a name="l53"></a>with </span><a href="/Wb/Adam/Gr/GrDC.HC.HTML#l208"><span class=cF4>DCDel</span></a><span class=cF0>() when finished.
<a name="l54"></a>
<a name="l55"></a>* </span><span class=cF4>gr.dc</span><span class=cF0> is a device context for persistent data on the scrn, not needing to be
<a name="l56"></a>redrawn. You create an alias for this by using </span><a href="/Wb/Adam/Gr/GrDC.HC.HTML#l168"><span class=cF4>DCAlias</span></a><span class=cF0>() and work with that.
<a name="l57"></a>See </span><a href="/Wb/Demo/Graphics/NetOfDots.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/NetOfDots.HC</span></a><span class=cF0>.
<a name="l58"></a>
<a name="l59"></a>* There are various flavors of line and point plotting routines. </span><a href="/Wb/Adam/Gr/GrPrimatives.HC.HTML#l568"><span class=cF4>GrLine</span></a><span class=cF0>() and </span><span class=cF4>
<a name="l60"></a></span><a href="/Wb/Adam/Gr/GrPrimatives.HC.HTML#l51"><span class=cF4>GrPlot</span></a><span class=cF0>() are the simplest. The others allow 3D graphics and rotations.
<a name="l61"></a>
<a name="l62"></a>* See </span><a href="/Wb/Doc/Transform.DD.HTML#l1"><span class=cF4>::/Doc/Transform.DD</span></a><span class=cF0> for adding a transformation.
<a name="l63"></a>
<a name="l64"></a>* You change the </span><span class=cF2>Fs-&gt;draw_it</span><span class=cF0> var to point to your </span><span class=cF2>DrawIt()</span><span class=cF0> function which gets
<a name="l65"></a>called each scrn refresh (30 fps). You draw everything in the window over and
<a name="l66"></a>over again. See </span><a href="/Wb/Demo/Graphics/Box.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/Box.HC</span></a><span class=cF0>.
<a name="l67"></a>
<a name="l68"></a>* Use the graphic sprite resource editor, </span><span class=cF2>&lt;CTRL-r&gt;</span><span class=cF0>, to create a sprite that can
<a name="l69"></a>be plotted with </span><a href="/Wb/Adam/Gr/GrSpritePlot.HC.HTML#l18"><span class=cF4>Sprite3</span></a><span class=cF0>() or output to the cmd line with </span><a href="/Wb/Adam/Gr/GrSpritePlot.HC.HTML#l468"><span class=cF4>Sprite</span></a><span class=cF0>(). Use </span><span class=cF2>$IB,&quot;&quot;,B
<a name="l70"></a>I=1$</span><span class=cF0> in a src program to insert the addr of sprite binary data item #1. To
<a name="l71"></a>learn how the numbers work, after creating a sprite with </span><span class=cF2>&lt;CTRL-r&gt;</span><span class=cF0>, toggle to
<a name="l72"></a>plain text with </span><span class=cF2>&lt;CTRL-t&gt;</span><span class=cF0> and check its num. Make an assignment to a ptr var or
<a name="l73"></a>pass to </span><a href="/Wb/Adam/Gr/GrSpritePlot.HC.HTML#l18"><span class=cF4>Sprite3</span></a><span class=cF0>() with </span><span class=cF2>$IB,&quot;&quot;,BI=n$</span><span class=cF0>. Use </span><span class=cF2>&lt;CTRL-r&gt;</span><span class=cF0>'s &quot;Pointer to Sprite&quot; to make
<a name="l74"></a>a </span><span class=cF2>$IB...$</span><span class=cF0> entry. See </span><a href="/Wb/Demo/Graphics/SpritePlot.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/SpritePlot.HC</span></a><span class=cF0> and </span><span class=cF4>
<a name="l75"></a></span><a href="/Wb/Demo/Graphics/SpritePlot3D.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/SpritePlot3D.HC</span></a><span class=cF0>. The origin (zero point) for a sprite is
<a name="l76"></a>defined by the cursor location when you pressed </span><span class=cF2>&lt;CTRL-r&gt;</span><span class=cF0> to make it. You can
<a name="l77"></a>edit a sprite by clicking the cursor on it and pressing </span><span class=cF2>&lt;CTRL-r&gt;</span><span class=cF0> again.
<a name="l78"></a>
<a name="l79"></a>* Set </span><a href="/Wb/Kernel/KernelA.HH.HTML#l3572"><span class=cF4>DCF_SYMMETRY</span></a><span class=cF0> in the </span><a href="/Wb/Kernel/KernelA.HH.HTML#l3599"><span class=cF4>CDC</span></a><span class=cF2>.flags</span><span class=cF0> and call </span><a href="/Wb/Adam/Gr/GrMath.HC.HTML#l194"><span class=cF4>DCSymmetrySet</span></a><span class=cF0>() or </span><a href="/Wb/Adam/Gr/GrMath.HC.HTML#l216"><span class=cF4>DCSymmetry3Set</span></a><span class=cF0>()
<a name="l80"></a>. This will plot a mirror image in addition to the primary image. Set </span><span class=cF4>
<a name="l81"></a></span><a href="/Wb/Kernel/KernelA.HH.HTML#l3576"><span class=cF4>DCF_JUST_MIRROR</span></a><span class=cF0> to plot just the image, but this required </span><a href="/Wb/Kernel/KernelA.HH.HTML#l3572"><span class=cF4>DCF_SYMMETRY</span></a><span class=cF0> to be set
<a name="l82"></a>at the same time. Note: You can only have one symmetry active at a time
<a name="l83"></a>including in </span><a href="/Wb/Adam/Gr/Gr.HH.HTML#l157"><span class=cF4>CSprite</span></a><span class=cF0>s.
<a name="l84"></a>
<a name="l85"></a>* Use </span><a href="/Wb/Adam/Gr/GrDC.HC.HTML#l186"><span class=cF4>DCNew</span></a><span class=cF0>() to create a mem bitmap which can be used to work off-scrn and
<a name="l86"></a>which can be </span><a href="/Wb/Adam/Gr/GrBitMap.HC.HTML#l71"><span class=cF4>GrBlot</span></a><span class=cF0>ed onto the scrn. If you set </span><span class=cF2>brush</span><span class=cF0> member of </span><span class=cF2>CDC</span><span class=cF0> to another </span><span class=cF2>
<a name="l87"></a>CDC</span><span class=cF0>, all the graphic routines will </span><a href="/Wb/Adam/Gr/GrBitMap.HC.HTML#l71"><span class=cF4>GrBlot</span></a><span class=cF0>() the brush instead of </span><a href="/Wb/Adam/Gr/GrPrimatives.HC.HTML#l51"><span class=cF4>GrPlot</span></a><span class=cF0>(). See </span><span class=cF4>
<a name="l88"></a></span><a href="/Wb/Demo/Graphics/Blot.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/Blot.HC</span></a><span class=cF0>.
<a name="l89"></a>
<a name="l90"></a>* There are a few </span><a href="/Wb/Kernel/KernelA.HH.HTML#l2898"><span class=cF4>raster operations</span></a><span class=cF0> available. They go in bits 8-11 of the </span><span class=cF2>dc-&gt;
<a name="l91"></a>color</span><span class=cF0> member var which is a </span><a href="/Wb/Kernel/KernelA.HH.HTML#l2939"><span class=cF4>CColorROPU32</span></a><span class=cF0>. </span><a href="/Wb/Kernel/KernelA.HH.HTML#l2900"><span class=cF4>ROP_COLLISION</span></a><span class=cF0> is special. It counts
<a name="l92"></a>the num of pixs drawn on non-background locations. Using </span><a href="/Wb/Kernel/KernelA.HH.HTML#l2900"><span class=cF4>ROP_COLLISION</span></a><span class=cF0> with
<a name="l93"></a>vector </span><a href="/Wb/Adam/Gr/Gr.HH.HTML#l157"><span class=cF4>CSprite</span></a><span class=cF0>'s is tricky because overlapping pixs from lines in the </span><a href="/Wb/Adam/Gr/Gr.HH.HTML#l157"><span class=cF4>CSprite</span></a><span class=cF0>
<a name="l94"></a>reg as collisions. You can either work with a nonzero count or convert your </span><span class=cF4>
<a name="l95"></a></span><a href="/Wb/Adam/Gr/Gr.HH.HTML#l157"><span class=cF4>CSprite</span></a><span class=cF0> to a bitmap if your subelements draw on top of each other. Be sure to
<a name="l96"></a>set </span><span class=cF4>-&gt;bkcolor</span><span class=cF0> before using </span><a href="/Wb/Kernel/KernelA.HH.HTML#l2900"><span class=cF4>ROP_COLLISION</span></a><span class=cF0>. See </span><a href="/Wb/Demo/Graphics/Collision.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/Collision.HC</span></a><span class=cF0> and </span><span class=cF4>
<a name="l97"></a></span><a href="/Wb/Apps/Titanium/Titanium.HC.HTML#l505"><span class=cF4>Titanium</span></a><span class=cF0>.
<a name="l98"></a>
<a name="l99"></a>* The </span><span class=cF4>-&gt;dither_probability_u16</span><span class=cF0> member of </span><a href="/Wb/Kernel/KernelA.HH.HTML#l3599"><span class=cF4>CDC</span></a><span class=cF0> is a </span><span class=cF2>U16</span><span class=cF0> used to statistically sel
<a name="l100"></a>between two colors to get something resembling more shades of color. See </span><span class=cF4>
<a name="l101"></a></span><a href="/Wb/Demo/Graphics/SunMoon.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/SunMoon.HC</span></a><span class=cF0> and </span><a href="/Wb/Demo/Graphics/Shading.HC.HTML#l1"><span class=cF4>::/Demo/Graphics/Shading.HC</span></a><span class=cF0>. It works with many
<a name="l102"></a>graphic routines, but not those with pens.
<a name="l103"></a>
<a name="l104"></a>* There is a mechanism built-in for generating motion based on differential
<a name="l105"></a>equations, which allows realistic physics. You create an </span><a href="/Wb/Kernel/KernelA.HH.HTML#l251"><span class=cF4>CMathODE</span></a><span class=cF0> struct with </span><span class=cF4>
<a name="l106"></a></span><a href="/Wb/Adam/AMathODE.HC.HTML#l30"><span class=cF4>ODENew</span></a><span class=cF0>(), passing it the num of vars in the state vect. For realistic physics,
<a name="l107"></a>you usually have 2 state vars for each dimension (for each mass) because motion
<a name="l108"></a>is governed by F=mA which is a 2nd order equation. The two states are pos and
<a name="l109"></a>velocity and to solve these you need to supply the derivative of pos and
<a name="l110"></a>velocity. The derivative of pos is usually simply the current velocity and the
<a name="l111"></a>derivative of velocity is the acceleration (the sum of forces on a mass divided
<a name="l112"></a>by mass). To help provide meaningful names for values in the state vect, you
<a name="l113"></a>can create an </span><a href="/Wb/Kernel/KernelA.HH.HTML#l201"><span class=cF4>COrder2D3</span></a><span class=cF0> ptr and point it to a mass in the state vect. Six
<a name="l114"></a>elements in the state vect are required for each mass.
<a name="l115"></a>
<a name="l116"></a>See </span><span class=cF4><u>Math/CMathODE</u></span><span class=cF0>.
<a name="l117"></a>See </span><a href="/Wb/Demo/Games/Rocket.HC.HTML#l1"><span class=cF4>::/Demo/Games/Rocket.HC</span></a><span class=cF0>.
</span></pre></body>
</html>