Hi,
I decided to share RefreshUI with you. The system that I’m working on right now.
Before going forward I would like to let you know why this topic even exists. If you’ve been following Unity for some time you might know that it has been missing a solid UI system for a long time. There were some external systems. And then Unity released New Unity UI. To be honest, I decided that it’s the end. I thought that we finally got UI system that seamlessly integrated into Unity and perfectly works with all the features that Unity provides.
The more I worked with New Unity UI the more inconveniences I found. I don’t want to go deep into it because everything there is subjective. But at some point I decided that it’s enough. That moment RefreshUI has started. I will also try to present issues with concrete examples in this topic.
Consider checking out RefreshUI if you are not feeling completely happy with New Unity UI.
What is RefreshUI 1.0?
It is a set of core components that allows you to create any UI element or control. It is not a library of UI components that you could drag and drop into your project. You need to spend some time to create a set of components that suits your needs best. Why so? In every project there are always specific requirements for UI elements that are defined, for example, by localization system or tutorial system used. However, RefreshUI comes with a Demo (super basic screen with a button for now) that has some components implemeted and you could use those to learn and create your custom ones.
What is the difference to New Unity UI?
No Canvases
RefreshUI does not have canvases or anything that might look like it. It does not require anything to be on top of hierarchy. The only requirement is to have UIManager script somewhere in the scene. And you only need it to handle input.
No Manual Batching
RefreshUI does not try to batch things for you. It relies on Unity’s Dynamic Batching feature. It means that every element in RefreshUI has MeshRenderer and MeshFilter components. These components are created at runtime. It also allows you to optimize batching easier as you could use Frame Debugger to see exactly why certain element is not batched.
Does not depend on Hierarchy
RefreshUI does not depend on hierarchy order to render things. Every UI element is rendered as a true 3D object within scene among other objects. To control render order of transparent objects with orthographic camera you have to use transform’s Z position. Farther objects will be rendered first. For 3D UIs that use perspective camera you could additionally specify sorting layer and order the same way that SpriteRenderer does to avoid transparency sorting order issue.
No RectTransform
RefreshUI does not use RectTransform to position elements. It means that there is no layout engine in RefreshUI. If you want to position elements relative to each other you could use UIElementModify component only for those elements that really need it. Want to set element’s position? Use Transform component as for every other object in Unity. Want to set element’s size? Get UIElement and set Size property there.
No Update, No Start, No OnEnable, No LateUpdate, No Coroutines
UI elements in RefreshUI do not use per-frame update functions in any way. It means that there is no overhead on calling these functions. It is especially important if you have a very complex UI with a huge amount of elements there. Note that some of these functions are used in the Editor to provide editor functionality, but they are completely stripped from the build as they all are under UNITY_EDITOR define.
Refresh when you need (changed in version 1.0.6)
RefreshUI does not apply changes to elements immediately. Instead, refresh is scheduled and will be executed at the end of the frame. It is perfectly valid to force refresh for any element by calling Refresh on it if your code depends on the result of refresh. This approach decreases amount of branching in property setters to zero and makes code easy to read, understand and extend.
Proper Multiple Pointers Support
RefreshUI always works in multiple pointers mode. It is up to you to decide if to work with single pointer or multiple pointers. It means that you could have a world map that you could pan and zoom with two or more fingers and have buttons on top that work with single pointer. If you want to handle multiple pointers in your custom control, then use UIControl as a base. If you are making a button or want to use only one pointer, then use UISinglePointerControl as a base. Also UIManager allows you to prevent multiple clicks (taps) in the same frame. This is the issue that almost every game with multiple pointers support is suffering from. Just call CancelPointers after your click event. See DemoButton implementation for details.
Particle Systems
With RefreshUI you could use built-in Particle Systems without any tricks or hacks as UI elements are true 3D objects in the same world with particles. By the way, you might see 2D/3D particle systems for RefreshUI that scale properly soon.
Warning – Animations
Please note that due to the nature of RefreshUI it does not support animations created in Animation Window because they change serialized properties directly, and there is no way to understand what exact properties were changed. There is a workaround for this, but I do not want to implement it right now since it will force me to add a copy for every serialized property to hold “old” value. Not sure that it worth it. Remember that you could always use code-driven animations.
Additional Features
Accurate SDF Fonts Optimized for Mobiles
RefreshUI has optimized SDF fonts implementation for mobiles. It uses very simple shader, but still supports plenty of features including accurate gradient that goes correctly through all the letters. Also it has styles support and, obviously, allows you to use multiple styles in a single label. The most important thing is that it allows you to import fonts in the same size easily. It means that you could change fonts in the entire game without adjusting size or position for a single label. Very useful for localization and simplifies working with labels a lot.
2018.3
RefreshUI is designed for Unity 2018.3 and above. It is fully compatible with new nested prefabs workflow.
RefreshUI License
Please read RefreshUI-License.txt file provided with package.
Notes
RefreshUI is a WIP and will be updated from time to time. It might change a lot in the future, but the core concepts mentioned above will stay the same.
As there is no documentation or tutorials at the moment, I consider this post as a milestone that I will use to go forward. I’m going to start to work on documentation soon.
Note that package contains executable file called fmaker_x64.exe and FreeType library freetype.dll. These files belong to a tool that generates SDF font atlases and it only works on Windows. Also it contains Roboto-Regular.ttf from Google Fonts.
You could download package and use DemoScene as a starting point.
Feel free to dive into the code and investigate! Enjoy!
Konstantin Sarychev