GUI [Released] Advanced Procedural UI Generation! Create, modify, animate UI, even at runtime

This asset seems to have a lot of issues I keep running into. Issues I don't have with the older Procedural Image asset which this is obviously very similar to.

A new issue I just ran into is that the corner radius properties get all whacked out when the element is scaled, or at least when it's parent is scaled. The old ProcImage works fine. Here is a screenshot with Proc Image on top and this one on the bottom, both with the same settings (only difference here is proc image can't do borders, which is a nice feature of this asset). They both start the same then as soon as the parent control is scaled , the shape make by MPImage goes all crazy!

 

I'm assuming this an abandoned asset. Is that correct?

 

Last release was october so it doesn't seem like it

 

Coo, thank you for the info

 

Hi, I am actively working on improvements and bug fixes.

 

Does your asset work on WebGL?

 

Hi, new purchase for me, nice asset - looking forward to seeing your next release Isfaq!

 

Hi, I'm liking the asset overall, thanks. I can change the outline color in code but I can't seem to find what controls the stroke color? Is it part of the material that's used? How would I go about it?

 

Just a quick question:
Are those shapes working correctly with the GraphicRaycaster alpha hittesting ? Correct would mean that the GraphicsRaycaster does not register a hit in transparent areas ( aplha = 0 ) of the shapes ...
Most other UI shape packages i verified till now all register a hit on the full rect shape, and are not ignoring alpha=0 in their hittest...

 

Hi,
I just started using MPUI and realized that the outline color does not match the color I define in the inspector.
In the image below, the

Graphic.color

and the

MPImageBasic.OutlineColor

are the same values but the outline is very different when rendered.

Is this a known issue and is there a fix for it?

 

Yo mate, I'm afraid the developer is MIA for his assets, and the issues have never been fixed. The color difference is probably due to the color space being set to linear in your project settings. The developer was notified of this a few posts ago, but it was never attended to sadly.

 

Thanks for pointing out, @Klausology

I found a previous post by the dev:

If I understand this correctly, the outline color should not be in the vertex stream anymore but a separate shader property.
This is not the case in the shader I imported from the asset store:

Code (CSharp):

1. half4 outlineColor = v.tangent;

Maybe the latest version doesn't have the mentioned updated?

 

Hi, Sorry it took me a long time to figure out how to fix the colorspace conversion issue without making the outline color a shader property. It has the be sent through the vertex stream because otherwise, I can not optimize the drawcalls internally(the main reason MPImageBasic component was made). This is the case for MPImage component where these things are material properties, so the drawcalls need to be managed manually by using shared material.

The solution is before sending the outline color to the vertex stream, it needs to be converted based on the active colorspace.

Code (CSharp):

1. // MPImageBasic.cs line 286
2. stream.Tangent = QualitySettings.activeColorSpace == ColorSpace.Linear? m_OutlineColor.linear : m_OutlineColor;

It will be available in the next update along with few other bug fixes such.

 

Heya! Having a strange issue with MPImage. Trying to make our game more performant and was converting things to having a shared material. Using a rectangle shape and needed to give it some rounded corners on specific edges. But every time at runtime it just resets them back to zero!

Have any idea of what could be causing this?

 

It sounds like a bug that I fixed on an earlier version. Are you using the latest version?

 

Hello, I think that there is a similar problem with color space conversion at GradientEffect. Everything is going fine if you use Corner gradient type where Color type properties are used (CornerGradientColorN). But the color of Linear/Radial gradients are incorrect due to its manual setting via Vector4 GradientColorN properties.

I've checked that changing GradientColorN property to Color type in shader properties block fixes the issue.

I'm using v0.99.6

 

Hi, I am liking the asset so far however I can't seem to find a way to progromatically change the fill amount, is this a limitation or is there some way of doing it through the code?

I have looked through the docs and it has no reference to the Fill params just the Fill type.

If anyone has any insight into the I would be greatly appreciated.

Thanks all.

 

HI.
I have a serious problem now.

This asset is a really good asset and I actively used it in my project development. UI production time has been drastically reduced.
However, when I built the project, I found that 'Stroke' was not expressed. I tried to build with various setups, but I couldn't find a solution. I'm debating if I should delete this asset and go back to the UGUI default image.
This asset has not been updated since October of last year. When will an update that addresses these issues be available? I'm also a dumbass doing build tests just a few weeks away from launch, but I'm very serious and don't have time. If the update is difficult, please tell me how to fix it.

 

Yup! Very latest. Using Unity 2021.3.0f1

 

