As you may have noticed in the News section of the previous edition of FCM, a new minor release of Inkscape is out. As is often the case with these things, the announcement came only a couple of days after the deadline for my previous article. As it turns out, version 1.0.1 doesn’t fix any of the issues I’ve raised in recent months, or change any of the features that I’ve described. Phew! No corrections required. So what is new in the latest release? It’s mostly bug fixes and stability improvements, though there is a whole new “Selectors and CSS” dialog that is most likely to be of interest to web developers. I’ll cover it in due course, but it’s not the topic for this month’s instalment. Instead, I’ll cover some changes to the ‘Path > Stroke to Path’ function. To better understand this menu entry, however, I’m going to start with its sibling.
Comme vous l'avez peut-être remarqué dans la section Actualités de l'édition précédente du FCM, une nouvelle version mineure d'Inkscape est sortie. Comme c'est souvent le cas, l'annonce a été faite quelques jours seulement après la date limite de mon précédent article. Il s'avère que la version 1.0.1 ne corrige aucun des problèmes que j'ai soulevés ces derniers mois, ni ne modifie aucune des fonctionnalités que j'ai décrites. Ouf ! Aucune correction n'est nécessaire.
Quelles sont les nouveautés de la dernière version ? Il s'agit principalement de corrections de bogues et d'améliorations de la stabilité, bien qu'il y ait un tout nouveau dialogue « Sélecteurs et CSS » qui est très probablement intéressant pour les développeurs Web. Je vous en parlerai en temps voulu, mais ce n'est pas le sujet de l'article de ce mois-ci. Je vais plutôt parler des changements apportés à la fonction « Chemin > Contour en chemin ». Mais pour mieux comprendre cette entrée de menu, je vais commencer par sa sœur.
‘Path > Object to Path’ is a mainstay of any experienced Inkscape user. As the name suggests, it converts your object to a path, and is therefore commonly used when you want to break out of the design shackles imposed by an object’s native type. Whilst a rectangle can have only its width, height and corner radius modified, converting it into a path lets you move individual nodes, add more, or delete others. Since paths are so flexible, it can open up a world of design possibilities – albeit at the expense of losing access to the specialized editing tools for the original object type. There’s nothing controversial about Object to Path. The end result maintains its fill and stroke properties, so there’s no visual change as a result of the operation. All that’s happened is that your native Inkscape object becomes a generic path of the same size, shape and appearance.
La fonction « Chemin > Objet en chemin » est un élément essentiel pour tout utilisateur expérimenté d'Inkscape. Comme son nom l'indique, elle convertit votre objet en chemin, et est donc couramment utilisée lorsque vous souhaitez vous libérer des contraintes de conception imposées par le type natif d'un objet. Alors qu'un rectangle ne peut être modifié que dans sa largeur, sa hauteur et le rayon de ses coins, sa conversion en chemin vous permet de déplacer des nœuds individuels, d'en ajouter ou d'en supprimer d'autres. Les chemins étant très souples, ils peuvent ouvrir un monde de possibilités de conception - au prix toutefois de la perte de l'accès aux outils d'édition spécialisés pour le type d'objet d'origine.
Il n'y a rien de problématique pour Objet en Chemin. Le résultat final conserve ses propriétés de remplissage et de contour, de sorte que l'opération ne résulte en aucun changement visible. Tout ce qui s'est passé, c'est que votre objet Inkscape d'origine devient un chemin générique de même taille, forme et apparence.
Despite the similar name, however, Path > Stroke to Path is an entirely different beast. At its core it converts any stroke that you may have on your object into a new filled path which matches the stroke’s original outline. If it sounds confusing, perhaps some examples will help. Let’s start with the simplest example possible: a straight line. The top line is our original path, consisting of two nodes, no fill, and a thick, red stroke. As a rule it’s easiest to understand what Inkscape is doing when applied to thick strokes, but everything I describe can also be done with thinner strokes if that suits your requirements.
Cependant, malgré le nom similaire, Chemin > Contour en Chemin est un animal totalement différent. En effet, il convertit tous les traits que vous pouvez avoir sur votre objet en un nouveau chemin rempli qui correspond au contour original du trait. Si cela vous paraît déroutant, quelques exemples vous aideront peut-être. Commençons par l'exemple le plus simple possible : une ligne droite.
La ligne du haut est notre chemin d'origine, composé de deux nœuds, sans remplissage, et avec un trait rouge épais. En règle générale, il est plus facile de comprendre ce que fait Inkscape lorsqu'il est appliqué à des traits épais, mais tout ce que je décris peut également être fait avec des traits plus fins si cela répond à vos besoins.
The bottom line is the result of the Stroke to Path operation. You can see that what we now have is a filled path consisting of four nodes arranged to match the original stroke’s outline. The fact that it’s a filled path is a really important point to grasp: the original shape had a stroke but no fill, whereas the new shape has a fill but no stroke. The fill color of the new shape is the same as that of the original’s stroke color in order to produce a result that is visually identical. Why would you want to perform such a conversion? Consider trying to make a line that looks a little more hand-drawn. SVG has no support for variable width strokes, but you can fake it by converting your stroke to a path and then tweaking the shape.
La ligne du bas est le résultat de l'opération « Contour en Chemin ». Vous pouvez voir que ce que nous avons maintenant est un chemin rempli composé de quatre nœuds disposés de manière à correspondre au contour du trait original. Le fait qu'il s'agisse d'un chemin rempli est un point vraiment important à saisir : la forme originale avait un trait mais pas de remplissage, alors que la nouvelle forme a un remplissage mais pas de trait. La couleur de remplissage de la nouvelle forme est la même que celle du trait de l'original afin de produire un résultat visuellement identique.
Pourquoi voudriez-vous effectuer une telle conversion ? Envisagez d'essayer de faire une ligne qui semble un peu plus tracée à la main. Le SVG ne prend pas en charge les traits de largeur variable, mais vous pouvez faire semblant en convertissant votre trait en un chemin et en modifiant ensuite la forme.
These days Inkscape can simulate variable width strokes using Live Path Effects, but that wasn’t always the case. The LPE approach also supports varying the thickness only symmetrically, whereas this manual approach lets you achieve effects such as thickening the stroke on one side of the center line whilst thinning it on the other. Let’s look at a more complicated example. This time we’ll jump straight to a multi-segment line with a dashed stroke applied. Once again the original line is at the top, and the bottom shows the effect of converting the stroke to a path. Our converted line is starting to look a bit more interesting. Instead of a simple filled path, we now have a complex path, consisting of a number of filled sub-paths which match the visual appearance of the original line.
De nos jours, Inkscape peut simuler des traits de largeur variable en utilisant les Effets de chemin dynamiques (LPE), mais cela n'a pas toujours été le cas. L'approche par LPE permet également de ne faire varier l'épaisseur que symétriquement, alors que cette approche manuelle permet d'obtenir des effets tels que l'épaississement du trait d'un côté de la ligne centrale et son amincissement de l'autre.
Examinons un exemple plus compliqué. Cette fois-ci, nous allons passer directement à une ligne multi-segments faite avec un trait en pointillé. Une fois de plus, la ligne d'origine se trouve en haut, et le bas montre l'effet de la conversion du trait en un chemin.
Notre ligne convertie commence à être un peu plus intéressante. Au lieu d'un simple chemin rempli, nous avons maintenant un chemin complexe, composé d'un certain nombre de sous-chemins remplis qui correspondent à l'aspect visuel de la ligne originale.
At first, this can be a little tricky to get your head around. Because the resultant shape still looks the same, it’s not obvious that it’s actually now a filled path that has no stroke. Like any other path, you can actually add a stroke to it; here’s the same result but with a thin, dashed, black stroke added to the converted line: Hopefully it’s now pretty clear what Stroke to Path does when presented with the simple case of an object with just a stroke applied. But what happens when your object is a bit more complex? Here’s a line with a stroke applied, but also with markers at the start, end, and at each intermediate node.
Au début, cela peut être un peu difficile à comprendre. Comme la forme résultante est toujours la même, il n'est pas évident qu'il s'agisse en fait d'un chemin rempli qui n'a pas de contour. Comme pour tout autre chemin, vous pouvez y ajouter un contour ; voici le même résultat, mais avec un mince trait noir pointillé ajouté à la ligne convertie :
Heureusement, on voit maintenant assez clairement ce que fait Contour en Chemin lorsqu'on lui présente le cas simple d'un objet auquel on a simplement appliqué un trait. Mais que se passe-t-il lorsque votre objet est un peu plus complexe ? Voici une ligne sur laquelle un contour a été appliqué, mais aussi avec des marqueurs au début, à la fin et à chaque nœud intermédiaire.
What do you think should happen when Stroke to Path is applied to this object? To my mind there are three possible alternatives: • Remove the markers and convert the stroke as before. • Convert the stroke, but also turn the markers into filled paths. • Convert the stroke, but copy the markers to the new paths, so that each sub-path ends up with multiple markers. Really old versions of Inkscape went with option 1. Stroke to Path converted the stroke to a path, and ignored everything else. But since version 0.44 (released in 2006), Inkscape uses the second option (no version uses the third option). This, however, is where not-so-subtle differences in behaviour for 1.0.x start to creep in.
Que pensez-vous qu'il devrait se passer lorsque l'option « Contour en Chemin » est appliquée à cet objet ? À mon avis, il y a trois alternatives possibles : ••Retirer les marqueurs et convertir le trait comme auparavant. ••Convertir le trait, mais aussi transformer les marqueurs en chemins remplis. ••Convertir le trait, mais copier les marqueurs dans les nouveaux chemins, de sorte que chaque sous-chemin se retrouve avec plusieurs marqueurs.
Les très anciennes versions d'Inkscape ont choisi l'option 1. Contour en Chemin convertissait le contour en un chemin, et ignorait tout le reste. Mais depuis la version 0.44 (sortie en 2006), Inkscape utilise la deuxième option (aucune version n'utilise la troisième option). C'est toutefois là que des différences de comportement pas si subtiles commencent à se faire sentir pour la version 1.0.x.
Consider the shape above. Up to version 0.92 using Stroke to Path on this would have created a group containing five objects: the complex path generated by converting the stroke, and a separate path for each marker. In version 1.0.x the result is somewhat different. Now the output is a group containing two elements: the complex path, plus a nested group which contains four more deeply nested groups – one for each marker. Each of those marker groups contains two paths, one each for the fill and the stroke of the marker. Yes, I said the stroke of the marker. I know you probably weren’t even aware of markers having a separate stroke, but apparently they do and they’re now converted into a path of their own. If this sounds a little confusing, perhaps an image of the structure will help. On the left we have the Objects dialog from 0.92, and on the right we have one from 1.0.1 (excuse the different themes – the 1.0.1 snap is still broken with the standard theme, so I’m using the symbolic theme):
Considérez la forme ci-dessus. Jusqu'à la version 0.92, l'utilisation de l'option « Contour en Chemin » aurait créé un groupe contenant cinq objets : le chemin complexe généré par la conversion du trait et un chemin séparé pour chaque marqueur. Dans la version 1.0.x, le résultat est quelque peu différent. Maintenant, le résultat est un groupe contenant deux éléments : le chemin complexe, plus un groupe imbriqué qui contient quatre groupes plus profondément imbriqués - un pour chaque marqueur. Chacun de ces groupes de marqueurs contient deux chemins, un pour le remplissage et un pour le contour du marqueur. Oui, j'ai dit le contour du marqueur. Je sais que vous n'étiez probablement pas au courant que les marqueurs avaient un contour séparé, mais apparemment c'est le cas et ils sont maintenant convertis en un chemin qui leur est propre.
Si cela vous semble un peu déroutant, peut-être qu'une image de la structure vous aidera. À gauche, nous avons le dialogue des Objets de la version 0.92, et à droite, celui de la version 1.0.1 (excusez les différents thèmes - le snap de la version 1.0.1 est toujours en rupture avec le thème standard, donc j'utilise le thème symbolique) :
As you can see, the structures are substantially different. If you do want to convert a 1.0 arrangement to the old structure, it’s quite simple: you just need to use Path > Union on each pair of marker paths (this is easier if you select them in the Objects dialog rather than on-canvas), then select the group that contains the markers (i.e. not the top-level group, but the one just inside that), then repeatedly ungroup until you’re left with a structure that looks like the one in the 0.92 dialog. Yes, “it’s quite simple” was sarcasm. For most users, this may never present a problem. The sort of use-case that requires you to add markers to your path does not generally intersect much with the use-cases for converting the stroke to a path. So, let’s look at a far more common scenario: a path with both a stroke and a fill, but no markers. Here’s what happens in 0.92.x, again with the original shapes at the top, and the Stroke to Path conversions at the bottom:
Comme vous pouvez le voir, les structures sont sensiblement différentes. Si vous voulez convertir un arrangement 1.0 en ancienne structure, c'est très simple : il suffit d'utiliser Chemin > Union sur chaque paire de chemins de marqueurs (c'est plus facile si vous les sélectionnez dans la boîte de dialogue des Objets plutôt que sur le canevas), puis de sélectionner le groupe qui contient les marqueurs (c'est-à-dire pas le groupe de niveau supérieur, mais celui qui se trouve juste à l'intérieur), puis de le dégrouper à plusieurs reprises jusqu'à ce qu'il vous reste une structure qui ressemble à celle de la boîte de dialogue 0.92. Oui, le « c'est assez simple » était sarcastique.
Pour la plupart des utilisateurs, cela peut ne jamais poser de problème. Le type de cas d'utilisation qui vous oblige à ajouter des marqueurs à votre chemin ne recoupe généralement pas beaucoup les cas d'utilisation pour la conversion du contour en chemin. Examinons donc un scénario beaucoup plus courant : un chemin avec un contour et un remplissage, mais sans marqueurs. Voici ce qui se passe en 0.92.x, là encore avec les formes originales en haut, et les conversions de Contour en Chemin en bas :
The obvious take-away from this is that 0.92 removes the fill entirely before the stroke is converted to a path. I’ve shown both closed and open shapes to make it clear that the behaviour is the same in both cases. Structurally, you end up with a single filled path, just the same as you would if you’d performed the conversion on a shape with no fill or markers, the same as the first example I showed in this article. Since version 1.0, however, performing a Stroke to Path operation on a shape with a fill results in a group that contains two filled paths: one is the usual path following the shape of the original stroke, whilst the other is a path representing the fill (i.e. it’s just a copy of the original path, but without the stroke). The end result is visually identical to the original object.
Ce qu'il faut retenir de cette conversion est que, dans la 0,92, le remplissage est entièrement supprimé avant que le contour ne soit converti en chemin. J'ai montré des formes ouvertes et fermées pour montrer clairement que le comportement est le même dans les deux cas. Structurellement, vous vous retrouvez avec un seul chemin rempli, tout comme si vous aviez effectué la conversion sur une forme sans remplissage ni marqueurs, comme dans le premier exemple que j'ai montré dans cet article.
Depuis la version 1.0, cependant, l'exécution d'une opération « Contour en Chemin » sur une forme avec un remplissage donne un groupe qui contient deux chemins remplis : l'un est le chemin habituel suivant la forme du contour original, tandis que l'autre est un chemin représentant le remplissage (c'est-à-dire qu'il s'agit simplement d'une copie du chemin original, mais sans le contour). Le résultat final est visuellement identique à l'objet original.
As I’m sure you’ve guessed by now, performing a Stroke to Path on a shape with the holy trinity of stroke, fill and markers, results in a group containing: • A path for the stroke • A path for the fill • A group containing an individual group for each marker, with each of those groups containing a path for the marker’s stroke and a path for the marker’s fill. There are a few things to unpick from these changes. First of all, if you have an object with just a stroke then the behaviour is the same as it has always been: you end up with a single filled path, which will have sub-paths if the stroke was dashed.
Comme vous l'avez sûrement deviné, en effectuant un Contour en Chemin sur une forme avec la trinité sacrée du contour, du remplissage et des marqueurs, le résultat obtenu est un groupe contenant : ••Un chemin pour le contour ••Un chemin pour le remplissage ••Un groupe contenant un groupe individuel pour chaque marqueur, chacun de ces groupes contenant un chemin pour le contour du marqueur et un chemin pour le remplissage du marqueur.
Il y a quelques points à tirer de ces changements. Tout d'abord, si vous avez un objet avec juste un trait, le comportement est le même qu'il a toujours été : vous vous retrouvez avec un seul chemin rempli, qui aura des sous-chemins si le trait était en pointillé.
If your path has a stroke and a fill, however, you’ll now end up with a group, rather than the fill being thrown away. This is particularly important to note if following an older tutorial. Many of them either rely on the fill being removed, or instruct you to duplicate the object before applying Stroke to Path so that you don’t lose the fill. To get the same result as earlier versions, you can do one of two things: • Remove the fill before using Stroke to Path. • After using Stroke to Path, ungroup the result and delete the new path containing the fill (or just keep it, if you need it for subsequent steps). Despite the confusion this change has caused with some new users, I generally think it’s an improvement. Consider the case of drawing a simple cartoon character, with thick black outlines (strokes), and colored clothes and skin (fill). If you want to add some variety to the stroke thickness, the new behaviour makes it easier to do so without having to duplicate every object, then remove its stroke, just to keep a copy of the filled shape.
En revanche, si votre chemin comporte un contour et un remplissage, vous vous retrouverez avec un groupe, au lieu d'éliminer le remplissage. Il est particulièrement important de le noter si vous suivez un ancien tutoriel. Beaucoup d'entre eux se basent sur le fait que le remplissage est supprimé, ou vous demandent de dupliquer l'objet avant d'appliquer la fonction Contour en Chemin afin de ne pas perdre le remplissage. Pour obtenir le même résultat que dans les versions précédentes, vous pouvez faire l'une des deux choses suivantes ••Supprimer le remplissage avant d'utiliser Contour en Chemin. ••Après avoir utilisé Contour en Chemin, dégroupez le résultat et supprimez le nouveau chemin contenant le remplissage (ou conservez-le simplement, si vous en avez besoin pour les étapes suivantes).
Malgré la confusion que ce changement a provoquée chez certains nouveaux utilisateurs, je pense généralement que c'est une amélioration. Prenons le cas du dessin d'un simple personnage de bande dessinée, avec des contours noirs épais (traits), et des vêtements et une peau colorés (remplissage). Si vous souhaitez varier l'épaisseur des traits, le nouveau comportement permet de le faire plus facilement sans avoir à dupliquer chaque objet, puis à supprimer son trait, juste pour garder une copie de la forme remplie.
Markers are another matter, however. While dealing with an unwanted fill just requires a couple of extra steps, getting the 0.92 structure when markers are in play requires several steps – multiplied by the number of markers – with no easy shortcuts. Although the new functionality may technically be more flexible, in practice there are few use-cases for separating the fill and stroke on a marker. It would have been nice to either have the old method available as a preference, or to include a function or extension that would make it easy to union deeply nested paths and recursively pop them out of their groups. The take-away from all this is that Object to Path still behaves the same way it always did, Stroke to Path may need an extra step or two if you have a fill, but if you have markers as well then good luck to you! Next time, I’ll start to look at the changes to core drawing tools made with version 1.0.
Mais les marqueurs sont une autre histoire. Alors que le traitement d'un remplissage indésirable ne nécessite que quelques étapes supplémentaires, obtenir la structure de la 0.92 lorsque des marqueurs sont en jeu nécessite plusieurs étapes - multipliées par le nombre de marqueurs - sans aucun raccourci facile. Bien que la nouvelle fonctionnalité soit techniquement plus flexible, dans la pratique, il existe peu de cas d'utilisation pour séparer le remplissage et le contour sur un marqueur. Il aurait été bon d'avoir l'ancienne méthode comme préférence ou d'inclure une fonction ou une extension qui faciliterait l'union de chemins profondément imbriqués et les ferait sortir récursivement de leurs groupes.
Ce qu'il faut retenir de tout cela est que Objet en Chemin se comporte toujours de la même manière, Contour en Chemin peut nécessiter une ou deux étapes supplémentaires si vous avez un remplissage, mais si vous avez aussi des marqueurs, alors bonne chance à vous !
La prochaine fois, je commencerai à examiner les modifications apportées aux outils de dessin de base dans la version 1.0.