how to import photoshop mockups into interface builder?

[nanshi]

there are images, buttons etc in the mockup, i wonder if there is a way to import files generated by photoshop (say *psd) directly into the interface builder of an iphone app project?

[baja_yu]

No. PSD files aren't supported. You need to save them in a supported image format first, like PNG, Jpeg etc.

[Duncan C]

Originally Posted by nanshi

there are images, buttons etc in the mockup, i wonder if there is a way to import files generated by photoshop (say *psd) directly into the interface builder of an iphone app project?

You can save an entire screen as a PNG and import that as a background image for a window. You generally want to leave out the buttons and add them as separate objects. Photoshop layers are your friend in a situation like this, because you can add or remove elements as needed, or save individual layers as separate PNG images which you then import into the control you are customizing.

For things like buttons, make sure you're working in a layered document. Carefully select the area you want and cut it into a separate layer. Then create a new document (The new document should default to the size of the image in the clipboard.) create a new layer and paste in your button. Hide the background layer so the area around the button is transparent. Then save as a PNG file with mask.

You can use such an image as a button image directly, and the system will draw the title on top of it.

It's also possible, although tricky, to create stretchable button background images that will resize to fit the button size automatically. Do a search on "StretchableImage" to find the UIImage method that handles that. That takes a lot of fiddling with pixels to get it to look right.

[nanshi]

Thank u for the quick reply. I still wonder if there is some easy tool to use to convert a *.psd file into *.png images according to the layers. I did find a tool on windows to convert a *.psd file into a single image, but i dont see it can separate layers.

[mavrik5150]

Originally Posted by nanshi

Thank u for the quick reply. I still wonder if there is some easy tool to use to convert a *.psd file into *.png images according to the layers. I did find a tool on windows to convert a *.psd file into a single image, but i dont see it can separate layers.

I don't use Photoshop that often but that's what I thought the Slice Tool was for, you create the slices around the pieces that you want to be separate images and then I believe you use Save for Web Devices and then you would get a folder with all the different images you cut out of the original.

[Punkjumper]

in photoshop you can export all your layers to a separate file by going to the file menu/scrips/export layers to file then choose your file type.

do you not have photoshop? you don't need any special tools to flatten a multi layered file.