aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html
diff options
context:
space:
mode:
Diffstat (limited to 'libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html')
-rw-r--r--libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html326
1 files changed, 163 insertions, 163 deletions
diff --git a/libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html b/libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html
index ea6291a..c8acea0 100644
--- a/libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html
+++ b/libraries/irrlicht-1.8/examples/06.2DGraphics/tutorial.html
@@ -1,163 +1,163 @@
1<html> 1<html>
2<head> 2<head>
3<title>Irrlicht Engine Tutorial</title> 3<title>Irrlicht Engine Tutorial</title>
4<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 4<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
5</head> 5</head>
6 6
7<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> 7<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
8<br> 8<br>
9<table width="95%" border="0" cellspacing="0" cellpadding="2" align="center"> 9<table width="95%" border="0" cellspacing="0" cellpadding="2" align="center">
10 <tr> 10 <tr>
11 <td bgcolor="#666699" width="10"><b><a href="http://irrlicht.sourceforge.net" target="_blank"><img src="../../media/irrlichtlogo.jpg" width="88" height="31" border="0"></a></b></td> 11 <td bgcolor="#666699" width="10"><b><a href="http://irrlicht.sourceforge.net" target="_blank"><img src="../../media/irrlichtlogo.jpg" width="88" height="31" border="0"></a></b></td>
12 <td bgcolor="#666699" width="100%"> 12 <td bgcolor="#666699" width="100%">
13<div align="center"> 13<div align="center">
14<div align="center"></div> 14<div align="center"></div>
15 <div align="left"><b><font color="#FFFFFF">Tutorial 6. 2D Graphics</font></b></div> 15 <div align="left"><b><font color="#FFFFFF">Tutorial 6. 2D Graphics</font></b></div>
16 </div> 16 </div>
17 </td> 17 </td>
18 </tr> 18 </tr>
19 <tr bgcolor="#eeeeff"> 19 <tr bgcolor="#eeeeff">
20 <td height="90" colspan="2"> 20 <td height="90" colspan="2">
21 <div align="left"> 21 <div align="left">
22 <p>This Tutorial shows how to do 2d graphics with the Irrlicht Engine. 22 <p>This Tutorial shows how to do 2d graphics with the Irrlicht Engine.
23 It shows how to draw images, keycolor based sprites, transparent rectangles 23 It shows how to draw images, keycolor based sprites, transparent rectangles
24 and different fonts. You will may consider this useful if you want to 24 and different fonts. You will may consider this useful if you want to
25 make a 2d game with the engine, or if you want to draw a cool interface 25 make a 2d game with the engine, or if you want to draw a cool interface
26 or head up display for your 3d game.</p> 26 or head up display for your 3d game.</p>
27 <p>The program which is described here will look like this:</p> 27 <p>The program which is described here will look like this:</p>
28 <p align="center"><img src="../../media/006shot.jpg" width="259" height="204"><br> 28 <p align="center"><img src="../../media/006shot.jpg" width="259" height="204"><br>
29 </p> 29 </p>
30 </div> 30 </div>
31 </td> 31 </td>
32 </tr> 32 </tr>
33</table> 33</table>
34<br> 34<br>
35<table width="95%" border="0" cellspacing="0" cellpadding="2" align="center"> 35<table width="95%" border="0" cellspacing="0" cellpadding="2" align="center">
36 <tr> 36 <tr>
37 <td bgcolor="#666699"> <div align="center"><b><font color="#FFFFFF"></font></b></div> 37 <td bgcolor="#666699"> <div align="center"><b><font color="#FFFFFF"></font></b></div>
38 <b><font color="#FFFFFF">Lets start!</font></b></td> 38 <b><font color="#FFFFFF">Lets start!</font></b></td>
39 </tr> 39 </tr>
40 <tr> 40 <tr>
41 <td height="90" bgcolor="#eeeeff" valign="top"> <div align="left"> 41 <td height="90" bgcolor="#eeeeff" valign="top"> <div align="left">
42 <p>As always, I include the header files, use the irr namespace, and tell 42 <p>As always, I include the header files, use the irr namespace, and tell
43 the linker to link with the .lib file. </p> 43 the linker to link with the .lib file. </p>
44 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 44 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
45 <tr> 45 <tr>
46 <td> <pre>#include &lt;irrlicht.h&gt;<br>#include &lt;iostream&gt;<br><br>using namespace irr;</pre> 46 <td> <pre>#include &lt;irrlicht.h&gt;<br>#include &lt;iostream&gt;<br><br>using namespace irr;</pre>
47 <pre>#pragma comment(lib, &quot;Irrlicht.lib&quot;) 47 <pre>#pragma comment(lib, &quot;Irrlicht.lib&quot;)
48 </pre></td> 48 </pre></td>
49 </tr> 49 </tr>
50 </table> 50 </table>
51 <p>At first, we let the user select the driver type, then start up the 51 <p>At first, we let the user select the driver type, then start up the
52 engine, set a caption, and get a pointer to the video driver.</p> 52 engine, set a caption, and get a pointer to the video driver.</p>
53 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 53 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
54 <tr> 54 <tr>
55 <td> <pre>int main()<br>{<br> // let user select driver type<br> video::E_DRIVER_TYPE driverType;<br><br> printf(&quot;Please select the driver you want for this example:\n&quot;\<br> &quot; (a) Direct3D 9.0c\n (b) Direct3D 8.1\n (c) OpenGL 1.5\n&quot;\<br> &quot; (d) Software Renderer\n (e) Apfelbaum Software Renderer\n&quot;\<br> &quot; (f) NullDevice\n (otherKey) exit\n\n&quot;);<br><br> char i;<br> std::cin &gt;&gt; i;<br><br> switch(i)<br> {<br> case 'a': driverType = video::EDT_DIRECT3D9;break;<br> case 'b': driverType = video::EDT_DIRECT3D8;break;<br> case 'c': driverType = video::EDT_OPENGL; break;<br> case 'd': driverType = video::EDT_SOFTWARE; break;<br> case 'e': driverType = video::EDT_BURNINGSVIDEO;break;<br> case 'f': driverType = video::EDT_NULL; break;<br> default: return 0;<br> } <br><br> // create device</pre> 55 <td> <pre>int main()<br>{<br> // let user select driver type<br> video::E_DRIVER_TYPE driverType;<br><br> printf(&quot;Please select the driver you want for this example:\n&quot;\<br> &quot; (a) Direct3D 9.0c\n (b) Direct3D 8.1\n (c) OpenGL 1.5\n&quot;\<br> &quot; (d) Software Renderer\n (e) Apfelbaum Software Renderer\n&quot;\<br> &quot; (f) NullDevice\n (otherKey) exit\n\n&quot;);<br><br> char i;<br> std::cin &gt;&gt; i;<br><br> switch(i)<br> {<br> case 'a': driverType = video::EDT_DIRECT3D9;break;<br> case 'b': driverType = video::EDT_DIRECT3D8;break;<br> case 'c': driverType = video::EDT_OPENGL; break;<br> case 'd': driverType = video::EDT_SOFTWARE; break;<br> case 'e': driverType = video::EDT_BURNINGSVIDEO;break;<br> case 'f': driverType = video::EDT_NULL; break;<br> default: return 0;<br> } <br><br> // create device</pre>
56 <pre> IrrlichtDevice *device = createDevice(driverType, 56 <pre> IrrlichtDevice *device = createDevice(driverType,
57 core::dimension2d&lt;s32&gt;(512, 384));</pre> 57 core::dimension2d&lt;s32&gt;(512, 384));</pre>
58 <pre> if (device == 0) 58 <pre> if (device == 0)
59 return 1; 59 return 1;
60 <br> device-&gt;setWindowCaption(L&quot;Irrlicht Engine - 2D Graphics Demo&quot;);</pre> 60 <br> device-&gt;setWindowCaption(L&quot;Irrlicht Engine - 2D Graphics Demo&quot;);</pre>
61 <pre> video::IVideoDriver* driver = device-&gt;getVideoDriver();</pre></td> 61 <pre> video::IVideoDriver* driver = device-&gt;getVideoDriver();</pre></td>
62 </tr> 62 </tr>
63 </table> 63 </table>
64 <p> All 2d graphics in this example are put together into one texture, 64 <p> All 2d graphics in this example are put together into one texture,
65 2ddemo.bmp. Because we want to draw colorkey based sprites, we need 65 2ddemo.bmp. Because we want to draw colorkey based sprites, we need
66 to load this texture and tell the engine, which part of it should be 66 to load this texture and tell the engine, which part of it should be
67 transparent based on a colorkey. In this example, we don't tell it the 67 transparent based on a colorkey. In this example, we don't tell it the
68 color directly, we just say &quot;Hey Irrlicht Engine, you'll find the 68 color directly, we just say &quot;Hey Irrlicht Engine, you'll find the
69 color I want at position (0,0) on the texture.&quot;. Instead, it would 69 color I want at position (0,0) on the texture.&quot;. Instead, it would
70 be also possible to call <font face="Courier New, Courier, mono">driver-&gt;makeColorKeyTexture(images, 70 be also possible to call <font face="Courier New, Courier, mono">driver-&gt;makeColorKeyTexture(images,
71 video::SColor(0,0,0,0))</font>, to make e.g. all black pixels transparent. 71 video::SColor(0,0,0,0))</font>, to make e.g. all black pixels transparent.
72 Please note, that makeColorKeyTexture just creates an alpha channel 72 Please note, that makeColorKeyTexture just creates an alpha channel
73 based on the color. </p> 73 based on the color. </p>
74 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 74 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
75 <tr> 75 <tr>
76 <td> <pre>video::ITexture* images = driver-&gt;getTexture(&quot;../../media/2ddemo.bmp&quot;);<br>driver-&gt;makeColorKeyTexture(images, core::position2d&lt;s32&gt;(0,0));</pre></td> 76 <td> <pre>video::ITexture* images = driver-&gt;getTexture(&quot;../../media/2ddemo.bmp&quot;);<br>driver-&gt;makeColorKeyTexture(images, core::position2d&lt;s32&gt;(0,0));</pre></td>
77 </tr> 77 </tr>
78 </table> 78 </table>
79 <p>To be able to draw some text with two different fonts, we load them. 79 <p>To be able to draw some text with two different fonts, we load them.
80 Ok, we load just one, as first font we just use the default font which 80 Ok, we load just one, as first font we just use the default font which
81 is built into the engine.<br> 81 is built into the engine.<br>
82 Also, we define two rectangles, which specify the position of the images 82 Also, we define two rectangles, which specify the position of the images
83 of the red imps (little flying creatures) in the texture.</p> 83 of the red imps (little flying creatures) in the texture.</p>
84 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 84 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
85 <tr> 85 <tr>
86 <td> <pre>gui::IGUIFont* font = device-&gt;getGUIEnvironment()-&gt;getBuiltInFont();<br>gui::IGUIFont* font2 = device-&gt;getGUIEnvironment()-&gt;getFont( 86 <td> <pre>gui::IGUIFont* font = device-&gt;getGUIEnvironment()-&gt;getBuiltInFont();<br>gui::IGUIFont* font2 = device-&gt;getGUIEnvironment()-&gt;getFont(
87 &quot;../../media/fonthaettenschweiler.bmp&quot;);</pre> 87 &quot;../../media/fonthaettenschweiler.bmp&quot;);</pre>
88 <pre>core::rect&lt;s32&gt; imp1(349,15,385,78); 88 <pre>core::rect&lt;s32&gt; imp1(349,15,385,78);
89core::rect&lt;s32&gt; imp2(387,15,423,78);</pre></td> 89core::rect&lt;s32&gt; imp2(387,15,423,78);</pre></td>
90 </tr> 90 </tr>
91 </table> 91 </table>
92 <p>Everything is prepared, now we can draw everything in the draw loop, 92 <p>Everything is prepared, now we can draw everything in the draw loop,
93 between the begin scene and end scene calls. In this example, we are 93 between the begin scene and end scene calls. In this example, we are
94 just doing 2d graphics, but it would be no problem to mix them with 94 just doing 2d graphics, but it would be no problem to mix them with
95 3d graphics. Just try it out, and draw some 3d vertices or set up a 95 3d graphics. Just try it out, and draw some 3d vertices or set up a
96 scene with the scene manager and draw it.</p> 96 scene with the scene manager and draw it.</p>
97 </div> 97 </div>
98 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 98 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
99 <tr> 99 <tr>
100 <td> <pre>while(device-&gt;run() &amp;&amp; driver)<br>{<br> if (device-&gt;isWindowActive())<br> {<br> u32 time = device-&gt;getTimer()-&gt;getTime();<br> driver-&gt;beginScene(true, true, video::SColor(0,120,102,136)); 100 <td> <pre>while(device-&gt;run() &amp;&amp; driver)<br>{<br> if (device-&gt;isWindowActive())<br> {<br> u32 time = device-&gt;getTimer()-&gt;getTime();<br> driver-&gt;beginScene(true, true, video::SColor(0,120,102,136));
101</pre></td> 101</pre></td>
102 </tr> 102 </tr>
103 </table> 103 </table>
104 <p> First, we draw 3 sprites, using the alpha channel we created with makeColorKeyTexture. 104 <p> First, we draw 3 sprites, using the alpha channel we created with makeColorKeyTexture.
105 The last parameter specifiys that the drawing method should use thiw alpha 105 The last parameter specifiys that the drawing method should use thiw alpha
106 channel. The parameter before the last one specifies a color, with wich 106 channel. The parameter before the last one specifies a color, with wich
107 the sprite should be colored. (255,255,255,255) is full white, so the 107 the sprite should be colored. (255,255,255,255) is full white, so the
108 sprite will look like the original. The third sprite is drawed colored 108 sprite will look like the original. The third sprite is drawed colored
109 based on the time. </p> 109 based on the time. </p>
110 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 110 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
111 <tr> 111 <tr>
112 <td><pre>// draw fire &amp; dragons background world<br>driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(50,50),<br> core::rect&lt;s32&gt;(0,0,342,224), 0, <br> video::SColor(255,255,255,255), true);</pre> 112 <td><pre>// draw fire &amp; dragons background world<br>driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(50,50),<br> core::rect&lt;s32&gt;(0,0,342,224), 0, <br> video::SColor(255,255,255,255), true);</pre>
113 <pre>// draw flying imp 113 <pre>// draw flying imp
114driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(164,125), 114driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(164,125),
115 (time/500 % 2) ? imp1 : imp2, 0, 115 (time/500 % 2) ? imp1 : imp2, 0,
116 video::SColor(255,255,255,255), true);</pre> 116 video::SColor(255,255,255,255), true);</pre>
117 <pre>// draw second flying imp with colorcylce 117 <pre>// draw second flying imp with colorcylce
118driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(270,105), 118driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(270,105),
119 (time/500 % 2) ? imp1 : imp2, 0, 119 (time/500 % 2) ? imp1 : imp2, 0,
120 video::SColor(255,(time) % 255,255,255), true);</pre></td> 120 video::SColor(255,(time) % 255,255,255), true);</pre></td>
121 </tr> 121 </tr>
122 </table> 122 </table>
123 <p> Drawing text is really simple. The code should be self explanatory.</p> 123 <p> Drawing text is really simple. The code should be self explanatory.</p>
124 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 124 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
125 <tr> 125 <tr>
126 <td><pre>// draw some text<br>if (font)<br> font-&gt;draw(L&quot;This is some text.&quot;,<br> core::rect&lt;s32&gt;(130,10,300,50),<br> video::SColor(255,255,255,255));</pre> 126 <td><pre>// draw some text<br>if (font)<br> font-&gt;draw(L&quot;This is some text.&quot;,<br> core::rect&lt;s32&gt;(130,10,300,50),<br> video::SColor(255,255,255,255));</pre>
127 <pre>// draw some other text 127 <pre>// draw some other text
128if (font2) 128if (font2)
129 font2-&gt;draw(L&quot;This is some other text.&quot;, 129 font2-&gt;draw(L&quot;This is some other text.&quot;,
130 core::rect&lt;s32&gt;(130,20,300,60), 130 core::rect&lt;s32&gt;(130,20,300,60),
131 video::SColor(255,time % 255,time % 255,255));</pre></td> 131 video::SColor(255,time % 255,time % 255,255));</pre></td>
132 </tr> 132 </tr>
133 </table> 133 </table>
134 <p>At last, we draw the Irrlicht Engine logo (without using a color or an 134 <p>At last, we draw the Irrlicht Engine logo (without using a color or an
135 alpha channel) and a transparent 2d Rectangle at the position of the mouse 135 alpha channel) and a transparent 2d Rectangle at the position of the mouse
136 cursor.</p> 136 cursor.</p>
137 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 137 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
138 <tr> 138 <tr>
139 <td> <pre> // draw logo<br> driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(10,10),<br> core::rect&lt;s32&gt;(354,87,442,118));</pre> 139 <td> <pre> // draw logo<br> driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(10,10),<br> core::rect&lt;s32&gt;(354,87,442,118));</pre>
140 <pre> // draw transparent rect under cursor 140 <pre> // draw transparent rect under cursor
141 core::position2d&lt;s32&gt; m = device-&gt;getCursorControl()-&gt;getPosition(); 141 core::position2d&lt;s32&gt; m = device-&gt;getCursorControl()-&gt;getPosition();
142 driver-&gt;draw2DRectangle(video::SColor(100,255,255,255), 142 driver-&gt;draw2DRectangle(video::SColor(100,255,255,255),
143 core::rect&lt;s32&gt;(m.X-20, m.Y-20, m.X+20, m.Y+20));</pre> 143 core::rect&lt;s32&gt;(m.X-20, m.Y-20, m.X+20, m.Y+20));</pre>
144 <pre> driver-&gt;endScene(); 144 <pre> driver-&gt;endScene();
145 } 145 }
146}</pre></td> 146}</pre></td>
147 </tr> 147 </tr>
148 </table> 148 </table>
149 <p>That's all, it was not really difficult, I hope.</p> 149 <p>That's all, it was not really difficult, I hope.</p>
150 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center"> 150 <table width="95%" border="0" cellspacing="2" cellpadding="0" bgcolor="#CCCCCC" align="center">
151 <tr> 151 <tr>
152 <td> <pre> device-&gt;drop(); 152 <td> <pre> device-&gt;drop();
153 return 0; 153 return 0;
154}</pre> 154}</pre>
155 </td> 155 </td>
156 </tr> 156 </tr>
157 </table> 157 </table>
158 <p>&nbsp;</p></td> 158 <p>&nbsp;</p></td>
159 </tr> 159 </tr>
160</table> 160</table>
161<p>&nbsp;</p> 161<p>&nbsp;</p>
162 </body> 162 </body>
163</html> 163</html>
generated by cgit v1.1 at 2024-07-06 15:52:28 +0000