java
/
jMonkeyEngine-wiki
mirror of https://github.com/jMonkeyEngine/wiki.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
							<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge"><![endif]--><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="generator" content="Asciidoctor 1.5.4"><meta name="keywords" content="documentation, effect, light, water"><title>jME3 Special Effects Overview</title><link rel="stylesheet" href="./asciidoctor.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="./coderay-asciidoctor.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css"><link rel="stylesheet" href="/home/travis/build/jMonkeyEngine/wiki/build/asciidoc/html5/jme3/advanced/twemoji-awesome.css"></head><body class="article toc2 toc-left"><div id="header"><div id="toolbar"><a href="https://github.com/jMonkeyEngine/wiki/edit/master/src/docs/asciidoc/jme3/advanced/effects_overview.adoc"><i class="fa fa-pencil-square" aria-hidden="true"></i></a><a href="https://github.com/jMonkeyEngine/wiki/new/master/src/docs/asciidoc/jme3/advanced/"><i class="fa fa-plus-square" aria-hidden="true"></i></a><input dir="auto" style="position: relative; vertical-align: top;" spellcheck="false" autocomplete="off" class="searchbox__input aa-input" id="doc-search" name="search" placeholder="Search in the doc" required="required" type="search"></div><h1>jME3 Special Effects Overview</h1><div class="details"><span class="author" id="author"></span><br><span id="revnumber">version ,</span> <span id="revdate">2016/03/17 20:48</span></div><div id="toc" class="toc2"><div id="toctitle">Table of Contents</div><ul class="sectlevel1"><li><a href="#sample-code">Sample Code</a><ul class="sectlevel2"><li><a href="#particle-emitter">Particle Emitter</a></li><li><a href="#scene-processor">Scene Processor</a></li><li><a href="#post-processor-filter">Post-Processor Filter</a></li></ul></li><li><a href="#water">Water</a></li><li><a href="#environment-effects">Environment Effects</a><ul class="sectlevel2"><li><a href="#depth-of-field-blur">Depth of Field Blur</a></li><li><a href="#fog">Fog</a></li><li><a href="#light-scattering">Light Scattering</a></li><li><a href="#vegetation">Vegetation</a></li></ul></li><li><a href="#light-and-shadows">Light and Shadows</a><ul class="sectlevel2"><li><a href="#bloom-and-glow">Bloom and Glow</a></li><li><a href="#light">Light</a></li><li><a href="#shadow">Shadow</a></li></ul></li><li><a href="#special-glass-metal-dissolve-toon">Special: Glass, Metal, Dissolve, Toon</a><ul class="sectlevel2"><li><a href="#toon-effect">Toon Effect</a></li><li><a href="#fade-in-fade-out">Fade in / Fade out</a></li><li><a href="#user-contributed">User Contributed</a></li></ul></li><li><a href="#particle-emitters-explosions-fire-smoke">Particle Emitters: Explosions, Fire, Smoke</a><ul class="sectlevel2"><li><a href="#creating-your-own-filters">Creating your own Filters</a></li></ul></li></ul></div></div><div id="content"><div id="preamble"><div class="sectionbody"><div class="paragraph"><p>jME3 supports several types of special effects: Post-Processor Filters, SceneProcessors, and Particle Emitters (also known as particle systems). This list contains screenshots and links to sample code that demonstrates how to add the effect to a scene.</p></div></div></div>
