aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/src/others/irrlicht-1.8.1/doc/html/example006.html
diff options
context:
space:
mode:
Diffstat (limited to 'src/others/irrlicht-1.8.1/doc/html/example006.html')
-rw-r--r--src/others/irrlicht-1.8.1/doc/html/example006.html219
1 files changed, 219 insertions, 0 deletions
diff --git a/src/others/irrlicht-1.8.1/doc/html/example006.html b/src/others/irrlicht-1.8.1/doc/html/example006.html
new file mode 100644
index 0000000..95c2ac7
--- /dev/null
+++ b/src/others/irrlicht-1.8.1/doc/html/example006.html
@@ -0,0 +1,219 @@
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml">
3<head>
4<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
5<title>Irrlicht 3D Engine: Tutorial 6: 2D Graphics</title>
6
7<link href="tabs.css" rel="stylesheet" type="text/css"/>
8<link href="doxygen.css" rel="stylesheet" type="text/css" />
9<link href="navtree.css" rel="stylesheet" type="text/css"/>
10<script type="text/javascript" src="jquery.js"></script>
11<script type="text/javascript" src="resize.js"></script>
12<script type="text/javascript" src="navtree.js"></script>
13<script type="text/javascript">
14 $(document).ready(initResizable);
15</script>
16<link href="search/search.css" rel="stylesheet" type="text/css"/>
17<script type="text/javascript" src="search/search.js"></script>
18<script type="text/javascript">
19 $(document).ready(function() { searchBox.OnSelectItem(0); });
20</script>
21
22</head>
23<body>
24<div id="top"><!-- do not remove this div! -->
25
26
27<div id="titlearea">
28<table cellspacing="0" cellpadding="0">
29 <tbody>
30 <tr style="height: 56px;">
31
32 <td id="projectlogo"><img alt="Logo" src="irrlichtlogo.png"/></td>
33
34
35 <td style="padding-left: 0.5em;">
36 <div id="projectname">Irrlicht 3D Engine
37
38 </div>
39
40 </td>
41
42
43
44
45 <td> <div id="MSearchBox" class="MSearchBoxInactive">
46 <span class="left">
47 <img id="MSearchSelect" src="search/mag_sel.png"
48 onmouseover="return searchBox.OnSearchSelectShow()"
49 onmouseout="return searchBox.OnSearchSelectHide()"
50 alt=""/>
51 <input type="text" id="MSearchField" value="Search" accesskey="S"
52 onfocus="searchBox.OnSearchFieldFocus(true)"
53 onblur="searchBox.OnSearchFieldFocus(false)"
54 onkeyup="searchBox.OnSearchFieldChange(event)"/>
55 </span><span class="right">
56 <a id="MSearchClose" href="javascript:searchBox.CloseResultsWindow()"><img id="MSearchCloseImg" border="0" src="search/close.png" alt=""/></a>
57 </span>
58 </div>
59</td>
60
61
62 </tr>
63 </tbody>
64</table>
65</div>
66
67<!-- Generated by Doxygen 1.7.5.1 -->
68<script type="text/javascript">
69var searchBox = new SearchBox("searchBox", "search",false,'Search');
70</script>
71<script type="text/javascript" src="dynsections.js"></script>
72</div>
73<div id="side-nav" class="ui-resizable side-nav-resizable">
74 <div id="nav-tree">
75 <div id="nav-tree-contents">
76 </div>
77 </div>
78 <div id="splitbar" style="-moz-user-select:none;"
79 class="ui-resizable-handle">
80 </div>
81</div>
82<script type="text/javascript">
83 initNavTree('example006.html','');
84</script>
85<div id="doc-content">
86<div class="header">
87 <div class="headertitle">
88<div class="title">Tutorial 6: 2D Graphics </div> </div>
89</div>
90<div class="contents">
91<div class="textblock"><div class="image">
92<img src="006shot.jpg" alt="006shot.jpg"/>
93</div>
94 <p>This Tutorial shows how to do 2d graphics with the Irrlicht Engine. It shows how to draw images, keycolor based sprites, transparent rectangles, and different fonts. You may consider this useful if you want to make a 2d game with the engine, or if you want to draw a cool interface or head up display for your 3d game.</p>
95<p>As always, I include the header files, use the irr namespace, and tell the linker to link with the .lib file. </p>
96<div class="fragment"><pre class="fragment"><span class="preprocessor">#include &lt;<a class="code" href="irrlicht_8h.html" title="Main header file of the irrlicht, the only file needed to include.">irrlicht.h</a>&gt;</span>
97<span class="preprocessor">#include &quot;<a class="code" href="driver_choice_8h.html">driverChoice.h</a>&quot;</span>
98
99<span class="keyword">using namespace </span>irr;
100
101<span class="preprocessor">#ifdef _MSC_VER</span>
102<span class="preprocessor"></span><span class="preprocessor">#pragma comment(lib, &quot;Irrlicht.lib&quot;)</span>
103<span class="preprocessor">#endif</span>
104</pre></div><p>At first, we let the user select the driver type, then start up the engine, set a caption, and get a pointer to the video driver. </p>
105<div class="fragment"><pre class="fragment"><span class="keywordtype">int</span> main()
106{
107 <span class="comment">// ask user for driver</span>
108 <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0" title="An enum for all types of drivers the Irrlicht Engine supports.">video::E_DRIVER_TYPE</a> driverType=driverChoiceConsole();
109 <span class="keywordflow">if</span> (driverType==<a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0ae685cada50f8c100403134d932d0414c" title="No driver, just for counting the elements.">video::EDT_COUNT</a>)
110 <span class="keywordflow">return</span> 1;
111
112 <span class="comment">// create device</span>
113
114 IrrlichtDevice *device = <a class="code" href="namespaceirr.html#abaf4d8719cc26b0d30813abf85e47c76" title="Creates an Irrlicht device. The Irrlicht device is the root object for using the engine.">createDevice</a>(driverType,
115 core::dimension2d&lt;u32&gt;(512, 384));
116
117 <span class="keywordflow">if</span> (device == 0)
118 <span class="keywordflow">return</span> 1; <span class="comment">// could not create selected driver.</span>
119
120 device-&gt;setWindowCaption(L<span class="stringliteral">&quot;Irrlicht Engine - 2D Graphics Demo&quot;</span>);
121
122 video::IVideoDriver* driver = device-&gt;getVideoDriver();
123</pre></div><p>All 2d graphics in this example are put together into one texture, 2ddemo.png. Because we want to draw colorkey based sprites, we need to load this texture and tell the engine, which part of it should be transparent based on a colorkey.</p>
124<p>In this example, we don't tell it the color directly, we just say "Hey Irrlicht Engine, you'll find the color I want at position (0,0) on the texture.". Instead, it would be also possible to call driver-&gt;makeColorKeyTexture(images, video::SColor(0,0,0,0)), to make e.g. all black pixels transparent. Please note that makeColorKeyTexture just creates an alpha channel based on the color. </p>
125<div class="fragment"><pre class="fragment"> video::ITexture* images = driver-&gt;getTexture(<span class="stringliteral">&quot;../../media/2ddemo.png&quot;</span>);
126 driver-&gt;makeColorKeyTexture(images, core::position2d&lt;s32&gt;(0,0));
127</pre></div><p>To be able to draw some text with two different fonts, we first load them. Ok, we load just one. As the first font we just use the default font which is built into the engine. Also, we define two rectangles which specify the position of the images of the red imps (little flying creatures) in the texture. </p>
128<div class="fragment"><pre class="fragment"> gui::IGUIFont* font = device-&gt;getGUIEnvironment()-&gt;getBuiltInFont();
129 gui::IGUIFont* font2 =
130 device-&gt;getGUIEnvironment()-&gt;getFont(<span class="stringliteral">&quot;../../media/fonthaettenschweiler.bmp&quot;</span>);
131
132 core::rect&lt;s32&gt; imp1(349,15,385,78);
133 core::rect&lt;s32&gt; imp2(387,15,423,78);
134</pre></div><p>Prepare a nicely filtering 2d render mode for special cases. </p>
135<div class="fragment"><pre class="fragment"> driver-&gt;getMaterial2D().TextureLayer[0].BilinearFilter=<span class="keyword">true</span>;
136 driver-&gt;getMaterial2D().AntiAliasing=<a class="code" href="namespaceirr_1_1video.html#aa8647c2a52bdd3bc15ee773e8f2b149dade3c9a3d46cbedc5304cfa869ab593fd" title="All typical anti-alias and smooth modes.">video::EAAM_FULL_BASIC</a>;
137</pre></div><p>Everything is prepared, now we can draw everything in the draw loop, between the begin scene and end scene calls. In this example, we are just doing 2d graphics, but it would be no problem to mix them with 3d graphics. Just try it out, and draw some 3d vertices or set up a scene with the scene manager and draw it. </p>
138<div class="fragment"><pre class="fragment"> <span class="keywordflow">while</span>(device-&gt;run() &amp;&amp; driver)
139 {
140 <span class="keywordflow">if</span> (device-&gt;isWindowActive())
141 {
142 <a class="code" href="namespaceirr.html#a0416a53257075833e7002efd0a18e804" title="32 bit unsigned variable.">u32</a> time = device-&gt;getTimer()-&gt;getTime();
143
144 driver-&gt;beginScene(<span class="keyword">true</span>, <span class="keyword">true</span>, video::SColor(255,120,102,136));
145</pre></div><p>First, we draw 3 sprites, using the alpha channel we created with makeColorKeyTexture. The last parameter specifies that the drawing method should use this alpha channel. The last-but-one parameter specifies a color, with which the sprite should be colored. (255,255,255,255) is full white, so the sprite will look like the original. The third sprite is drawn with the red channel modulated based on the time. </p>
146<div class="fragment"><pre class="fragment"> <span class="comment">// draw fire &amp; dragons background world</span>
147 driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(50,50),
148 core::rect&lt;s32&gt;(0,0,342,224), 0,
149 video::SColor(255,255,255,255), <span class="keyword">true</span>);
150
151 <span class="comment">// draw flying imp</span>
152 driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(164,125),
153 (time/500 % 2) ? imp1 : imp2, 0,
154 video::SColor(255,255,255,255), <span class="keyword">true</span>);
155
156 <span class="comment">// draw second flying imp with colorcylce</span>
157 driver-&gt;draw2DImage(images, core::position2d&lt;s32&gt;(270,105),
158 (time/500 % 2) ? imp1 : imp2, 0,
159 video::SColor(255,(time) % 255,255,255), <span class="keyword">true</span>);
160</pre></div><p>Drawing text is really simple. The code should be self explanatory. </p>
161<div class="fragment"><pre class="fragment"> <span class="comment">// draw some text</span>
162 <span class="keywordflow">if</span> (font)
163 font-&gt;draw(L<span class="stringliteral">&quot;This demo shows that Irrlicht is also capable of drawing 2D graphics.&quot;</span>,
164 core::rect&lt;s32&gt;(130,10,300,50),
165 video::SColor(255,255,255,255));
166
167 <span class="comment">// draw some other text</span>
168 <span class="keywordflow">if</span> (font2)
169 font2-&gt;draw(L<span class="stringliteral">&quot;Also mixing with 3d graphics is possible.&quot;</span>,
170 core::rect&lt;s32&gt;(130,20,300,60),
171 video::SColor(255,time % 255,time % 255,255));
172</pre></div><p>Next, we draw the Irrlicht Engine logo (without using a color or an alpha channel). Since we slightly scale the image we use the prepared filter mode. </p>
173<div class="fragment"><pre class="fragment"> driver-&gt;enableMaterial2D();
174 driver-&gt;draw2DImage(images, core::rect&lt;s32&gt;(10,10,108,48),
175 core::rect&lt;s32&gt;(354,87,442,118));
176 driver-&gt;enableMaterial2D(<span class="keyword">false</span>);
177</pre></div><p>Finally draw a half-transparent rect under the mouse cursor. </p>
178<div class="fragment"><pre class="fragment"> core::position2d&lt;s32&gt; m = device-&gt;getCursorControl()-&gt;getPosition();
179 driver-&gt;draw2DRectangle(video::SColor(100,255,255,255),
180 core::rect&lt;s32&gt;(m.X-20, m.Y-20, m.X+20, m.Y+20));
181
182 driver-&gt;endScene();
183 }
184 }
185
186 device-&gt;drop();
187
188 <span class="keywordflow">return</span> 0;
189}
190</pre></div><p>That's all. I hope it was not too difficult. </p>
191</div></div>
192</div>
193 <div id="nav-path" class="navpath">
194 <ul>
195<!-- window showing the filter options -->
196<div id="MSearchSelectWindow"
197 onmouseover="return searchBox.OnSearchSelectShow()"
198 onmouseout="return searchBox.OnSearchSelectHide()"
199 onkeydown="return searchBox.OnSearchSelectKey(event)">
200<a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(0)"><span class="SelectionMark">&#160;</span>All</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(1)"><span class="SelectionMark">&#160;</span>Classes</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(2)"><span class="SelectionMark">&#160;</span>Namespaces</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(3)"><span class="SelectionMark">&#160;</span>Files</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(4)"><span class="SelectionMark">&#160;</span>Functions</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(5)"><span class="SelectionMark">&#160;</span>Variables</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(6)"><span class="SelectionMark">&#160;</span>Typedefs</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(7)"><span class="SelectionMark">&#160;</span>Enumerations</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(8)"><span class="SelectionMark">&#160;</span>Enumerator</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(9)"><span class="SelectionMark">&#160;</span>Friends</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(10)"><span class="SelectionMark">&#160;</span>Defines</a></div>
201
202<!-- iframe showing the search results (closed by default) -->
203<div id="MSearchResultsWindow">
204<iframe src="javascript:void(0)" frameborder="0"
205 name="MSearchResults" id="MSearchResults">
206</iframe>
207</div>
208
209
210 <li class="footer">
211<a href="http://irrlicht.sourceforge.net" target="_blank">Irrlicht
212Engine</a> Documentation &copy; 2003-2012 by Nikolaus Gebhardt. Generated on Sun Nov 17 2013 20:18:41 for Irrlicht 3D Engine by
213<a href="http://www.doxygen.org/index.html" target="_blank">Doxygen</a> 1.7.5.1 </li>
214 </ul>
215 </div>
216
217
218</body>
219</html>
generated by cgit v1.1 at 2024-06-27 09:09:26 +0000