Hey, i got inkscape yesterday when i decided that i need to start working with vectors. I've been working with photoshop for a number of years but i can't seem to make a inner outline in inkscape..

Look at step 2;
http://mso-chronicles.blogspot.com/2008/06/echo-icons-tips-creating-echo-icons.html

I can make a stroke that runs along with the path, but i want to be able to choose "Inner, outer or center" for my stroke. if those basic options for the stroke function does not exist i can only say, shame on you developers!

I Added the Positioning buttons in photoshop

There's always path -> inset/outset (although that also deforms the stroke a little bit).

I'm not sure if inkscape has anything that lets you specify whether the stroke should be in, out, or center of the path (I believe it is set to "center" as default). Mainly because I never had any need for it.

Simply make a path/shape, and then give it a stroke of whatever width you want.
Now, while selecting the shape with the tool, look up at the object properties toolbar (its to the top). You'll see a input box for "X", "Y", "W" and "H". The last two ("W" and "H", which stand for Width and Height) is what concerns us. Type in the value of the width and height that you want (click on the lock symbol to constrain the H:W ratio)

The way I see it, a path set to "in" will have the same look as a path set to "out" or "center" which has been scaled down a little bit. (In other words, if we constrain a shape to be exactly 100 x 100, then whether that shape has a path which is "in", "out" or "centered" makes no difference.)

The reason Inkscape doesn't have these options is because they don't exist in SVG.

One way to simulate an inner stroke is to use an ordinary stroke of twice the desired width, and then clip the path with a duplicate of itself.

zials wrote:There's always path -> inset/outset (although that also deforms the stroke a little bit).

I'm not sure if inkscape has anything that lets you specify whether the stroke should be in, out, or center of the path (I believe it is set to "center" as default). Mainly because I never had any need for it.

Simply make a path/shape, and then give it a stroke of whatever width you want.
Now, while selecting the shape with the tool, look up at the object properties toolbar (its to the top). You'll see a input box for "X", "Y", "W" and "H". The last two ("W" and "H", which stand for Width and Height) is what concerns us. Type in the value of the width and height that you want (click on the lock symbol to constrain the H:W ratio)

The way I see it, a path set to "in" will have the same look as a path set to "out" or "center" which has been scaled down a little bit. (In other words, if we constrain a shape to be exactly 100 x 100, then whether that shape has a path which is "in", "out" or "centered" makes no difference.)

Hmm, the W H thingy did not do nothing that i wanted? that is basically just changing the size of my shape- Or have i done something wrong?

Im very dependent of the option to have the stroke follow the shape/path on the inside. Why, well it asures me that the stroke follows the grid and that the size of the shape/path won't change.
For example;
In the tutorial linked in the first post i tried just adding a stroke with the width of 4 px. But the stroke does not follow along with the grid like the shape does at the steeply angled parts of the arrow.
How do i solve that? Inner stroke option

sas wrote:The reason Inkscape doesn't have these options is because they don't exist in SVG.

One way to simulate an inner stroke is to use an ordinary stroke of twice the desired width, and then clip the path with a duplicate of itself.

SVG??

Clip, where is that option/funktion/tool??

Linkert wrote:Hmm, the W H thingy did not do nothing that i wanted? that is basically just changing the size of my shape- Or have i done something wrong?

Im very dependent of the option to have the stroke follow the shape/path on the inside. Why, well it asures me that the stroke follows the grid and that the size of the shape/path won't change.
For example;
In the tutorial linked in the first post i tried just adding a stroke with the width of 4 px. But the stroke does not follow along with the grid like the shape does at the steeply angled parts of the arrow.
How do i solve that? Inner stroke option

Mhmm, well in the tutorial, the stroke is set to "outside" of the path, so if that is the effect you wish to achieve then you'll want to do the following:

- Make the original shape and give it a colour
- Duplicate the shape (select shape and hit Ctrl + D or Edit -> Duplicate), and give the new shape a stroke of whatever width you want (although you would have to double the value, so if you want a width of 2px, set the stroke to 4px)
- Move the duplicated image down (select image with and hit the "Page Down" key, or go to Object -> lower)

That should give you the desired result (I've attached a sample file using the method here -> http://www.petaimg.com/uploads/1223228634.svg)

As for the clipping method that sas suggested, you'll need to do the following:

- Make a path/shape and give it a fill and stroke (stroke must be twice as wide as desired stroke... so if you want a stroke of 2 px, give it a width of 4 px instead)
- Duplicate the path (select path and hit Ctrl + D or go to Edit -> Duplicate)
- Now, select BOTH the original shape and the duplicate shape with the tool (you can either click and drag to do a rubber-band selection, or you can click once and then Shift + Alt click again)
- While having both objects selected, go to Object -> Clip -> Set)

That should give you an image with an "inner" stroke. Be advised as this effect will probably not carry over if you save the file as a pdf or eps.

zials wrote:

Linkert wrote:Hmm, the W H thingy did not do nothing that i wanted? that is basically just changing the size of my shape- Or have i done something wrong?

Im very dependent of the option to have the stroke follow the shape/path on the inside. Why, well it asures me that the stroke follows the grid and that the size of the shape/path won't change.
For example;
In the tutorial linked in the first post i tried just adding a stroke with the width of 4 px. But the stroke does not follow along with the grid like the shape does at the steeply angled parts of the arrow.
How do i solve that? Inner stroke option

Mhmm, well in the tutorial, the stroke is set to "outside" of the path, so if that is the effect you wish to achieve then you'll want to do the following:

- Make the original shape and give it a colour
- Duplicate the shape (select shape and hit Ctrl + D or Edit -> Duplicate), and give the new shape a stroke of whatever width you want (although you would have to double the value, so if you want a width of 2px, set the stroke to 4px)
- Move the duplicated image down (select image with and hit the "Page Down" key, or go to Object -> lower)

That should give you the desired result (I've attached a sample file using the method here -> http://www.petaimg.com/uploads/1223228634.svg)

As for the clipping method that sas suggested, you'll need to do the following:

- Make a path/shape and give it a fill and stroke (stroke must be twice as wide as desired stroke... so if you want a stroke of 2 px, give it a width of 4 px instead)
- Duplicate the path (select path and hit Ctrl + D or go to Edit -> Duplicate)
- Now, select BOTH the original shape and the duplicate shape with the tool (you can either click and drag to do a rubber-band selection, or you can click once and then Shift + Alt click again)
- While having both objects selected, go to Object -> Clip -> Set)

That should give you an image with an "inner" stroke. Be advised as this effect will probably not carry over if you save the file as a pdf or eps.

The problem is now that the stroke is not aligned to the grid..

^ Thats weird, it aligns perfectly for me. If your original shape is aligned, then the stroke should be aligned too

zials wrote:^ Thats weird, it aligns perfectly for me. If your original shape is aligned, then the stroke should be aligned too

http://www.petaimg.com/uploads/1223292567.svg There is my arrow thingy...
As you see it does not align to the grid at three tips of the arrow.

Update!
I kept investigating the "Clipping" thing that Sas mentioned and it worked!

Linkert wrote:SVG??

SVG = Scalable Vector Graphics. Inkscape is an SVG editor.