<div class="sect2"><h3 id="sample-code">Sample Code</h3><div class="ulist"><ul><li><p>There is one <code>com.jme3.effect.ParticleEmitter</code> class for all Particle Systems.</p></li><li><p>There is one <code>com.jme3.post.FilterPostProcessor</code> class and several <code>com.jme3.post.filters.</code> (all Filters have <code>Filter</code> in their names).</p></li><li><p>There are several <code>SceneProcessor</code> classes in various packages, including e.g. <code>com.jme3.shadow.</code> and <code>com.jme3.water.</code> (SceneProcessor have <code>Processor</code> or <code>Renderer</code> in their names).</p></li></ul></div>
<div class="sect2"><h3 id="particle-emitter">Particle Emitter</h3><div class="listingblock"><div class="content"><pre class="CodeRay highlight"><code data-lang="java"><span class="directive">public</span> <span class="type">class</span> <span class="class">MyGame</span> <span class="directive">extends</span> SimpleApplication {
  <span class="directive">public</span> <span class="type">void</span> simpleInitApp() {
    ParticleEmitter pm = <span class="keyword">new</span> ParticleEmitter(<span class="string"><span class="delimiter">&quot;</span><span class="content">my particle effect</span><span class="delimiter">&quot;</span></span>, <span class="predefined-type">Type</span>.Triangle, <span class="integer">60</span>);
    Material pmMat = <span class="keyword">new</span> Material(assetManager, <span class="string"><span class="delimiter">&quot;</span><span class="content">Common/MatDefs/Misc/Particle.j3md</span><span class="delimiter">&quot;</span></span>);
    pmMat.setTexture(<span class="string"><span class="delimiter">&quot;</span><span class="content">Texture</span><span class="delimiter">&quot;</span></span>, assetManager.loadTexture(<span class="string"><span class="delimiter">&quot;</span><span class="content">Effects/spark.png</span><span class="delimiter">&quot;</span></span>));
    pm.setMaterial(pmMat);
    pm.setImagesX(<span class="integer">1</span>);
    pm.setImagesY(<span class="integer">1</span>);
    rootNode.attachChild(pm); <span class="comment">// attach one or more emitters to any node</span>
  }
}</code></pre></div></div></div>
<div class="sect2"><h3 id="scene-processor">Scene Processor</h3><div class="listingblock"><div class="content"><pre class="CodeRay highlight"><code data-lang="java"><span class="directive">public</span> <span class="type">class</span> <span class="class">MyGame</span> <span class="directive">extends</span> SimpleApplication {
    <span class="directive">private</span> BasicShadowRenderer bsr;

    <span class="directive">public</span> <span class="type">void</span> simpleInitApp() {
        bsr = <span class="keyword">new</span> BasicShadowRenderer(assetManager, <span class="integer">1024</span>);
        bsr.setDirection(<span class="keyword">new</span> Vector3f(<span class="float">.3f</span>, -<span class="float">0.5f</span>, -<span class="float">0.5f</span>));
        viewPort.addProcessor(bsr); <span class="comment">// add one or more sceneprocessor to viewport</span>
    }</code></pre></div></div></div>
<div class="sect2"><h3 id="post-processor-filter">Post-Processor Filter</h3><div class="listingblock"><div class="content"><pre class="CodeRay highlight"><code data-lang="java"><span class="directive">public</span> <span class="type">class</span> <span class="class">MyGame</span> <span class="directive">extends</span> SimpleApplication {
    <span class="directive">private</span> FilterPostProcessor fpp; <span class="comment">// one FilterPostProcessor per app</span>
    <span class="directive">private</span> SomeFilter sf;           <span class="comment">// one or more Filters per app</span>

    <span class="directive">public</span> <span class="type">void</span> simpleInitApp() {
        fpp = <span class="keyword">new</span> FilterPostProcessor(assetManager);
        viewPort.addProcessor(fpp); <span class="comment">// add one FilterPostProcessor to viewPort</span>

        sf = <span class="keyword">new</span> SomeFilter();
        fpp.addFilter(sf);  <span class="comment">// add one or more Filters to FilterPostProcessor</span>
    }</code></pre></div></div></div></div>
<div class="sect1"><h2 id="water">Water</h2><div class="sectionbody"><div class="openblock float-group"><div class="content"><div class="paragraph right text-left"><p><span class="image"><img src="../../jme3/advanced/water-post.png" alt="water-post.png" width="150" height="100"></span><br>
<span class="image"><img src="../../jme3/advanced/water.png" alt="water.png" width="150" height="100"></span></p></div>
<div class="paragraph"><p>The jMonkeyEngine&#8217;s <a href="../../jme3/advanced/water.html">&#8220;SeaMonkey WaterFilter&#8221;</a> simulates ocean waves, foam, including cool underwater caustics.<br>
Use the SimpleWaterProcessor (SceneProcessor) for small, limited bodies of water, such as puddles, drinking troughs, pools, fountains.</p></div>
<div class="paragraph"><p>See also:</p></div>
<div class="ulist"><ul><li><p><a href="https://hub.jmonkeyengine.org/t/monkeys-at-the-beach/15000">Rendering Water as Post-Process Effect</a> announcement with video.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/water/TestSceneWater.java">TestSceneWater.java</a> – SimpleWaterProcessor. (SceneProcessor)</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/water/TestSimpleWater.java">TestSimpleWater.java</a> – SimpleWaterProcessor. (SceneProcessor)</p></li></ul></div></div></div>
<div class="openblock float-group"><div class="content"><div class="paragraph right"><p><span class="image"><img src="../../jme3/advanced/water-reflection-muddy.png" alt="water-reflection-muddy.png" width="150" height="100"></span><br>
<span class="image"><img src="../../jme3/advanced/underwater2.jpg" alt="underwater2.jpg" width="150" height="100"></span></p></div>
<div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/water/TestPostWater.java">TestPostWater.java</a> – WaterFilter.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/water/TestPostWaterLake.java">TestPostWaterLake.java</a> – WaterFilter.</p></li></ul></div></div></div></div></div>
<div class="sect2"><h3 id="environment-effects">Environment Effects</h3><div class="sect2"><h3 id="depth-of-field-blur">Depth of Field Blur</h3><div class="paragraph right"><p><span class="image"><img src="../../jme3/advanced/dof-blur.png" alt="dof-blur.png" width="150" height="100"></span><br>
<span class="image"><img src="../../jme3/advanced/light-scattering-filter.png" alt="light-scattering-filter.png" width="150" height="100"></span></p></div>
<div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestDepthOfField.java">TestDepthOfField.java</a> – DepthOfFieldFilter.</p></li></ul></div></div>
<div class="sect2"><h3 id="fog">Fog</h3><div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestFog.java">TestFog.java</a> – FogFilter.</p></li></ul></div></div>
<div class="sect2"><h3 id="light-scattering">Light Scattering</h3><div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestLightScattering.java">TestLightScattering.java</a> – LightScatteringFilter.</p></li></ul></div></div>
<div class="sect2"><h3 id="vegetation">Vegetation</h3><div class="ulist"><ul><li><p>Contribution: <a href="../../jme3/contributions/vegetationsystem/grass.html">Grass System</a></p></li><li><p>Contribution: <a href="https://hub.jmonkeyengine.org/t/generating-vegetation-paged-geometry-style/18928">Trees (WIP)</a></p></li></ul></div></div></div>
<div class="sect2"><h3 id="light-and-shadows">Light and Shadows</h3><div class="sect2"><h3 id="bloom-and-glow">Bloom and Glow</h3><div class="paragraph right"><p><span class="image"><img src="../../jme3/advanced/tanlglow1.png" alt="tanlglow1.png" width="150" height="100"></span><br>
<span class="image"><img src="../../jme3/advanced/shadow-sponza-ssao.png" alt="shadow-sponza-ssao.png" width="150" height="100"></span></p></div>
<div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestBloom.java">TestBloom.java</a></p></li><li><p>More details: <a href="../../jme3/advanced/bloom_and_glow.html">Bloom and Glow</a> – BloomFilter.</p></li></ul></div></div>
<div class="sect2"><h3 id="light">Light</h3><div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/light/TestSimpleLighting.java">TestSimpleLighting.java</a> – DirectionalLight, PointLight.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/light/TestLightRadius.java">TestLightRadius.java</a> – DirectionalLight, PointLight.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/light/TestManyLights.java">TestManyLights.java</a> – .j3o scene.</p></li><li><p>More details: <a href="../../jme3/advanced/light_and_shadow.html">Light and Shadow</a></p></li></ul></div></div>
<div class="sect2"><h3 id="shadow">Shadow</h3><div class="paragraph right"><p><span class="image"><img src="../../jme3/advanced/shadow.png" alt="shadow.png" width="150" height="100"></span><br>
<span class="image"><img src="../../jme3/advanced/light-sources.png" alt="light-sources.png" width="150" height="100"></span></p></div>
<div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/light/TestShadow.java">TestShadow.java</a> – BasicShadowRenderer. (SceneProcessor)</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/light/TestPssmShadow.java">TestPssmShadow.java</a> – PssmShadowRenderer (SceneProcessor), also known as Parallel-Split Shadow Mapping (PSSM).</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestSSAO.java">TestSSAO.java</a><br>
<a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestSSAO2.java">TestSSAO2.java</a> – SSAOFilter, also known as Screen-Space Ambient Occlusion shadows (SSOA).</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestTransparentSSAO.java">TestTransparentSSAO.java</a> – SSAOFilter, also known as Screen-Space Ambient Occlusion shadows (SSOA), plus transparancy.</p></li><li><p>More details: <a href="../../jme3/advanced/light_and_shadow.html">Light and Shadow</a></p></li></ul></div></div></div>
<div class="sect2"><h3 id="special-glass-metal-dissolve-toon">Special: Glass, Metal, Dissolve, Toon</h3><div class="sect2"><h3 id="toon-effect">Toon Effect</h3><div class="imageblock right"><div class="content"><img src="../../jme3/advanced/toon-dino.png" alt="toon-dino.png" width="150" height="100"></div></div>
<div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestCartoonEdge.java">TestCartoonEdge.java</a> – CartoonEdgeFilter.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/post/TestTransparentCartoonEdge.java">TestTransparentCartoonEdge.java</a> – CartoonEdgeFilter.</p></li></ul></div></div>
<div class="sect2"><h3 id="fade-in-fade-out">Fade in / Fade out</h3><div class="ulist"><ul><li><p><a href="../../jme3/advanced/fade.html">Fade</a> – FadeFilter</p></li></ul></div></div>
<div class="sect2"><h3 id="user-contributed">User Contributed</h3><div class="openblock float-group"><div class="content"><div class="paragraph right"><p><span class="image"><img src="../../jme3/advanced/shaderblow_light1.jpg" alt="shaderblow_light1.jpg" width="78" height="150"></span><br>
<span class="image"><img src="../../jme3/advanced/shaderblow_glass.jpg" alt="shaderblow_glass.jpg" width="80" height="150"></span><br>
<span class="image"><img src="../../jme3/advanced/shaderblow_matcap.jpg" alt="shaderblow_matcap.jpg" width="150" height="150"></span><br>
<span class="image"><img src="../../jme3/advanced/shaderblow_light2.jpg" alt="shaderblow_light2.jpg" width="66" height="150"></span></p></div>
<div class="paragraph"><p><a href="../../sdk/plugin/shaderblow.html">ShaderBlow - GLSL Shader Library</a></p></div>
<div class="ulist"><ul><li><p>LightBlow Shader – blend material texture maps.</p></li><li><p>FakeParticleBlow Shader – jet, fire effect.</p></li><li><p>ToonBlow Shader – Toon Shading, toon edges.</p></li><li><p>Dissolve Shader – Scifi teleportation/dissolve effect.</p></li><li><p>MatCap Shader – Gold, metals, glass, toons…!</p></li><li><p>Glass Shader – Glass.</p></li><li><p>Force Shield Shader – Scifi impact-on-force-field effect.</p></li><li><p>SimpleSprite Shader – Animated textures.</p></li><li><p>SimpleSpriteParticle Shader – Sprite library.</p></li><li><p>MovingTexture Shader – Animated cloud/mist texture.</p></li><li><p>SoftParticles Shader – Fire, clouds, smoke etc.</p></li><li><p>Displace Shader – Deformation effect: Ripple, wave, pulse, swell!</p></li></ul></div>
<div class="paragraph"><p>Thanks for your awesome contributions! Keep them coming!</p></div></div></div></div></div>
<div class="sect2"><h3 id="particle-emitters-explosions-fire-smoke">Particle Emitters: Explosions, Fire, Smoke</h3><div class="paragraph right"><p><span class="image"><img src="../../jme3/advanced/explosion-5.png" alt="explosion-5.png" width="150" height="100"></span><br>
<span class="image"><img src="../../jme3/advanced/particle.png" alt="particle.png" width="150" height="100"></span></p></div>
<div class="paragraph"><p><a href="../../jme3/advanced/particle_emitters.html">Particle emitter effects</a> are highly configurable and can have any texture. They can simulate smoke, dust, leaves, meteors, snowflakes, mosquitos, fire, explosions, clusters, embers, sparks…</p></div>
<div class="ulist"><ul><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/effect/TestExplosionEffect.java">TestExplosionEffect.java</a> – debris, flame, flash, shockwave, smoke, sparks.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/effect/TestPointSprite.java">TestPointSprite.java</a> – cluster of points.</p></li><li><p><a href="https://github.com/jMonkeyEngine/jmonkeyengine/tree/master/jme3-examples/src/main/java/jme3test/effect/TestMovingParticle.java">TestMovingParticle.java</a> – dust, smoke.</p></li></ul></div>
<hr>
<div class="sect2"><h3 id="creating-your-own-filters">Creating your own Filters</h3><div class="paragraph"><p>Here is an extract taken from @nehon in the forum thread (<a href="https://hub.jmonkeyengine.org/t/how-exactly-do-filters-work/26871">http://hub.jmonkeyengine.org/forum/topic/how-exactly-do-filters-work/</a>)</p></div>
<div class="paragraph"><p>The methods are called in this order (pretty much the same flow as processors):
- initFilter() is called once when the FilterPostPorcessor is initialized or when the filter is added to the processor and this one as already been initialized.</p></div>
<div class="paragraph"><p>for each frame the methods are called in that sequence :
- preFrame() occurs before anything happens
- postQueue() occcurs once the queues have been populated (there is one queue per bucket and 2 additional queues for the shadows, casters and recievers). Note that geometries in the queues are the one in the view frustum.
- postFrame occurs once the main frame has been rendered (the back buffer)</p></div>
<div class="paragraph"><p>Those methods are optional in a filter, they are only there if you want to hook in the rendering process.</p></div>
<div class="paragraph"><p>The material variable is here for convenience. You have a getMaterial method that returns the material that’s gonna be used to render the full screen quad. It just happened that in every implementation I had a material attribute in all my sub-classes, so I just put it back in the abstract class. Most of the time getMaterial returns this attribute.</p></div>
<div class="paragraph"><p>Forced-technique can be any technique really, they are more related with the material system than to the filters but anyway. When you use a forced technique the renderer tries to select it on the material of each geometry, if the technique does not exists for the material the geometry is not rendered.
You assume well about the SSAO filer, the normal of the scene are rendered to a texture in a pre pass.</p></div>
<div class="paragraph"><p>Passes : these are filters in filters in a way. First they are a convenient way to initialize a FrameBuffer and the associated textures it needs, then you can use them for what ever you want.
For example, a Pass can be (as in the SSAO filter) an extra render of the scene with a forced technique, and you have to handle the render yourself in the postQueue method.
It can be a post pass to do after the main filter has been rendered to screen (for example an additional blur pass used in SSAO again). You have a list of passes called postRenderPass in the Filter abstract class. If you add a pass to this list, it’ll be automatically rendered by the FilterPostProcessor during the filter chain.</p></div>
<div class="paragraph"><p>The bloom Filter does an intensive use of passes.</p></div>
<div class="paragraph"><p>Filters in a nutshell.</p></div>
<hr>
<div class="paragraph"><p>See also:</p></div>
<div class="ulist"><ul><li><p><a href="../../jme3/advanced/particle_emitters.html">Particle Emitters</a></p></li><li><p><a href="../../jme3/advanced/bloom_and_glow.html">Bloom and Glow</a></p></li><li><p><a href="http://www.smashingmagazine.com/2008/08/07/50-photoshop-tutorials-for-sky-and-space-effects/">Photoshop Tutorial for Sky and space effects (article)</a></p></li></ul></div></div></div></div><div id="footer"><div id="footer-text">Version <br>Last updated 2019-12-20 23:30:51 +00:00</div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script><script>docsearch({
  apiKey: 'a736b6d93de805e26ec2f49b55013fbd',
  indexName: 'jmonkeyengine',
  inputSelector: '#doc-search',
  debug: false // Set debug to true if you want to inspect the dropdown
});</script></body></html>