I've recently developed an Inkscape extension called PixelSnap. It makes it much more convenient to align all your objects to pixel boundaries, without having to snap each one individually to a grid.

If you're interested, you can download the extension at http://code.google.com/p/pixelsnap/

That looks pretty interesting. I'll have to give it a try. Thank-you.

Inkscape's snapping fine as long as you set your grids before you start. Not that there aren't plenty of examples of folks who don't know that.

On the extension: Looks pretty good, based on by so-far simple trials. I was going to suggest you snapped borders to half-points or full points dependent on (rounded) stroke width; however it appears to do this, and the text that implies it (always) snaps borders to half-points is thus wrong.

heathenx, thanks. I hope you enjoy using the plugin!

Slow Dog, yes, you're right: Inkscape's snapping works fine. However, there's a few reasons it's not so convenient for this purpose:
1) I don't like to edit with grids always on. They get in the way of seeing how the design really looks, and it's hard to edit some things with grids on.
2) I don't always want *all* my objects snapped to pixels, just ones with vertical/horizontal segments
3) If I scale, or move an object, while zoomed in, and I have the stroke set to scale accordingly, the stroke-size won't be an integer number of pixels, even if I do have appropriate grids.

But I take your point, and I appreciate that you probably have a different workflow than I do.

I appreciate your comments on the extension. Yes, you're right. Snapping to half-or-full points isn't quite as I described. I didn't want to complicate my explanation on the homepage by describing too many internal details, but I guess I should try and be accurate.

bryhoyt wrote:I didn't want to complicate my explanation on the homepage by describing too many internal details, but I guess I should try and be accurate.

It's the message within the extension itself I was referring to. I've never seen it snap to a half-point, even when I tried things where I thought it might. Still, I've only tried it a few times

I appreciate that you probably have a different workflow than I do

Well, your web-page says:

it requires a lot of tedious work to align every single object. The normal process is something like:

[Tedious process described]

I use Inkscape mostly to design (small) icons for the screen. I never do anything that's described in that process. Grids, screen size, scaling options are set as my default before I start. [/Edit's to moderate my tone] I'd say if someone's using Inkscape the way you describe, then they're not using the features Inkscape itself provides to avoid those issues. The extension's a useful rescue feature; if it's more than that, I'sd suggest your workflow is flawed.

If you create a one-pixel-wide (non-even width) horizontal or vertical line, it should snap to a half pixel. Of course, it's the *node* that will be snapped, not the edge of the stroke, so at 100% zoom, the stroke-edge will appear on a pixel boundary, which is exactly what we want to make it look sharp. If it works any other way, can you please post a bug on the issues page: http://code.google.com/p/pixelsnap/issues/list. Thanks!

Regarding my workflow, perhaps yes it is flawed. But I'm curious to know how I'm supposed to avoid the tedious process I described. I don't use Inkscape for icon design, I use it to design webpages, usually having more than 15 different objects (header image, sidebar box, separating lines, toolbars, etc etc). Sure, if I edit each object meticulously, I can keep it aligned to pixel-boundaries, with care.

But that's only one of the ways I use Inkscape. Say, for example, I have 3 pixel-perfect rectangles, grouped (for some reason I'm liking rectangles that day). Then I decide "these rectangles are awesome, but the whole cluster needs to be 50% bigger". So I use Inkscape's very useful stretch arrows, with the Ctrl-key held down to keep it proportional, and make it 50% bigger. Suddenly, even if I've got grids turned on:
1) the stroke width is 1.5 pixels wide, if I've selected the "Resize affects stroke-widths" button
2) the height & width of the rectangles is very likely a non-integer number
3) the x,y position of the rectangles is very likely a non-integer number

This is a very common scenario, and I don't see how it's using Inkscape wrongly in any way, and I don't know of any tools that Inkscape provides to avoid having to tediously edit each rectangle.

Very interested in your opinion, though! Sounds like you know what you're doing.

bryhoyt wrote:If you create a one-pixel-wide (non-even width) horizontal or vertical line, it should snap to a half pixel.

D'oh. Yep, of course it does.

So I use Inkscape's very useful stretch arrows, with the Ctrl-key held down to keep it proportional, and make it 50% bigger. Suddenly, even if I've got grids turned on:
[unaligned stuff].

So, "don't do that, then".