You are right. Using SetVector instead of SetColor was a bad idea. Apparently, SetColor internally does all the colorspace conversion before sending the values to the shader.

 

You can change the fill amount exactly how you would do it for an Image. I will add this to the doc.

Code (CSharp):

1. GetComponent<MPImage>().fillAmount = 0.5f;

 

Hi, Sorry about this issue. I am checking this right now. I hope to solve your issue in a few days.

 

Is there any way to disable any kind of initialization or memory consumption in dedicated headless server builds? Like a prefab that has a hud that is disabled anyway server/wise but it still creates memory allocations on awake anyway.

 

Asset was on its way to success, but the author seems to have scored.

In all seriousness. It definitely needs improvement. It's one of the best interface builders out there, and since it doesn't get updates, new users don't trust it.
Maybe hire someone if you don't have the time? It's a shame to give up a job like this.

 

I need a button in the shape of a trapezoid. How can I do it?

 

I have solved the above problem.
I don't know exactly why it was fixed. I gave up and upgraded the Unity version to 2021.3.2f1, and that problem was solved. (previously 2021.2.11)

However, not all issues with this asset are resolved.
The biggest issue that is bothering me right now is the material issue in assets.
To manage draw calls, you are forced to create and apply each material. However, the value of the material changes from time to time.(I'm thinking it's probably a conflict with the Unity prefab system.)
For example, create a rectangle with a border value of 20 and create a new material. After that, the same material is registered in the other rectangle with the same conditions and then saved. But when I open it again later, the border value is changed to 0, 25, or 145, which is ridiculous.

The marked part of the image is where I set the border value of the rectangle to 0,20,0,20. However, when I look again today, it is also returned to 0,0,0,0.

After that, even if I manually modify the value and enter it, an error occurs over and over again. I keep saving the error as a new value. And edit the figures in the material document again. Then, someday, the value will be fixed. But I can't quite figure out the rules as to why the problem arises and why it solves the problem.
I'm working on a team with 2-3 people and this issue is driving me crazy.

Every day I turn on Unity, I check for updates to this asset.
Again, this asset has not been updated since last year. It is a very useful asset that shortens the UI work time and raises the quality, but applying it to a live project is too many problems in use.
Please prepare an update quickly.
Otherwise, please give up the asset so that people who use it can use another asset or the default UGUI.

 

Hey, I've begun using this (had it for a long time) because I needed a simple SDF based UI and so far I'm really liking it.

However: I'd really like to use this on normal (3D, non-canvas, non-RectTransform) sprite renderers as well (potentially with fog, but not lit). What are the first steps I'd need to take it?

I'd be ok if my sprites are still parallel to the camera plane, they just need to be in world space and in specific render queues.

Is that feature you once considered adding and somehow didn't?

 

MPUIKIt v1.0.0 is now available for download. I am sorry to keep you guys waiting for so long. There were a few things that took too long for me to figure out and fix. Most importantly the scaling issue of MPImageBasic.

 

Cheers! Thanks for coming back to us) Very much I count on the development of this tool.
Could you add moving corners in the rectangle to make buttons with non-standard shapes? I really need trapezoids, or better tropezoids with a spherical top and bottom deflection.

 

Hi, does it work in worldspace canvas for VR projects? Thanks!

 

your website is unnreachable... no docs...

 

"Stroke" are not stored in Prefab with LayoutGroup.

 

Hi, I just updated my project to Unity 2021.3.6f1 and found MPImage buggy under certain conditions.

1. Create a MPImage in the scene.
2. Attach a Canvas, a Raycast Target and a Button to the created MPImage.
3. Play the scene.
4. We can click this button no problem.
5. Disable the GameObject attached the MPImage and enable it again.
6. We can't click this button

I guess this is caused by a Unity regression but I don't know the details about this.

 

Hi, Stroke values are saved in prefab. But I think the problem you are facing is due to some weird behavior of the layout group. Sometimes, the layout group will set the height to 0 which is usually not noticeable as it gets changed to normal values immediately, but the stroke is reset due to that. I will try to fix it.

 

Thanks for pointing out the very specific condition. I will try to recreate it and see what's going on.

 

Hi, I haven't tested this on a VR. But I think it should work as it is just extending from unity's own Image class.

Sorry about the delayed response, I was trying to create the shape before giving you a response. Unfortunately, I haven't found an efficient way to draw this yet. I will keep looking.

 

Probably your issue is related to this and not the MPImage: https://forum.unity.com/threads/can...broken-after-upgrade-to-unity-2021-3.1308642/

 

