

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer

A ninepatch, for those unfamiliar, is described here. In a nutshell, you can take an image and put a few pixels on the outermost pixels to represent which areas should stretch and not stretch when they're used on UI widgets of varying sizes. That's great if the program you're working with knows how to understand a ninepatch style image.

Is there a way to resize something in photoshop in the same way? Normally I would just scale it, but that doesn't work if I want to keep the borders edges a specific thickness and only stretch the center portions.

share|improve this question

If you stick with vector shapes in Photoshop, that will give you want you want.

If you need to stretch raster images, I believe Adobe Fireworks now offers that feature.

If these are gui elements for web, note that you can do a lot with CSS now and may not need actual images.

share|improve this answer

If you're trying to do this to a raster image, and using version CS4 or later, you can use the Content-Aware Scale tool, in combination with an Alpha channel, to get a similar effect.

First create a new alpha channel in the image, and fill the areas you'd like to protect from scaling with white. Leave the rest of it black.

Make sure the layer you want to resize is selected, and not a background layer. Then go to Edit > Content-Aware Scale.

Once the tool is active, the second option from the right in the options bar should be "Protect". Select the Alpha channel you just created from the drop down list and then start resizing.

share|improve this answer

The Illustrator, Fireworks and Flash equivalent is "Nine-Slice Scaling" and it's pretty simple to work with in those applications, so if you need this frequently in your workflow, you're better off working in FW or AI.

Photoshop doesn't have such a capability. You can't transform a shape (vector or raster) in Photoshop without distorting such things as corner shape or radius (the things 9-slice is most useful for). Neither scale tools nor Content-Aware Scaling are going to help you much.

One way that you can achieve 9-slice Nirvana in Photoshop is to create the object in Illustrator or Fireworks and place it as a Smart Object, double-click to edit the original as needed. This is a pretty clumsy workaround, though. You're better off in a program that does this natively.

share|improve this answer
You can transform shape without distorting radius or shape. Either use free transform with shift to keep the aspect ratio or select the needed points with Direct selection tool and move the points to get the size you need. – Joonas Nov 7 '11 at 7:24
You've not read the question fully, Lollero. The whole point is to be able to change the aspect ratio. However, you're welcome to try to scale a Photoshop shape without altering the corner radius. If you start with a 10px radius and scale to 200%, the radius will NOT be 10px, I promise you. Selecting points a) won't work with a raster object and b) imo is way too tedious for what the OP wants to do. – Alan Gilbertson Nov 7 '11 at 7:45
I'm talking about shapes, not raster objects. You claimed that you cant transform shape in photoshop without distorting things which is not true.. I mentioned Free transform with shift because it is another way to transform shape without distorting things. – Joonas Nov 7 '11 at 8:22
I try not to claim things. :-) This was a matter of the best way to approach a particular workflow problem, and a simple transform in Photoshop doesn't preserve edge shapes and sizes the way 9-slice scaling does. In this situation you're trying to distort the shape, not maintain proportions. Buttons and shaped text fields have to distort in a particular way that is done fastest and most easily in programs that do 9-slice scaling, like Illustrator, or in InDesign (which does even better than 9-slice but isn't in most web designers' toolkits). – Alan Gilbertson Nov 7 '11 at 10:30
The Free transform with shift was just an example that may work in some cases.. The main point was that you said that it's not doable in photoshop which it is.. – Joonas Nov 7 '11 at 10:46

Your Answer


