Hi guys,
I have a query.
Is it possible to put an animated sprite on a 2D Screen like an image element. Every time I put an animated sprite as a child of the 2D Screen it renders in world space not screen space.
If I put the sprite directly on the image element it doesn’t animate, any ideas?
Cheers,
Adam
I had a quick look, it does look like using sprites as part of the UI aren’t currently working.
I put together a quick project.
https://playcanvas.com/project/609754/overview/sprite-in-ui
There seem to be a number of things going wrong here, lets focus on a few.
I’ve placed anything parented to the 2D screen on the left, and the same elements parented to the world on the right.
See in the published link below.
The two Sprite elements in the editor are very small, but they appear in the published build at a different size - there is an inconsistency here. ( EDITED FOR CLARIFICATION: Adding sprite to 2D screen directly doesn’t seem to be supported, use Sprite property of Image Element )
If you rotate the screen left and right, you’ll notice that the image that is parented to the world ( on the right, in the background ) clips when half of it is outside the screen ( or when the pivot in the center is off-screen )
The sprite to the right, which has it’s size increased and is meant to be 9sliced with tiled - notice that the center bit doesn’t actually tile, but is stretched.
Hopefully the first 1) can be fixed, it’s the urgent one. The other ones are important as well of course.
Same with Elements in the World without being parented to a Screen.
That’s expected behaviour for 9 slicing. Usually the center is a solid colour. I believe Unity gives you a choice of being able to stretch or tile in the settings.
Hi Yaustar,
I didn’t notice the sprite tab, thanks for pointing that out!
I’ve updated the example to show this method, but also how the tiling for 9 slice sprites isn’t working ( it’s sort of working, I think the tiling scale factor is wrong )
Hmm… I’m getting the behaviour that I’m expecting. What are you expecting it to look like?
https://playcanvas.com/editor/scene/728348
Edit: I see what you mean. It looks like it takes the middle section and stretches out the quad to fill the space.
This looks like it is behaving as expected.
@dave I would expect the tiles in the middle cross to be scaled, so that ( in the above example ) the grid squares wouldn’t be stretched compared to the ones in the corner sections, but would match.
Sorry, this thread is very confusing. Which image are you talking about?
Assuming you are you are 9 slicing like this:
This is the expected result where the middle section is stretched to fit the space.
With tiling enabled, I do agree with you that it’s not easy to tell how large the tiles of the middle section would be:
Hopefully this shows the issue.
Here’s 9 slice tiling in PlayCanvas ( inner “cross” tiles are scaled ).
Here’s 9 slice tiling in Unity
Have you tried changing the pixels per unit value on the sprite?
I sure did @dave - and as expected, it scaled all of the pixels ( both the correct areas and the incorrect areas ). This would imply that the issue is elsewhere, possibly in the code that calculates the tiles dynamically. The good news is that it almost works, it just needs a bit of tweaking with an example that shows the breaking issue.
Feel free to try it out yourself, here’s the PlayCanvas project link…
https://playcanvas.com/project/609754/overview/sprite-in-ui
And here’s an image showing the entity in the hierarchy, in the scene, and the relevant sprite.
What controls the tiling size in Unity?
Unity seems to automatically calculate it correctly, the calculations in PlayCanvas seems to be slightly incorrect.
I did pretty much the same steps in both programs ( place the markers for the 9 slice ), and set it to tiled.
Note that I didn’t spend time getting the marker locations exact, but I can put time aside if required to make a better example ( eg remove those red lines ).
With Unity, it just worked.
Ah, I see what you mean. You are expecting it to tile at the size defined in the Sprite Editor.
Yes - in Unity, I see the expected result ( the tiling continues at the same “pixel density?” as the rest of the pixels in the corner slices of the 9-sliced sprite ). I’d be happy with an option to adjust this ( I didn’t look further into it ), but out of the Unity box it works correctly for me.
In PlayCanvas, the default scaling isn’t correct for what I would expect, and there is no control over adjusting the scaled areas of the tiled slices, so I can’t match the Unity ( expected ) result.
I was able to make a bit of progress fixing this, but not being able to see the values of the variables within the fragment shader in the browser meant that I couldn’t get the proper formula sorted.
Note that the scaling of the inner “cross” sections have their UV’s changed ( but not correctly until correct formula is figured out )