In linear space, the gradient colors are inconsistent.

 

I'm very interested in this asset, does it theoretically work with other assets like True Shadow - UI Soft Shadow and Glow ?

EDIT:

Can confirm that both assets work together.

 

Hi, this issue has been fixed in the latest version. Can you please check if you are using the latest version of MPUIKit? The current version is 1.0.0

 

Guys, have you managed to make the Gradient Animation working?
I have tried multiple times, but no luck.
I am using version 1.0.0 and Unity 2020.3.38f1.

On the docs, it shows the following example:

Code (CSharp):

1. MPImage image = GetComponent<MPImage>();
2. GradientEffect gradientEffect = image.GradientEffect;
3. // For Corner Gradient
4. Dotween.To(   //Animating just the first corner color of the gradient
5.         ()=>gradientEffect.CornerGradientColors[0],
6.         value => gradientEffect.CornerGradientColors[0] = value,
7.         Color.red,
8.         m_AnimationDuration)
9.     .OnUpdate(()=>image.GradientEffect = gradientEffect)
10.     .SetEase(Ease.InSine);
11. // For Linear/Radial Gradient
12. Gradient gradient = gradientEffect.Gradient;
13. GradientColorKey[] colorKeys = gradient.colorKeys;
14. GradientAlphaKey[] alphaKeys = gradient.alphaKeys;
15. DoTween.To(   // Animating Just the first color key of the gradient
16.         () => colorKeys[0],
17.         value => colorKeys[0] = value,
18.         Color.red,
19.         m_AnimationDuration)
20.     .OnUpdate(()=>{
21.         gradient.SetKeys(colorKeys, alphaKeys);
22.         gradientEffect.Gradient = gradient;
23.         image.GradientEffect = gradientEffect;
24.     })
25.     .SetEase(Ease.Linear);

This is not working in my case. The following line shows error:

Code (CSharp):

1. DOTween.To(() => colorKeys[0], value => colorKeys[0] = value, _firstColor32, 0.6f);

Do you have any suggestion?

 

Sorry about the mistake here. this should be the corrected code.

Code (CSharp):

1. // For Linear/Radial Gradient
2.         Gradient gradient = gradientEffect.Gradient;
3.         GradientColorKey[] colorKeys = gradient.colorKeys;
4.         GradientAlphaKey[] alphaKeys = gradient.alphaKeys;
5.         DOTween.To(   // Animating Just the first color key of the gradient
6.                 () => colorKeys[0].color,
7.                 value => colorKeys[0].color = value,
8.                 Color.red,
9.                 m_AnimationDuration)
10.             .OnUpdate(()=>{
11.                 gradient.SetKeys(colorKeys, alphaKeys);
12.                 gradientEffect.Gradient = gradient;
13.                 _image.GradientEffect = gradientEffect;
14.             }).SetEase(Ease.Linear);

I have updated the documentation.

 

Hello! I'm profiling memory allocations now and found that UnityEngine.UI.MPUIKIT.MPImageHelper.AddQuad generating some garbage. It looks like you've forgotten to comment out that code.
So, I would recommend you to write little log helper instead of Debug.Log direct call that can be wrapped with ConditionalAttribute and can be easily striped out later by removing a define constraint.
BTW, thank you for your amazing asset and fast responds to community's feedback!

 

Hi, 'MP' components are always there in prefab overrides, Apply all override is invalid for MP components.

unity 2021.3.4

 

I am yet to figure out a solution for this. Since MPImage component runs in the editor mode (not only in playmode) to correct the corner radius values and a few other values in the inspector, it becomes dirty. It is the same problem you would face if you had a HorizontalLayoutGroup(Or any other unity layout components) in your prefab.

 

Hey, the MPImageBasic seems to still reset his stroke value to 0 in prefabs when saving and reopening the prefab

 

Ye I just changed to StrokeWidth property to check for 0 like the other properties.
OnValidate was called multiple times causing the size to recalculate with different values, sometimes 0 and negatives resetting the value to 0 constantly.

 

Hey there , I am having problems with the shared material, when I change values on one UI element it does not reflect to the other with the same material, but if I change the values on some other it does, also if I select in the hierarchy the obj with the MPImage that was supposed to change, then it updates. Any advice?

 

Hi. Performance is bad not so good as I excpected. Heavily relied on this asset, but it's drop performance very much on android device

I think it will be good to know at least difference in performance between MPImage and MPImage Basic and more easier way to switch between this "modes".

 

Looks like issue has not been fixed in the latest version. Can I get some help about that?