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


			
				
					
						
						
							12345678910111213141516171819202122
							<!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"><title>Fade-in / Fade-out Effect</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/fade.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>Fade-in / Fade-out Effect</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="#setting-up">Setting up</a></li><li><a href="#fading-in-and-out">Fading in and out</a></li></ul></div></div><div id="content"><div id="preamble"><div class="sectionbody"><div class="paragraph"><p>You can use a fade in/fade out effect to make smooth transitions, for example between game levels. The effect fades in from black to the initialized scene, or fades out from the scene to black.
The effect uses com.jme3.post.FilterPostProcessor and com.jme3.post.filters.FadeFilter.</p></div></div></div>
<div class="sect1"><h2 id="setting-up">Setting up</h2><div class="sectionbody"><div class="olist arabic"><ol class="arabic"><li><p>Create one FilterPostProcessor object per application.</p></li><li><p>Create a FadeFilter object.</p></li><li><p>Give the FadeFilter constructor the fade duration in seconds as parameter. If you use the parameter-less constructor, the duration is 1 sec by default.</p></li><li><p>Add the FadeFilter to the FilterPostProcessor.</p></li><li><p>Add the FilterPostProcessor to the default viewPort.</p></li></ol></div>
<div class="listingblock"><div class="content"><pre class="CodeRay highlight"><code data-lang="java"><span class="directive">private</span> FilterPostProcessor fpp;
<span class="directive">private</span> FadeFilter fade;
<span class="directive">public</span> <span class="type">void</span> simpleInitApp() {
  ...
  fpp = <span class="keyword">new</span> FilterPostProcessor(assetManager);
  fade = <span class="keyword">new</span> FadeFilter(<span class="integer">2</span>); <span class="comment">// e.g. 2 seconds</span>
  fpp.addFilter(fade);
  viewPort.addProcessor(fpp);
  ...
}</code></pre></div></div></div></div>
<div class="sect1"><h2 id="fading-in-and-out">Fading in and out</h2><div class="sectionbody"><div class="paragraph"><p>Now call the <code>fade.fadeIn()</code> and <code>fade.fadeOut()</code> methods to trigger the effect.
You can also change the fade duration using <code>fade.setDuration()</code>.</p></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>