PNG to Prefab

Target Platforms Mobile
1

What is the best way to turn a non-power of 2, i.e. 40x40 pixel PNG file into a Prefab? Do I need to load it into Maya and write it out as a .ma file? Or is there a way to do this in Unity?

2

Im not exactly sure why you want a png file to be a prefab, as far as I know only gameobjects can be prefabs.

What exactly are you trying to accomplish?

3

I’d like to make a button from a PNG image that when clicked performs some function. Maybe a better title would be “image used as button”?

4

just put the image into the resources folder and when you create the button (depending on what you use) ensure to load the texture upfront through Resources.Load( … )
Should theoretically work I think

images itself will never work as button, they are just that, image data and if you put them on a GUITexture, they still won’t be buttons but a screen placed image.

5

It looks like I can put a PNG file on a GameObject as a texture using
Resources.Load.

var go = new GameObject.CreatePrimitive(PrimitiveType.Plane);
go.renderer.material.mainTexture = Resources.Load("glass");

The question I have is how can I create a custom button of arbitrary size that corresponds to the size of the PNG image? One approach looks like I can use GUI.Button with GUI.styles/skins where the Button is in a rectangle. But is it possible to have code to test if the user clicks inside the image using GUI.Button? In Objective-C to create custom buttons I’ve used an image instantiated in a rectangle and checked for clicks within the area of the image. Is there also another approach besides using GUI.Button to create custom buttons?

6

That depends on what you use to create it.
There isn’t an automagic that will do it for you if that is what you hope for.

But with SpriteUI / GUIManager you can get some good functionality to start with.

Generally you wouldn’t want to use 1 image per button on the iphone, unless its the menu and if it is the menu, you could potentially just use OnGUI and the GUI.xxx commands

7

SpriteUI looks great, only one draw call used for all the buttons. And you are right, I don’t want to have one image per button, but to put all of the images into one Texture, like the Sprite Manager demo, Javascriptsprite_168.zip on page 12 of the SpriteManager thread.

Question: Can I use Maya to create a Texture out of all the button images? If so, do you have any pointers of how to do it?

8

wouldn’t use maya or any 3d app

take gimp, photoshop or whatever you have on the 2d content creation end.
The only real requirement is that it has layers so you can put each button / gui element on an own layer to make them easy changeable at a later point.

9

This is a portion of the code for one of the PNG buttons in my interface:

var howTex2 : Texture2D;
var howTexHi2 : Texture2D;

...

function OnGUI () {
        ...
	// HOW TO PLAY button
	var howStyle : GUIStyle = new GUIStyle ();
	howStyle.normal.background = howTex2;
	howStyle.active.background = howTexHi2;
	if (GUI.Button (Rect (77, 46, 29, 154), "", howStyle)) {
		Application.LoadLevel ("How to Play");
	}
        ...
}

That works for me.

10

@dreamora - Are you saying that the advantage of having each image on its own layer is that you can easily remove it from the texture? Or is there some other advantage of having each image on its own layer in the texture?

11

You can easily modify it as well. If it is on its own layer you can copy paste from other images for example or change the layer effects for just this button or apply effects to just this button.

generally its much simpler and productive to be able to work with each button seperately.