ParticleEffectForUGUI === This plugin provide a component to render particle effect for uGUI in Unity 2018.2+. The particle rendering is maskable and sortable, without Camera, RenderTexture or Canvas. [![](https://img.shields.io/github/release/mob-sakai/ParticleEffectForUGUI.svg?label=latest%20version)](https://github.com/mob-sakai/ParticleEffectForUGUI/releases) [![](https://img.shields.io/github/release-date/mob-sakai/ParticleEffectForUGUI.svg)](https://github.com/mob-sakai/ParticleEffectForUGUI/releases) ![](https://img.shields.io/badge/requirement-Unity%202018.2%2B-green.svg) [![](https://img.shields.io/github/license/mob-sakai/ParticleEffectForUGUI.svg)](https://github.com/mob-sakai/ParticleEffectForUGUI/blob/upm/LICENSE.md) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-orange.svg)](http://makeapullrequest.com) [![](https://img.shields.io/twitter/follow/mob_sakai.svg?label=Follow&style=social)](https://twitter.com/intent/follow?screen_name=mob_sakai) << [Description](#Description) | [WebGL Demo](#demo) | [Download](https://github.com/mob-sakai/ParticleEffectForUGUI/releases) | [Usage](#usage) | [Development Note](#development-note) | [Change log](https://github.com/mob-sakai/ParticleEffectForUGUI/blob/upm/CHANGELOG.md) >> ### What's new? Please see [See changelog ![](https://img.shields.io/github/release-date/mob-sakai/ParticleEffectForUGUI.svg?label=last%20updated)](https://github.com/mob-sakai/ParticleEffectForUGUI/blob/upm/CHANGELOG.md) ### Do you want to receive notifications for new releases? [Watch this repo ![](https://img.shields.io/github/watchers/mob-sakai/ParticleEffectForUGUI.svg?style=social&label=Watch)](https://github.com/mob-sakai/ParticleEffectForUGUI/subscription) ### Support me on Patreon! [![become_a_patron](https://user-images.githubusercontent.com/12690315/50731629-3b18b480-11ad-11e9-8fad-4b13f27969c1.png)](https://www.patreon.com/join/2343451?)



## Description ![](https://user-images.githubusercontent.com/12690315/41771577-8da4b968-7650-11e8-9524-cd162c422d9d.gif) This plugin uses new APIs `MeshBake/MashTrailBake` (added with Unity 2018.2) to render particles by CanvasRenderer. You can mask and sort particles for uGUI without Camera, RenderTexture, Canvas. Compares this "Baking mesh" approach with the conventional approach: (This scene is included in the package.) |Approach|Good|Bad|Screenshot| |-|-|-|-| |Baking mesh
**\(UIParticle\)**|Rendered as is.
Maskable.
Sortable.
Less objects.|**Requires Unity 2018.2+.**
Requires UI shaders to use Mask.|| |Do nothing|Rendered as is.|**Looks like a glitch.**
Not maskable.
Not sortable.|| |Convert particle to UIVertex
[\(UIParticleSystem\)](https://forum.unity.com/threads/free-script-particle-systems-in-ui-screen-space-overlay.406862/)|Maskable.
Sortable.
Less objects.|**Adjustment is difficult.**
Requires UI shaders.
Difficult to adjust scale.
Force hierarchy scalling.
Simulation results are incorrect.
Trail, rotation of transform, time scaling are not supported.
Generate heavy GC every frame.|| |Use Canvas to sort|Rendered as is.
Sortable.|**You must to manage sorting orders.**
Not maskable.
More batches.|| |Use RenderTexture|Maskable.
Sortable.|**Requires Camera and RenderTexture.**
Difficult to adjust position and size.
Quality depends on the RenderTexture's setting.|| #### Features * Sort particle effects with uGUI * No Camera, RenderTexture or Canvas are required * Masking with Mask or RectMask2D * Easy to use * Support Trail module * Change alpha with CanvasGroup * Scaling independent of Transform * No heavy allocation every frame * All ParticleSystem.ScalingModes and all Canvas.RenderModes are supported. They look almost the same in all modes. ![](https://user-images.githubusercontent.com/12690315/49866926-6c22f500-fe4c-11e8-8393-d5a546e9e2d3.gif) * Scaled gizmo ![](https://user-images.githubusercontent.com/12690315/50343861-f31e4e80-056b-11e9-8f60-8bd0a8ff7adb.gif)



## Demo [WebGL Demo](http://mob-sakai.github.io/ParticleEffectForUGUI)



## Install #### Using UnityPackageManager (for Unity 2018.3+) Find the manifest.json file in the Packages folder of your project and edit it to look like this: ```js { "dependencies": { "com.coffee.ui-particle": "https://github.com/mob-sakai/ParticleEffectForUGUI.git#2.0.0", ... }, } ``` To update the package, change `#2.0.0` to the target version. #### Using .unitypackage file (for Unity 2018.2+) Download `*.unitypackage` from [Releases](https://github.com/mob-sakai/ParticleEffectForUGUI/releases) and import the package into your Unity project. Select `Assets > Import Package > Custom Package` from the menu. ![](https://user-images.githubusercontent.com/12690315/46570979-edbb5a00-c9a7-11e8-845d-c5ee279effec.png)



## How to play demo * Import `UIParticle_Demo.unitypackage` into your project. * The demo unitypackage exists in `Assets/Assets/Coffee/UIExtensions/UIParticle` or `Packages/UI Particle`. * Open UIParticle_Demo scene and play it.



## Usage 1. Add your particle effect to canvas. 2. (Option) If you want to mask particles, set a UI shader such as "UI/UIAdditive" to material for ParticleSystem. ![](https://user-images.githubusercontent.com/12690315/42674022-134e3a40-86a9-11e8-8f44-a110d2f14185.gif) 3. Add `UIParticle` component to root particle system of your effect from `Add Component` in inspector. ![](https://user-images.githubusercontent.com/12690315/41772125-5aca69c8-7652-11e8-8442-21f6015069a1.png) 4. If your effect consists of multiple ParticleSystems, click "Fix". ![](https://user-images.githubusercontent.com/12690315/49148942-1c243880-f34c-11e8-9cf5-d871d65c4dbe.png) 5. Adjust the Scale property to change the size of the effect. ![](https://user-images.githubusercontent.com/12690315/49148937-19c1de80-f34c-11e8-87fc-138192777540.gif) 6. Enjoy! ##### Requirement * Unity 2018.2+ (Tested in Unity 2018.2.0f2) * No other SDK are required



## Development Note



## License * MIT * © UTJ/UCL ## Author [mob-sakai](https://github.com/mob-sakai) [![](https://img.shields.io/twitter/follow/mob_sakai.svg?label=Follow&style=social)](https://twitter.com/intent/follow?screen_name=mob_sakai) [![become_a_patron](https://user-images.githubusercontent.com/12690315/50731629-3b18b480-11ad-11e9-8fad-4b13f27969c1.png)](https://www.patreon.com/join/2343451?) ## See Also * GitHub page : https://github.com/mob-sakai/ParticleEffectForUGUI * Releases : https://github.com/mob-sakai/ParticleEffectForUGUI/releases * Issue tracker : https://github.com/mob-sakai/ParticleEffectForUGUI/issues * Current project : https://github.com/mob-sakai/ParticleEffectForUGUI/projects/1 * Change log : https://github.com/mob-sakai/ParticleEffectForUGUI/blob/upm/CHANGELOG.md