Sprite Sheet Mystery

[havenisle]

Hi everyone! Long time lurker, first time poster.

Okay, I've finally come across a problem I can't find a solution for! I am having difficulty figuring out the next step I need to take in order to make use of my sprites...

1. I made a bunch of buttons in photoshop, and arranged them in a grid, allowing 64x64px for each of the icons. The resultant PNG is 256x256px, and contains four rows, four columns.

2. If I use photoshop, I can split them all up into individual PNGS, upload them, and import them into my Atlas just fine. Everything works well, but this isn't the problem.

3. The problem is that I want to keep my Sprite Sheet intact- I don't want to chop it up in photoshop.
     a. I drop the Sprite Sheet into Unity.
     b. I select it, and in the inspector, choose Sprite, Multiple, and then Edit Sprites.
     c. I chop the Sprite Sheet into sixteen pieces and name them.

4. At this point, all of my little chopped up bits become children of the original PNG. There's a little rollout arrow next to the PNG, and when I click on it, it shows me a list of my sliced up sprite, all named properly, but they have little blue boxes around them.

i.e.:

>AllMyButtons        <--- original sprite sheet png
   menu
   home
   browser             <--- children of the png, chopped in editor.
   search
   background         



5. If I try to select them and create myself a new Atlas... the Atlas only loads the original PNG! It loads the entire sprite sheet, and completely disregards all the chopped up bits.

SO SPECIFICALLY... How do I make the Atlas load those chopped up images, and not the entire sheet? Am I stuck having to chop up all of my sheets in Photoshop? If so, why the heck does it let me chop sprites up in Unity/NGUI? Is there a reason why they have blue boxes and are children of the original Sprite Sheet PNG?

Anyhow, thanks in advance. If there's a link to a solution, you can post that instead of explaining... I just couldn't find it and I've been searching all week, which my boss just *loves.*

[ArenMook]

You're confusing sprites (unity 4.3 feature) and textures. NGUI uses textures to create atlases. Unity's way of generating "sprites" is just a way to sub-divide a texture on import.

If you're using Unity's sprites, then don't try to add them to atlases. Just use them as-is. Use UI2DSprite to draw them.

[havenisle]

Thanks for the reply. I guess I may not have presented my problem as lucidly as possible.

I'm not using sprites, I'm using a page of icons. Rows and columns. Typically, this would be called a Sprite Sheet, but I'm not trying to make Sprites... I'm trying to make buttons.

And my page of icons (which will be used as buttons) is made in Photoshop. When I import that page, I want to make NGUI read that page and use it to build an Atlas. Right now, I have to chop the page up into little pieces in Photoshop, save each image as a separate file, and then load that into an Atlas. The Atlas then takes all of those images, and puts them all together in a big page. (Which again, I would normally call a Sprite Sheet...)

My question is why do I have to do that when I already have a big page?


Workflow Option One:
1. create icons on a big page IN PHOTOSHOP. <---- Page full of icons, just like a Sprite Sheet...
2. chop up page into 10 smaller pngs, in Photoshop... save as ten separate pngs.
3. import all ten images into unity, add to Atlas.
4. atlas creates a big page with all images on it. <---- It's a page full of icons... like a sprite sheet...

Workflow Option Two:
1. create icons on a big page in photoshop.
2. save page as a png.
3. import single page into unity, define grid, add to Atlas.
4. atlas no longer needs to recreate a giant page full of icons...

I hope that helps... I'm not doing SPRITES. They are all textures. I personally would call the big page that the Atlas makes a Sprite Sheet. You can call it whatever, but it has nothing to do with generating sprites in the 4.3 sense, really.

Sorry if my terminology is off... computers, eh? ^__^ And thanks again!

Honestly, if you tell me that the only way to load the Atlas is to use a ton of pngs with single icon per file, I will accept it at that and leave you alone. But it just seems that it's unnecessary to do that if the Atlas is going to put all those icons back into a single sheet! (Especially since the Atlas packs them incredibly loose, and leaves a ton of blank space.)

[ArenMook]

You can have exactly that workflow by using Unity's sprite system, actually. Import the texture as a Sprite, Sprite Mode set to "Multiple", and there you go.

[Nicki]

Standard workflow is option 1.

You can save them as individual PSDs though, as Unity happily imports PSD.

NGUI cannot cut up an existing sprite sheet (texture) into individual sprites (sub texture), because there's no image recognition built in, liked the new 2d sprite system in unity 4.3 does.

Does that help?

[dehinrsu]

Hi,

I have implemented a sprite sheet importer (for NGUI 3.6.... Anyone interested? PM me your mail id...

Thanks
Vijay

[dehinrsu]

Hi,

I am very sorry for the late response... It took a lot of time for me to compile this video. I hope it will be useful to someone...

Sprite Animation using NGUI:
https://www.youtube.com/watch?v=ys60bEIa2zA

The video demonstrates the following:
1. How to import a sprite sheet into NGUI
2. How to import a Unity Sprite (Multiple mode) into NGUI
3. Create animation clips (Sprite animations)
4. Attach this animation clip to an NGUI sprite.

Thanks
Vijay
dehinrsu@gmail.com

[dehinrsu]

Hello,

I have added support for sprite animation on top of NGUI. And all these features are fully integrated with AtlasMaker and SpriteInspector.
1. Import Sprite Sheets.
2. Import .Gif files.
3. Support for UnitySprites in the Atlas.


After posting this youtube video www.youtube.com/watch?v=ys60bEIa2zA under the title "Sprite Animation using NGUI" have received many requests to share the code with them. This is a very old video, will try to make a new video with all the features and share it with you...

With your permission I would like to share the following files in the form of a UnityPackage.
Editor\NGUIEditorTools.cs
Editor\UIAnimSpriteMaker.cs (new file)
Editor\UIAtlasInspector.cs
Editor\UIAtlasMaker.cs
Editor\UIBasicSpriteEditor.cs
Editor\UISpriteInspector.cs
Internal\UIBasicSprite.cs
UI\UIAnimationData.cs (new file)
UI\UIAtlas.cs
UI\UISprite.cs
UI\UISpriteData.cs
System.Drawing.dll

P.S. I have modified the NGUI 3.6.8 free version, and have tested the code on Unity 4 and 5.

Kindly let me know if you are ok with this.

Thanks
Vijay

[ArenMook]

NGUI 3.6.8 free version? Only NGUI 2 is free.