Create a new document. Tap the "D" key on your keyboard to return FG and BG colors to their default black and white, respectively.
Zoom in tight near the upper left corner and draw a 1 × 3 pixel rectangle with your Marquee Tool.
CTRL + ALT + Shift + N will create a new layer.
ALT + Delete (or Backspace) to fill this 1 × 3 pixel marquee selection with black. Notice: Dead crisp and clean sides.
CTRL + J will duplicate this little box in a new layer.
CTRL + Click on Layer 2 to select this new duplicate tiny rectangle.
CTRL + T to invoke the Transform function.
In the Options Bar, click on the "Delta" shape between the "X" and the "Y" numerical entry fields.
Enter "6" into the "X" field. Notice this duplicate black rectangle moves to the right so that it’s separated from the first rectangle in Layer 1 by 3 pixels, right where you want it. Tap Enter twice to commit the transform. The little dash mark on Layer 2 should still have the "marching ants" selection marquee surrounding it.
Hold down the CTRL + ALT + Shift modifier keys, and tap the "T" key on your keyboard to repeat the copy & transform procedure. Keep holding the modifier keys down, and every time you tap the "T" key you’ll get another little dash mark, offset to the right from the preceding dash by 3 pixels.
Do this as many times as you want. You can calculate how long the line will be mathematically, or you can zoom out and extend the line of dash marks as far as you want, judging the length of the line by eye.
When you have enough, CTRL + E will merge Layer 2 down onto Layer 1, and you’ll have a perfect line of 1 × 3 pixel dash marks sitting on an otherwise transparent layer, and you’ll be free to duplicate and move as them you wish.
That’s a pretty good stepwise solution, but it’s just too many steps to be efficient (action maybe?). I was hoping to find something a little simpler, though. I could just as easily make a couple of layers with the dashed lines on them and duplicate them and move them into position as needed…. poke them out one px at a time with the pencil; but that’s kinda lame when I’m drawing like 40 or 50 of these lines (usually at right angles) per comp. (I’m doing redline pixel specs for a UI, and the previous designer used these dashed lines for for a certain kind of dimension).
— c
Dude, if you have Illustrator, do it there.
Those instructions look like a lot, but it only takes a minute to bang out a long line.
You asked, I told. Don’t look a gift horse in the mouth.
Phosphor, thanks for writing up those instructions in such detail. It was very kind of you to go through the trouble to type it all up so pedagogically. The technique you described works fantastic for being flexible (you set the "pattern" to step and repeat at the beginning of the procedure, can apply layer styles to it (e.g. color overlay). And I learned from you that you can do the step and repeat thing in Photoshop (clicking the triangle, setting the offset, while doing a Transform). Thanks.
I don’t want to roundtrip this to Illustrator. And the lines I want to draw are usually short (like 20px total), there are just a lot of them in a single comp.
I am looking for a solution that leverages the vector shape tools in photoshop. Is there a way to make the Shape Layers not anti-alias, or do a Stroke Path that won’t anti-alias? I can’t find a way to do a Fill Pixels with pattern I described.
thanks again,
— c
Well, if you understand Photoshop, you should understand that a vector object can be created that does not adhere to the integer values the way a selection marquee does.
You can make a 1.17 × 2.98 px vector object, but you can’t do that with a selection marquee. Additionally the edges of a vector rectangle can be located between integer pixel values, which you also can’t do with a selection marquee. Both of these factors will result in antialiasing taking place when you fill or stroke a vector line or object that has either, or both of these attributes, because Photoshop deals ONLY in whole pixels.
There are ways you can mitigate these problems with vectors which I’ll leave you to figure out for yourself (and yes, I’ll help you if you can’t).
But…If you consistently create dashed lines that are as you described (and I replicated) there’s a fairly easy way to do this.
Create a rectangular marquee selection that is 1 px H × 6 px W. Fill half of it with black, and define the entire 1 × 6 marquee as a Custom Pattern.
Now, you can use your horizontal single row marquee to create a selection that runs the whole way across the document. Fill this with the Custom Pattern you just made. Bingo-Bango…a 1 pixel high line with the dashes just they size you want them, fully clean, squared and aliased. This happens because you can’t create a marqueed selection with dimensions that include non-integer values, hence no extra pixels are added to make the dashes "appear’ to be placed in a non-integer location or to be of a non-integer size. You can’t place that selection anywhere on you document where it won’t have edges that fall dead on to the intrinsic, invisible pixel grid that’s in every document.
Create a similar pattern to fill vertical single row marquees, if you want, and you’re set to do what you want about as easily as it can be done.