More seriously, your example is one where there is no good answer. I'd probably start by moving/scale the group in a grid-fitting manner (grid fitting in any manner can't preserve exact proportion), but it's fiddly whatever you do, and yes, your tool could help.

You actually announced your tool in a thread where I described my working method. I have "scale strokes" turned off, so that wouldn't be an issue - it's otherwise a problem nearly every time you scale. You'd probably want to increase stroke with on larger scalings, though. That's a time I think I will use your tool - if a stroke width goes from odd to even, and thus the snap from half-to full pixels (or vice versa).

Ah thanks for pointing out that you're the same person from the other thread. Obviously I wasn't being very observant.

Thanks for your useful tips, its helped me to think about using Inkscape more carefully. I'll probably still use my extension heaps, tho, I can't imagine living without it now!

Thanks for this extension bryhoyt. I just downloaded it to give it a test drive, sadly without any luck.

I installed as described, putting the .py and .inx files in ~/.inkscape/extensions (and later I found ~/.config/Inkscape/extensions also). I restart Inkscape, and cannot see any menu entries for PixelSnap. Certainly not under the Extensions menu.

Using Inkscape Devel 0.47 on CrunchBang Linux (Ubuntu basically). Any noob-friendly suggestions warmly welcomed.

Foomandoonian wrote:Thanks for this extension bryhoyt. I just downloaded it to give it a test drive, sadly without any luck.

I installed as described, putting the .py and .inx files in ~/.inkscape/extensions (and later I found ~/.config/Inkscape/extensions also). I restart Inkscape, and cannot see any menu entries for PixelSnap. Certainly not under the Extensions menu.

Using Inkscape Devel 0.47 on CrunchBang Linux (Ubuntu basically). Any noob-friendly suggestions warmly welcomed.

On my system the path is ..\inkscape\share\extensions. Hope this helps.

bryhoyt, thanks for this - I'm sure I'm going to find PixelSnap a very useful plugin to iron out those fuzzy wrinkles. Nice one.

Hi Foomandoonian,

Hmm, that's odd. I don't have my system available to test just at this moment, but can you please post an issue on the Issues page at http://code.google.com/p/pixelsnap/issues/list ? That will help me keep track of this issue until it gets solved.

Another useful thing to check is that the version of Inkscape you think you're running is actually the right one -- I've no reason to think otherwise, but I've had it before where I've had to Inkscapes installed, one 0.46 from the default Ubuntu repos, and another 0.47 that I compiled. You can find which version is running in Inkscape's Help->About menu.

Thank you, and I hope we get this bug resolved.

I often do as follows:
- have a group of horiz. lines
- move the first one where I want to be the start of those distributed lines
- move the second one where I want to be the end of it
- set Align and distribute - ... equidistantly

How do I make sure that all the lines will be crisp and clear when exported to bitmap?

Even more complicated case - with texts as they "snap-point" is at some weird place outside the text boundary.

Edit:
Here's another example
http://i17.photobucket.com/albums/b68/B ... ark_bu.png (see attachment for svg). Any hints on improving the clearness of the image (especially the embedded bitmap)? Can it still be solved by snapping to pixel grid? i.e. what should be the right workflow you mention?

Such an extension is not needed.
Once I needed pixel-perfect export and I figured out a very simple & neat technique to do so.
Here it is:

1. Show grid and set up its unit to be a pixel. Let the grid be temporarily offset by 0.5 pixel left and up. This is the crux of this method.
2. Create a layer which will be always beneath all of your layers (I often call it "background").
3. On that layer, draw a rectangle which encompasses all you want to export as bitmap (it's also useful for cutting the image to a frame you want). Let the rectangle be white. Alternatively, you can create this layer above all your layers and the rectangle can be of any color you want. Sometimes I use a semi-transparent rectangle of some color (e.g. red) to create sort-of a "selection" around my picture and then, when I need to export my image as bitmap, I select this rectangle and then hide the whole layer (the rectangle stays selected), and in the export dialog I choose to export only the current selection.
4. Now, when your rectangle is aligned to the half-of-a-pixel boundary already, you can safely restore the grid offset to be 0:0 again, and keep all your objects aligned to that grid lines.

This way you can always export a pixel-perfect bitmap from your picture by selecting this half-pixel offset rectangle and exporting the selection with correct number of pixels. This way all your objects' edges will be offset half of a pixel each way in your exported image, which makes them to be perfectly aligned to pixels in the bitmap, instead of shifted and blurred.

Simple as that