I first described the Taper Stroke LPE in part 67 of this series (FCM#127). Back then, it was in the context of manually tracing an image. As an example, I took the ‘Frankie’ cartoon character, originally drawn by Vincent Mealing for our “Monsters, Inked” comic series, and traced over a scan of the original artwork using a variety of techniques. The Taper Stroke effect was used as a quick-and-easy way to produce more interesting outlines, without going to the full extent of using the Power Stroke LPE. Here’s a screenshot that appeared in the article, showing the result of using the effect in the drawing, and the UI for the LPE as it was at that time. With Inkscape version 1.1, several new additions were made to the Taper Stroke parameters – enough to warrant a quick update in this series. Here’s how the UI appears now: The first change is that the Taper Smoothing control has now been split into two parameters, governing the start and end smoothing respectively. In this context, smoothing refers to the shape of the taper, from a very rounded taper (smoothing: 1.0) to a straight line (smoothing: 0). You can see both of these used on the image below, which shows some of the effects that can be produced with this LPE when used on exaggeratedly thick lines. The Left-hand line displays the sensible limits of the smoothing parameter (1.0 at the top, and 0 at the bottom), while the rightmost line shows the effect of setting these to more extreme values (+/- 10.0 in this case).
J'ai décrit pour la première fois le LPE Contour fuselé dans la partie 67 de cette série (FCM n° 127). À l'époque, c'était dans le contexte du traçage manuel d'une image. À titre d'exemple, j'ai pris le personnage de bande dessinée « Frankie », dessiné à l'origine par Vincent Mealing pour notre série de bandes dessinées « Monsters, Inked », et j'ai tracé par-dessus un scan de l'œuvre originale en utilisant diverses techniques. L'effet Contour fuselé a été utilisé comme un moyen rapide et facile de produire des contours plus intéressants, sans aller jusqu'à utiliser le LPE Contour dynamique. Voici une capture d'écran parue dans l'article, montrant le résultat de l'utilisation de l'effet dans le dessin, et l'interface utilisateur du LPE telle qu'elle était à l'époque.
Avec la version 1.1 d'Inkscape, plusieurs nouveaux ajouts ont été apportés aux paramètres de l'effet Contour fuselé, suffisamment pour justifier une mise à jour rapide dans cette série. Voici comment l'interface utilisateur apparaît maintenant :
Le premier changement est que le contrôle du lissage conique a maintenant été divisé en deux paramètres, régissant respectivement le lissage de début et de fin. Dans ce contexte, le lissage fait référence à la forme de l'effilement, d'un effilement très arrondi (lissage : 1,0) à une ligne droite (lissage : 0). Vous pouvez voir ces deux types d'utilisation sur l'image ci-dessous, qui montre certains des effets qui peuvent être produits avec cet LPE lorsqu'il est utilisé sur des lignes exagérément épaisses. La ligne de gauche affiche les limites raisonnables du paramètre de lissage (1,0 en haut, et 0 en bas), tandis que la ligne la plus à droite montre l'effet du réglage à des valeurs plus extrêmes (+/- 10,0 dans ce cas).
This image also shows the other addition to this LPE: the ability to alter the direction of the taper. The second and fourth lines use the default “center” direction, but the first and third have their start and end directions variously set to “left” and “right”. These are the only three options available – it’s not possible to have a taper that terminates only slightly left of center, for example. It’s worth noting that the “left” and “right” designations are relative to the direction of the path. Imagine walking along the path from start to finish to determine which side of it is which. In the image below, the left-hand line has its directions set to “left”, and the right-hand line has its directions set to “right”, yet they both appear the same. The difference is that the former was drawn from bottom to top, and the latter from top to bottom. This also means that using Path ‣ Reverse on a shape with this LPE applied will flip the visible directions of the tapers, so watch out for that one if you’re forced to reverse the path for other reasons! I’ve left the leftmost line selected in order to show the handles that are visible when the Node tool (F2) is active. As has always been the case, you can drag these handles to adjust the length of the start and end tapers. A new addition, however, is that you can now shift-click on them to cycle between the three direction values, making it quick and easy to experiment with this upgraded capability. With that, we’ve reached the end of the new Live Path Effects added in Inkscape 1.0 and 1.1 (I’m skipping the experimental LPEs for the reasons mentioned last time). But these releases also brought with them some new extensions, which I’ll describe below, and next month. These can all be found under the Extensions menu, of course, and I’ve included the relevant submenu at the start of each section title.
Cette image montre également l'autre ajout à ce LPE : la possibilité de modifier la direction du cône. Les deuxième et quatrième lignes utilisent la direction « centrale » par défaut, mais les première et troisième lignes ont leurs directions de début et de fin réglées sur « gauche » et « droite ». Ce sont les trois seules options disponibles - il n'est pas possible d'avoir un cône qui se termine légèrement à gauche du centre, par exemple.
Il est important de noter que les désignations « gauche » et « droite » sont relatives à la direction du chemin. Imaginez-vous en train de marcher le long du chemin du début à la fin pour déterminer quel côté est à droite et quel côté est à gauche. Dans l'image ci-dessous, la ligne de gauche est orientée à « gauche » et la ligne de droite est orientée à « droite », mais elles semblent identiques. La différence est que la première a été dessinée de bas en haut, et la seconde de haut en bas. Cela signifie également que l'utilisation de Chemin ‣ Inverser sur une forme à laquelle ce LPE est appliqué inversera les directions visibles des cônes, alors faites attention à cela si vous êtes obligé d'inverser le chemin pour d'autres raisons !
J'ai laissé la ligne la plus à gauche sélectionnée afin de montrer les poignées qui sont visibles lorsque l'outil Nœud (F2) est actif. Comme cela a toujours été le cas, vous pouvez faire glisser ces poignées pour ajuster la longueur des cônes de début et de fin. Cependant, vous pouvez désormais cliquer sur ces poignées avec la touche maj enfoncée pour passer d'une valeur de direction à l'autre, ce qui vous permet d'expérimenter rapidement et facilement cette fonctionnalité améliorée.
Avec cela, nous avons atteint la fin des nouveaux effets dynamiques de chemin (LPE) ajoutés dans Inkscape 1.0 et 1.1 (je passe sur les LPE expérimentaux pour les raisons mentionnées la dernière fois). Mais ces versions ont également apporté de nouvelles extensions, que je décrirai ci-dessous, et le mois prochain. Elles se trouvent toutes dans le menu Extensions, bien sûr, et j'ai inclus le sous-menu correspondant au début de chaque titre de section.
Render > Frame Let’s start with a simple extension. This one draws a “frame” around each selected object in your image. I’ve put the word “frame” in quotes because it suggests something far more impressive than the result this extension produces. You might imagine an ornate picture frame, a Celtic knot style border, or perhaps something sweeping and calligraphic. Instead, what you actually get is what appears to be a rounded rectangle around each selected object. Except it’s not even a rounded rectangle – it’s a path – so there’s no easy way to change the corner radius after the fact. Drawing a rectangle that exactly hugs the outside of an arbitrary object is a little tricky in Inkscape. But it’s not exactly rocket science either. The simplest approach I know of is to duplicate your object, select Object ‣ Objects To Guides, then draw a rectangle by snapping to the intersections between the guidelines. This extension reduces those few steps down to one, but doesn’t really offer many other advantages as it does so. Let’s look at it in action. We’ll begin by selecting multiple items on the canvas. In this case there are two selections – one single star at the top, and one group of two stars at the bottom. Now we’ll run the extension with some pretty standard values to get started: Position is set to Outside, the checkboxes are left un-ticked, the stroke width is set to 2px and the corner radius to 10. Finally the stroke color is set to black, and the fill (on the second tab) is transparent (alpha = 0). Here’s the result:
Rendu > Cadre
Commençons par une extension simple. Celle-ci dessine un « cadre » autour de chaque objet sélectionné dans votre image. J'ai mis le mot « cadre » entre guillemets car il suggère quelque chose de bien plus impressionnant que le résultat produit par cette extension. Vous pourriez imaginer un cadre orné, une bordure de type nœud celtique, ou peut-être quelque chose d'épuré et de calligraphique. Au lieu de cela, ce que vous obtenez en réalité est ce qui semble être un rectangle arrondi autour de chaque objet sélectionné. Sauf qu'il ne s'agit même pas d'un rectangle arrondi, mais d'un chemin, et qu'il est impossible de modifier le rayon des coins après coup.
Dessiner un rectangle qui épouse exactement l'extérieur d'un objet arbitraire est un peu délicat dans Inkscape. Mais ce n'est pas non plus très compliqué. L'approche la plus simple que je connaisse consiste à dupliquer votre objet, à sélectionner Objet ‣ Objets en guides, puis à dessiner un rectangle en le fixant aux intersections entre les lignes directrices. Cette extension réduit ces quelques étapes à une seule, mais n'offre pas vraiment d'autres avantages en le faisant.
Regardons-la en action. Nous allons commencer par sélectionner plusieurs éléments sur le canevas. Dans ce cas, il y a deux sélections - une seule étoile en haut et un groupe de deux étoiles en bas.
Nous allons maintenant exécuter l'extension avec des valeurs assez standard pour commencer : la Position est réglée sur Externe, les cases à cocher ne sont pas cochées, la largeur du trait est réglée sur 2 px et le rayon de l'angle sur 10. Enfin, la couleur du trait est définie sur noir et le remplissage (sur le deuxième onglet) est transparent (alpha = 0). Voici le résultat :
The Inside/Outside popup can be used to determine whether the frame is drawn inside the bounding box of the selected object, or outside it. The difference is most obvious when the stroke thickness is cranked up a little – to 10px in this example. The Clip checkbox determines whether or not the selected item should be clipped to the size of the frame. Often this will make little difference, but if your object has a thick border, for example, this can theoretically hide the portion that extends outside the frame. I say “theoretically” because I have not been able to get this feature to work reliably at all. Most of the time enabling the Clip option just results in the entire object being removed. I have seen it work correctly on one occasion, but I haven’t been able to reproduce that behaviour since. The Group checkbox, on the other hand, does seem to work. But all it does is group the selected object with its corresponding frame, saving you a small manual step if you need to keep the object and its frame together in this way.
La fenêtre contextuelle Interne/Externe permet de déterminer si le cadre est dessiné à l'intérieur ou à l'extérieur de la boîte de délimitation de l'objet sélectionné. La différence est plus évidente lorsque l'épaisseur du trait est légèrement augmentée - à 10 px dans cet exemple.
La case à cocher Chemin de découpe détermine si l'élément sélectionné doit être découpé à la taille du cadre. Souvent, cela fait peu de différence, mais si votre objet a une bordure épaisse, par exemple, cela peut théoriquement masquer la partie qui dépasse du cadre. Je dis « théoriquement » car je n'ai pas réussi à faire fonctionner cette fonction de manière fiable. La plupart du temps, l'activation de l'option Chemin de découpe entraîne la suppression de l'objet entier. J'ai vu cette option fonctionner correctement à une occasion, mais je n'ai pas été en mesure de reproduire ce comportement depuis.
La case à cocher Groupe, en revanche, semble fonctionner. Mais tout ce qu'elle fait, c'est regrouper l'objet sélectionné avec son cadre correspondant, ce qui vous évite une petite étape manuelle si vous avez besoin de garder l'objet et son cadre ensemble de cette façon.
The new frame is rendered on top of the selected object. Bear that in mind before setting the Fill tab to use an opaque color, as it will obscure the original element. You can change the stacking order after applying the extension, of course, but it’s another step to be aware of. I don’t really see the point in this extension. It would make some sense if there was a field in which to add a padding value, allowing for frames that don’t hug the content quite so tightly. If the frame could be rendered in the background as well, this would provide an easy way to add a box and background color for multiple items, turning them into buttons or icons, for example. As it stands, I see little benefit of using this extension over learning the small number of steps to perform this task manually, unless you have a very large number of objects that require tightly fitting rectangles around them for some reason. Ironically the next extension would have been a perfect example of a use for this feature, if it wasn’t for the fact that the output of the Frame extension is not at all in the right form for Export Layer Slices to use…
Le nouveau cadre est rendu par-dessus l'objet sélectionné. Gardez cela à l'esprit avant de définir l'onglet Remplissage pour utiliser une couleur opaque, car elle obscurcira l'élément d'origine. Vous pouvez bien sûr modifier l'ordre d'empilement après avoir appliqué l'extension, mais il s'agit d'une étape supplémentaire dont il faut tenir compte.
Je ne vois pas vraiment l'intérêt de cette extension. Elle aurait un sens s'il y avait un champ dans lequel on pouvait ajouter une valeur de rembourrage, ce qui permettrait de créer des cadres qui ne serrent pas le contenu aussi étroitement. Si le cadre pouvait également être rendu en arrière-plan, cela fournirait un moyen facile d'ajouter un cadre et une couleur d'arrière-plan pour plusieurs éléments, les transformant en boutons ou en icônes, par exemple. En l'état actuel des choses, je ne vois pas l'intérêt d'utiliser cette extension plutôt que d'apprendre le petit nombre d'étapes pour effectuer cette tâche manuellement, à moins que vous n'ayez un très grand nombre d'objets qui nécessitent des rectangles serrés autour d'eux pour une raison quelconque. Ironiquement, l'extension suivante aurait été un parfait exemple d'utilisation de cette fonctionnalité, si ce n'était du fait que la sortie de l'extension Cadre n'est pas du tout sous la bonne forme pour l'utilisation de Export Layer Slices…
Export > Export Layer Slices Inkscape already has a native mechanism for exporting multiple items in a document as separate PNG files, via the Batch Export feature in the File ‣ Export PNG Image… dialog. This assumes that the items you want to export are individual elements, or are already grouped in the right way. You can get around this limitation by simply creating a layer on which to draw some rectangles (or other shapes) that mark out the sections of the page to export, then perform a Batch Export with those rectangles selected. Here’s a tip: if you don’t want the rectangles themselves to appear as part of the exported files, select them all and then hide the layer before you hit the Export button in the dialog – the Batch Export checkbox should still say “Batch export N selected objects”, where N is the number of shapes you selected in your slicing layer, but you’re not left with a visible stroke around the edge of each PNG. The Export Layer Slices extension essentially does the same thing. To use it you have to create a slicing layer, then draw rectangles to mark the areas to be cut out and saved as separate PNGs. The layer has to be at the top level (rather than being a sub-layer), and the rectangles must actually be rectangles (i.e. <rect> elements in the XML), not paths or any other shape. The Export dialog approach doesn’t have either of these limitations. When creating your slicing layer, you need to ensure that the name of the layer is the same as the name used in the extension’s UI. By default, this is “slices”, so the easiest approach is simply to give your layer the same name.
Exporter > Export Layer Slices
Inkscape dispose déjà d'un mécanisme natif permettant d'exporter plusieurs éléments d'un document sous forme de fichiers PNG distincts, via la fonction d'exportation par lots de la boîte de dialogue Fichier ‣ Exporter une image PNG…. Cela suppose que les éléments que vous souhaitez exporter sont des éléments individuels, ou sont déjà regroupés de la bonne manière. Vous pouvez contourner cette limitation en créant simplement un calque sur lequel dessiner quelques rectangles (ou d'autres formes) qui délimitent les sections de la page à exporter, puis en effectuant une exportation par lot avec ces rectangles sélectionnés. Un conseil : si vous ne voulez pas que les rectangles eux-mêmes apparaissent dans les fichiers exportés, sélectionnez-les tous, puis cachez le calque avant d'appuyer sur le bouton Exporter de la boîte de dialogue. La case à cocher Exporter par lots devrait toujours indiquer « Exporter par lots N objets sélectionnés », où N est le nombre de formes que vous avez sélectionnées dans votre calque de découpage, mais vous n'aurez pas de trait visible sur le bord de chaque PNG.
L'extension Export Layer Slices fait essentiellement la même chose. Pour l'utiliser, vous devez créer un calque de découpage, puis dessiner des rectangles pour marquer les zones à découper et à enregistrer sous forme de PNG distincts. Le calque doit être au niveau supérieur (plutôt que d'être un sous-calque), et les rectangles doivent être réellement des rectangles (c'est-à-dire des éléments <rect> dans le XML), et non des chemins ou toute autre forme. L'approche par la boîte de dialogue d'exportation ne présente aucune de ces limitations.
Lorsque vous créez votre calque de découpage, vous devez vous assurer que le nom du calque est le même que celui utilisé dans l'interface utilisateur de l'extension. Par défaut, il s'agit de « slices », donc l'approche la plus simple est de donner tout simplement le même nom à votre calque.
Set your export directory, and the DPI for the images, and hit the Apply button to create your PNG files. If you want fine control over the filenames, you can first change the ID of each rectangle via the Object ‣ Object Properties dialog (don’t forget to hit the “Set” button). And you probably also want to tick the “Overwrite existing exports” checkbox, otherwise the extension will refuse to replace any existing files with the same names. Unfortunately, this extension suffers from a major flaw, as far as I am concerned. Given that you have to create a whole separate layer to define the slicing regions, I would expect that layer to be omitted from the exported images. After all, it xists only to provide some dimensions, it’s not actually part of the drawing itself. But no, every exported image includes the rectangle’s stroke and fill as part of the PNG. The easy workaround is to hide the layer before running the extension; unlike the equivalent Export dialog workaround, there’s no need to select the rectangles first, but it’s still a bit of a pain having to repeatedly hide and unhide it, if you’re trying to fine-tune the sizes and positions of the slices. But perhaps you want the rectangle included, to provide a nice border for your exported PNG. You take the time to set the stroke width and color… only to find that your own choice of styles is replaced by the extension after the export. The rectangle’s stroke is removed and the fill is replaced with a shade of gray (file already exists and was not overwritten), red (file exists, but was overwritten), or green (file was created for the first time). If you want to try the export again, you’ll need to revert all those back to their original styles unless you really want a red overlay added to all your PNGs!
Définissez votre répertoire d'exportation et le DPI des images, puis cliquez sur le bouton Appliquer pour créer vos fichiers PNG. Si vous voulez un contrôle fin des noms de fichiers, vous pouvez d'abord modifier l'ID de chaque rectangle via la boîte de dialogue Objet ‣ Propriétés de l'objet (n'oubliez pas d'appuyer sur le bouton « Définir »). Et vous voudrez probablement aussi cocher la case « Overwrite existing exports » (Écraser les exportations existantes), sinon l'extension refusera de remplacer tout fichier existant portant le même nom.
Malheureusement, cette extension souffre d'un défaut majeur, en ce qui me concerne. Étant donné que vous devez créer un calque séparé pour définir les zones de découpage, je m'attendrais à ce que ce calque soit omis dans les images exportées. Après tout, il n'existe que pour fournir des dimensions, il ne fait pas réellement partie du dessin lui-même. Mais non, chaque image exportée inclut le trait et le remplissage du rectangle dans le PNG. La solution de contournement la plus simple consiste à masquer le calque avant d'exécuter l'extension ; contrairement à la solution équivalente de la boîte de dialogue Exporter, il n'est pas nécessaire de sélectionner d'abord les rectangles, mais c'est toujours un peu pénible de devoir le masquer et le démasquer à plusieurs reprises, si vous essayez d'ajuster les tailles et les positions des tranches.
Mais peut-être voulez-vous que le rectangle soit inclus, afin de créer une jolie bordure pour votre PNG exporté. Vous prenez le temps de définir la largeur et la couleur du trait… pour constater que votre propre choix de styles est remplacé par l'extension après l'exportation. Le trait du rectangle est supprimé et le remplissage est remplacé par une nuance de gris (le fichier existe déjà et n'a pas été écrasé), de rouge (le fichier existe, mais a été écrasé) ou de vert (le fichier a été créé pour la première fois). Si vous voulez réessayer l'exportation, vous devrez les établir tous à leur style original, à moins que vous ne vouliez vraiment qu'une superposition rouge soit ajoutée à tous vos PNG !
In my opinion, if you want to export multiple slices of your document defined by rectangles, you may as well just use the standard Batch Export approach, with an optionally hidden slicing layer. The benefits of the extension just aren’t great enough to make it a compelling new method of performing this task. This extension does offer one other trick, however: Icon mode. This is enabled via the checkbox of the same name, and while it initially appears useful, it’s also got a major flaw that makes it less than practical in a lot of cases. What this mode does is to ignore the DPI setting, and instead create a series of square images for each slicing region, using the pixel sizes defined in the “Sizes” text box. Unfortunately, it does this by stretching each image to fit the square aspect ratio. In short, your slicing “rectangle” in this case absolutely has to be a square, otherwise the content will be stretched out of proportion. A much better approach would have been to scale the content in proportion, and automatically center it in the square. This would work equally well for slices that are already square, and those of a different aspect ratio. But alas, the extension offers no such option. The image below shows the result of using Icon Mode on a single image from a character sheet. On the left you can see the original Inkscape drawing, complete with the slicing rectangle (in green, due to this screenshot being taken after the initial export). To the right, you can see the icons that were produced. Clearly not the result I would have liked or expected.
À mon avis, si vous voulez exporter plusieurs tranches de votre document définies par des rectangles, vous pouvez tout aussi bien utiliser l'approche standard de l'exportation par lots, avec une couche de découpage cachée en option. Les avantages de l'extension ne sont pas assez importants pour en faire une nouvelle méthode convaincante pour effectuer cette tâche.
Cette extension propose toutefois une autre astuce : le mode Icône. Celui-ci est activé via la case à cocher du même nom et, bien qu'il semble utile au départ, il présente également un défaut majeur qui le rend moins pratique dans de nombreux cas. Ce mode ignore le paramètre DPI et crée une série d'images carrées pour chaque région de découpage en utilisant les tailles de pixels définies dans la zone de texte « Sizes ». Malheureusement, il le fait en étirant chaque image pour l'adapter au rapport d'aspect carré. En bref, votre « rectangle » de découpage doit absolument être un carré, sinon le contenu sera étiré hors de proportion. Une bien meilleure approche aurait été de mettre le contenu à l'échelle en proportion et de le centrer automatiquement dans le carré. Cela fonctionnerait aussi bien pour les tranches qui sont déjà carrées que pour celles qui ont un rapport d'aspect différent. Mais hélas, l'extension ne propose pas cette option.
L'image ci-dessous montre le résultat de l'utilisation du mode Icône sur une seule image tirée d'une feuille du personnage. À gauche, vous pouvez voir le dessin original d'Inkscape, avec le rectangle de découpage (en vert, car cette capture d'écran a été prise après l'exportation initiale). À droite, vous pouvez voir les icônes qui ont été produites. Ce n'est clairement pas le résultat que j'aurais souhaité ou attendu.
So there we have two of the new extensions. I hate to be cynical, but I can’t really see much benefit in either of them. The Frame extension could perhaps be useful if it allowed some padding to be specified, and created real rectangles instead of paths. The Export Layer Slices extension could be useful if it didn’t also include the slicing rectangles in the output, and if it didn’t stretch the images out of proportion in Icon mode. What’s most annoying is that these two extensions are frustratingly close to working well together. Imagine if the Frame extension’s default behaviour was to create real rectangles in a new “slices” layer (with optional padding, of course). Instantly, it becomes an easy way to create the initial slicing rectangles for the Layer Slices extension if you have a lot of elements to export. But instead, we get these two extensions, neither of which are great on their own, and which don’t work well together. What a shame.
Voilà donc deux des nouvelles extensions. Je déteste être cynique, mais je ne vois pas vraiment d'avantages à ces deux extensions. L'extension Cadre pourrait peut-être être utile si elle permettait de spécifier un certain remplissage et de créer de vrais rectangles au lieu de chemins. L'extension Export Layer Slices pourrait être utile si elle n'incluait pas également les rectangles de découpage dans le résultat et si elle n'étirait pas les images hors de proportion en mode Icône.
Ce qui est le plus ennuyeux, c'est que ces deux extensions sont proches de fonctionner bien ensemble, ce qui est frustrant. Imaginez que le comportement par défaut de l'extension Cadre consiste à créer de véritables rectangles dans un nouveau calque « slices » (avec un remplissage facultatif, bien sûr). Instantanément, cela devient un moyen facile de créer les rectangles de découpage initiaux pour l'extension Layer Slices si vous avez beaucoup d'éléments à exporter. Mais au lieu de cela, nous avons ces deux extensions, qui ne sont ni l'une ni l'autre excellentes en soi, et qui ne fonctionnent pas bien ensemble. Quel dommage !