Cropping an image to a layer.
I'm no Photoshop user, except in a very mundane sense, so this is a very straightforward question.
Imagine I have a PSD with a document size of 500x500 pixels.
It has one layer, upon which sits a green square 50 pixels on each size and sitting at (250, 300).
What I want from this document is a PNG, a 50 pixel green square.
How do I go about this?
I know this is simplistic -it's just an example. I essentially want a crop to the content of a layer. I'm using CS6.
1 Attachment(s)
Re: Cropping an image to a layer.
The simple answer is do it in Xara. It is so much easier.
I created a page to your size. Added a green square. Selected the square via the Magic Wand tool and cut it to the clipboard.
I created a new page and specified the background color transparent. Then pasted in place.
I'm sure I did this the hard way but I only use Photoshop as a pass through filter.
Re: Cropping an image to a layer.
I might ( would ) agree it's easier using Xara, but I wanted to know the technique to use with just Photoshop!
I can accomplish the task, but there has to be an easier way than I can do it now.
One of the things that's frustrating about Photoshop is that while I can select the layer and the square, Photoshop won't even say how big it is.
Thanks for the heads-up.
Re: Cropping an image to a layer.
You could layout and create the image in Xara, export it as a bitmap, and then edit the bitmap in Photoshop.
Re: Cropping an image to a layer.
Gary, this is all about Photoshop - Xara specifically excluded!
The starting point here is an image sitting on a layer in photoshop, displaced from the origin, and the objective is to create a PNG of just that image, cropped to fit.
I am not creating the image, someone else is giving it to me.
1 Attachment(s)
Re: Cropping an image to a layer.
Quote:
Originally Posted by
pauland
...Imagine I have
- a PSD with a document size of 500x500 pixels.
- It has one layer, upon which sits a green square 50 pixels on each size and sitting at (250, 300).
- What I want from this document is a PNG, a 50 pixel green square.
I know this is simplistic -it's just an example.
Yeah, the problem with "simplistic" is that (almost) any example I can think of won't likely fit what it is you are really needing.
Screen shot should be self-explanatory. But, just in case, all I did (other than try to recreate your example) was to use the magic wand, inverse the selection, copy to the clipboard and then hit ctrl+n to create a new document. Depending upon the preferences setting, you can see in the screen shot the new document is being made at the clipboard content size, which is your 50 px X 50 px. Then paste it into the new document.
See? A too simple answer for a simplistic question!
Re: Cropping an image to a layer.
OK, Mike and Gary, thanks for your patience with me and this dumb question.
The thing that particularly caused me to stumble was that when selecting a layer, the content is shown as selected by photoshop, but the actual size of the selection was not, so I was left wondering how big that selection was. My Doh! moment in particular was not using the selection tool specifically to select what was there and then have the actual size revealed.
It seems counter-intuitive to me that selecting a layer never reveals the size of the content on the layer ( unless I'm missing another trick ).
I did discover ( on my photoshop journey ), that selecting a layer, then duplicating it allows the layer to be duplicated into a completely new document or another open document, as-is so that's a great feature.
Generally as a new user I find photoshop quite clunky, but that's because I only use it for fairly simple things as part of a pipeline, rather than as an asset/art creator in it's own right.
Thanks Guys. Job done.
1 Attachment(s)
Re: Cropping an image to a layer.
Whilst we're on this subject - here's my real example - a UI element.
How can I tell it's exact XY position? Photoshop tells me how big the selection is, but not the position. That seems bizarre to me.
I can move the cursor to the corner of the selection - the cursor XY is always shown.
Re: Cropping an image to a layer.
You can show the rulers, making sure it is displaying in pixels (right-click on the ruler for the units). You can then make sure the 0,0 is in the upper left (double-click where they join).
You can always check a layer's dims by right-clicking on the image's title bar or tab, choose the appropriate action in the context menu. The X/Y will show only the current position. So if you want to display say something's X/Y at the top left, drag rulers into place.
Personally, I have never understood using PS for UI development. But it is heavily used, that's for certain. I cannot remember if Fireworks shows X/Y positions, but I used it for UIs back in the early 2000s. Before that couple year stint, I used CorelDraw for UI development, as well as afterwards. If you are subscribed, FW CS6 might be downloadable. I would check it out if so.
Mike
Re: Cropping an image to a layer.
Thanks Mike.
My clients supply me their designs in PSD or AI format generally. It would be nice to know precisely, without any eyeballing, where a particular element has been positioned.
I think the easiest way I have found is to do an extreme zoom in to a corner and position the mouse. At high zoom I can get the position reliably. It seems a kludge though.
Re: Cropping an image to a layer.
Fireworks ought to open and write those PSD files just fine. From (a faulty) memory, I think the FW interface shows the coordinates.
So are these sprites where the coordinates are important?
Re: Cropping an image to a layer.
So are these sprites where the coordinates are important?
Most clients aren't too picky. Occasionally a client gets huffy if a PSD design isn't reproduced pixel-perfect.
In this case, you are only seeing the background of a panel, not anything else - there's a ton of other stuff that sits over that. This is a Flash project and unlike the static PSD, these panels are sometimes hidden then revealed, so it's often better to handle them as separate entities in Flash, so I want to position that panel in the same place as on the PSD and of the same size.
It sounds trivial, and mostly it is, but sometimes it's not!
In this case the flash panel sits over HTML elements that are also visible through flash and as a result this panel needs to sit as closely over the panel it obscures in the underlying HTML.
It will never be perfect on all browsers or any browser at all times. It wasn't my idea..
Re: Cropping an image to a layer.
If what your are doing is for Flash, I am with Gary here, why not vector, use Illy for the job! You have the ability to name the graphic for Flash, Graphic/Movie as a symbol, you can export your all of your layers as a single frame with time line.... - individual or preserve your layers.... - copy & paste directly to and from Flash... - and I could go on about bezier points. Have a look here: http://helpx.adobe.com/flash/using/i...les-flash.html
As Mike mentioned for raster type files F/Works is the way to go. If my memory is correct and I am talking about CS 4 PS here the PS export to Flash is more GIF like in its approach to Flash animations.
Re: Cropping an image to a layer.
Albacore, this is not about me creating new artwork, it's about what others have supplied to me.
If they wish to supply artwork as a PSD I am fine with that. I think that you have misunderstood how I use PS with flash - I am talking about moving assets from PS ( or AI! ) to Flash CS6, not using Photoshop to create flash output. All of the features you mention with AI export for flash is also possible when importing PSD content to flash.
At a secondary level, I want to become more familar with the PS and AI toolset, so knowing how the best way to find the size and position of layer content inside PS was important to me.
This isn't about converting me from using PS to AI or Xara.
You should already be aware that I've been using Xara for donkeys years!
I appreciate the heads up and under other circumstances I might well be following your advice.
Paul
Re: Cropping an image to a layer.
Well we are prickly today! In my info panel so long as a you have the marching ants around the object the info panel will give you the info(Select ---- Select All. Ctrl+A) or if it is a vector shape and it is selected that too will give you the info. I was trying to be helpful because you mentioned client and Flash and that means deadlines.
Re: Cropping an image to a layer.
Sorry, I wasn't intending to be prickly at all - It wasn't intended to read like that at all. I explicitly added the last line to make it clear I appreciated your advice. I guess it didn't work. :-(
Select all doesn't really work - it selects the whole canvas on these designs ( possibly because originally they used masks against a solid shape that filled the whole canvas ).
Thanks to all the contributors on the thread - I have now a usable workflow to get the size and position of the panels - it's not a single click type solution, that I anticipated, but fine none-the-less.
I am really grateful that people take the time to help out. My posts are about trying to explain my exact situation rather than have a go at anyone. I completely understand and agree with the suggestions to use vectors rather than raster, etc, but since I don't generate this artwork myself, and I already get the point about Vector, it doesn't quite fit this particular scenario.
So, I don't mean to be prickly at all and I do appreciate everyone's contributions here.
On the flash side, I never use Xara, PS or anything else besides the Flash IDE to make flash projects. My flash projects have a large amount of scripting in them and manipulation that really needs a timeline to organise the more complex manipulations. In this particular project I have a graphic element that scoots across the screen revealing text behind it, so there is masking of the text and co-ordination of the mask with the movement of the graphic and there is easing of the movement - not a linear speed. The client makes comments about the speed so I change the timing. All this would be a major problem with a product like Xara.
I am not knocking Xara - it has strengths and weaknesses and it has always been weak at animation - though people do do clever things with it - because it has no timeline.