Anyone can help me with the script for measuring the distance between two elements (layers) in Photoshop.
I know that there are smart guides 
. I need this funcionality as a script to apply correct margins/paddings in CSS
Layers should be selected by shift. It's works very similar in Adobe Dreamweaver Extract and Assets Extract.
1 Correct answer
OK.
The following script gives you this result. But it seems to me this is complete nonsense. ))
...// version no CS6 or no effects
var old_units = app.preferences.rulerUnits;
app.preferences.rulerUnits = Units.PIXELS;
try { app.activeDocument.suspendHistory("Get Text Bounds", "var bounds = get_selected_layers_bounds()") } catch(e) { alert(e); }
try { executeAction( charIDToTypeID( "undo" ), undefined, DialogModes.NO ); } catch(e) { alert(e); }
app.preferences.rulerUnits = old_units;
Explore related tutorials & articles
31
Replies
Chuck, can I get an array of active layers? Seems like if I select two layers with shift, Photoshop treats them as a single layer for defining bounds.
And... Where can I see all properties, subelements of doc, actieveLayer briefly - I'm newbie in PS scripting 
Two layers should be selected with shift key.
The distance is the distance 
- veritcal distance - between bottom border of top layer and top border of bottom layer.
30px on screenshot (from Adobe Assets Extract).... Could U provide script example with targetLayers?
If you use Point text plus without letters protruding down, for example "Foobar", then this will be the required distance. I think, it is not possible to calculate the distance from the baseline (of the bottom line of the top text), although ...
r-bin, Tom If it will be possible to calculate this way - it will be excellent!!! 
If you want to measure the distance between the baselines of the text, then it's very simple. The position of the baseline is specified in Layer.textItem.position or, in our case, in textClickPoint. If this is what you need, then it's easy. The truth is still no time. I'll do it later.
P.S. Just specify, is this what you need?
Temporarily replace all the symbols with the â–ˆ (SolidBlock symbol).
It was really cool idea! Full (solid) block covers 120% of font-size = PS leading auto or CSS line-height 120%. So the last thing.. really))... Should be applied updated and simplified formula
CSS = PS - (line-height_1 - 1.2 * font-size_1) / 2
- (line-height_2 - 1.2 * font-size_2) / 2or in Photoshop Script syntax it should look something like this:
distance_in_css = distance - (Layer1.textItem.leading - 1.2 * Layer1.textItem.size) / 2
- (Layer2.textItem.leading - 1.2 * Layer2.textItem.size) / 2;But I still do not understand how exactly this can be applied in the script. It's too hard for me 
Hi there! The script is good, but not complete .
In CSS, the height of a single-line text block is equal to the line-height (leading), for a multi-line block the height = line-height * n, where n - number of lines.
In Photoshop, the height of a single-line text layer (pointed text) is determined by the boundaries of the letters in the line. Leading affects only the distance between lines in a multi-line text layer, but not the height of a single-line layer. The height will be determined by the letter boundaries - the upper bound of the first line and the lower bound of the last line.
I noticed that the height of a single-line text layer using a solid block in Photoshop corresponds to a line height 120% (auto). And the script, if I understand correctly, calculates the distance between two such lines. But what happens if the line height, for example, is 200% or 100%?
I hope I explained it normally...
So we obtain the formula (where distance is distance calculated by script):
distance_in_css = distance - (line-height_1 - 1.2 * font-size_1) / 2
- (line-height_2 - 1.2 * font-size_2) / 2or in Photoshop Script syntax it should look something like this:
distance_in_css = distance - (Layer1.textItem.leading - 1.2 * Layer1.textItem.size) / 2
- (Layer2.textItem.leading - 1.2 * Layer2.textItem.size) / 2;But I still do not understand how exactly this can be applied in the script. It's too hard for me
Honestly, I did not understand anything ). For me, the font parameters are similar to the Chinese grammar.
Could you draw two different text strings with a designation, roughly like in this figure, and indicate from which point and to what point do you want to measure the distance?
r-bin​, sorry for the delay - I was sick.
I still need a vertical distance between the two text layers, but given the line-height (leading). The script calculates the distance correctly for text with a line height of 120% (auto) - the â–ˆ (SolidBlock symbol) takes exactly this height. If it is less than or greater than 120% - in CSS the height will change, therefore the distance needs to be changed. Look at the screenshot, how it works in the browser (css) at different line-heights:
I do not know how to help you, because I do not understand where you get the line height of 70%, 120%, etc. and call it still leading. I do not find this in photoshop. There the concept of leading sets, as I understand it, the distance between the baselines of the lines.
In addition, it depends on the resolution of the document. See the screenshot.
You can not find it in Photoshop, because it's in the CSS . This was a screenshot from Chrome. In CSS there is a line-height and it can be set as a percentage of the font size or in pixels. In Photoshop, there is leading and it can be set to AUTO (corresponds to the line height of 120% of the font size) or in pixels, points, etc.
The the line-height in CSS determines the actual height of the text block (even 1 line of text!) AND the distance between the lines of text. The leading in PS determines ONLY the distance between lines of text. That's the problem.
Example - 2 single-line text layers.
1st - font size 100px, leading 120px (auto);
2nd - font size 100px, leading 200px.
The vertical distance between the boundaries of the layers is 50px.
The browser shows that the visual vertical distance between the blocks is somewhere around 100px because of the 200px line-height of the 2nd layer.
AdChoices
