issue221:inkscape
Différences
Ci-dessous, les différences entre deux révisions de la page.
Prochaine révision | Révision précédente | ||
issue221:inkscape [2025/09/28 13:40] – créée d52fr | issue221:inkscape [2025/09/30 19:13] (Version actuelle) – andre_domenech | ||
---|---|---|---|
Ligne 1: | Ligne 1: | ||
- | This month I’m going to start by looking at a couple of small-but-useful quality of life improvements in the gradient editor that were added in Inkscape 1.4. So I guess the first thing to do is to create an object with a gradient… | + | **This month I’m going to start by looking at a couple of small-but-useful quality of life improvements in the gradient editor that were added in Inkscape 1.4. So I guess the first thing to do is to create an object with a gradient… |
I’ve only applied a gradient to the fill, but the new features are also available on strokes with a gradient. In this case the gradient runs from red to yellow, and from left to right. In terms of SVG, that’s the default direction, with 0° towards the right of the object, and angles increasing clockwise from there. Remember that, it will be important. | I’ve only applied a gradient to the fill, but the new features are also available on strokes with a gradient. In this case the gradient runs from red to yellow, and from left to right. In terms of SVG, that’s the default direction, with 0° towards the right of the object, and angles increasing clockwise from there. Remember that, it will be important. | ||
Ligne 7: | Ligne 7: | ||
Opening the Fill & Stroke dialog we see roughly the same layout as the past few Inkscape versions, but with some new controls at the top-right (outlined in red). | Opening the Fill & Stroke dialog we see roughly the same layout as the past few Inkscape versions, but with some new controls at the top-right (outlined in red). | ||
- | The first new control here is a numeric input to adjust the rotation of the gradient. Setting it to 45°, for example, does exactly what you would expect it to. | + | The first new control here is a numeric input to adjust the rotation of the gradient. Setting it to 45°, for example, does exactly what you would expect it to.** |
- | Remember that the blue line runs through the middle of the gradient, perpendicular to the gradient direction. Our 45° angle, therefore, runs from top-left to bottom-right. Of course you can set any other angle you wish to in this field but, disappointingly, | + | Ce mois-ci, je vais commencer par examiner quelques améliorations mineures, mais utiles, apportées à l' |
+ | |||
+ | J'ai appliqué un dégradé uniquement au remplissage, | ||
+ | |||
+ | En pratique, comme vous pouvez le constater, il y a également une fine section bleue au milieu du dégradé. Je l'ai incluse simplement pour que les changements d' | ||
+ | |||
+ | En ouvrant la boîte de dialogue « Fond et contour », | ||
+ | |||
+ | La première nouvelle commande est une entrée numérique permettant d' | ||
+ | |||
+ | |||
+ | **Remember that the blue line runs through the middle of the gradient, perpendicular to the gradient direction. Our 45° angle, therefore, runs from top-left to bottom-right. Of course you can set any other angle you wish to in this field but, disappointingly, | ||
Neither does this field support the ability to enter simple equations as found in many other inputs in Inkscape. The lack of presets might be forgiven if it were possible to enter “15*5” and have the program calculate the result for you, but that’s not an option here. | Neither does this field support the ability to enter simple equations as found in many other inputs in Inkscape. The lack of presets might be forgiven if it were possible to enter “15*5” and have the program calculate the result for you, but that’s not an option here. | ||
- | If you want to change the value in 1° increments there are plus and minus buttons – for smaller or larger increments you’ll need to do some typing. You can also focus the field and scroll your mouse wheel for the same effect – but, again, only in 1° steps. It would have been useful to switch to 10° steps with the Shift key held, or 0.1° steps for Ctrl, but that level of coarse and fine control hasn’t been implemented. | + | If you want to change the value in 1° increments there are plus and minus buttons – for smaller or larger increments you’ll need to do some typing. You can also focus the field and scroll your mouse wheel for the same effect – but, again, only in 1° steps. It would have been useful to switch to 10° steps with the Shift key held, or 0.1° steps for Ctrl, but that level of coarse and fine control hasn’t been implemented.** |
- | For a more interactive approach there is also a new slider, below the numeric input. If you don’t need a precise angle, but just want to adjust it until it looks “right” on the canvas, this might be a better tool. As is the nature of sliders, the exact resolution of each step will change depending on how wide the dialog is. But even with an extremely wide dialog, and therefore a longer slider, the resolution still appears to bottom out at 1° steps. Once again, if you want finer control than that you’ll need to adjust the value in the input box, but I’ll forgive that given that a slider isn’t really the right control for such exacting requirements. | + | N' |
+ | |||
+ | Ce champ ne permet pas non plus de saisir des équations simples, contrairement à de nombreuses autres entrées d' | ||
+ | |||
+ | Pour modifier la valeur par incréments de 1 °, utilisez les boutons + et -. Pour des incréments plus ou moins importants, vous devrez taper. Vous pouvez également sélectionner le champ et faire tourner la molette de la souris pour obtenir le même effet, mais, là encore, uniquement par incréments de 1 °. Il aurait été utile de passer à des incréments de 10 ° en maintenant la touche Maj enfoncée, ou de 0,1 ° avec la touche Ctrl, mais ces niveaux de contrôle grossier ou précis ne sont pas implémentés. | ||
+ | |||
+ | |||
+ | **For a more interactive approach there is also a new slider, below the numeric input. If you don’t need a precise angle, but just want to adjust it until it looks “right” on the canvas, this might be a better tool. As is the nature of sliders, the exact resolution of each step will change depending on how wide the dialog is. But even with an extremely wide dialog, and therefore a longer slider, the resolution still appears to bottom out at 1° steps. Once again, if you want finer control than that you’ll need to adjust the value in the input box, but I’ll forgive that given that a slider isn’t really the right control for such exacting requirements. | ||
To the left of the slider, a new button rotates the gradient clockwise in 90° steps. To be clear, it rotates the existing gradient by an additional 90° with each click, so if you start with an angle of 30° it will jump to 120°. Note that the rotation control covers a range of +/-180°, so an additional click on the button won’t jump to 210°, but rather to -150°. From there, another click jumps to -60° before a fourth click brings it back to the starting value of 30°. | To the left of the slider, a new button rotates the gradient clockwise in 90° steps. To be clear, it rotates the existing gradient by an additional 90° with each click, so if you start with an angle of 30° it will jump to 120°. Note that the rotation control covers a range of +/-180°, so an additional click on the button won’t jump to 210°, but rather to -150°. From there, another click jumps to -60° before a fourth click brings it back to the starting value of 30°. | ||
- | Dragging the slider to either end is a quick way to initialise the gradient to a base number such that the button cycles through the four cardinal directions. | + | Dragging the slider to either end is a quick way to initialise the gradient to a base number such that the button cycles through the four cardinal directions.** |
- | This button is a potentially handy shortcut with one glaring omission: it only rotates clockwise. It’d be more useful still if a Shift-click caused it to rotate anti-clockwise for those times when you overshoot your intended rotation, or know that you specifically want to adjust the value by -90°. | + | Pour une approche plus interactive, |
+ | |||
+ | À gauche du curseur, un nouveau bouton permet de faire pivoter le dégradé dans le sens des aiguilles d'une montre par paliers de 90 °. En clair, il fait pivoter le dégradé existant de 90 ° supplémentaires à chaque clic ; ainsi, si vous commencez avec un angle de 30 °, il passera à 120 °. Notez que le contrôle de rotation couvre une plage de +/-180°. Un clic supplémentaire sur le bouton ne fera donc pas passer à 210 °, mais à -150 °. De là, un autre clic permet de passer à -60 °, avant qu'un quatrième clic ne ramène à la valeur initiale de 30 °. | ||
+ | |||
+ | Faire glisser le curseur vers l'une des extrémités permet d' | ||
+ | |||
+ | |||
+ | **This button is a potentially handy shortcut with one glaring omission: it only rotates clockwise. It’d be more useful still if a Shift-click caused it to rotate anti-clockwise for those times when you overshoot your intended rotation, or know that you specifically want to adjust the value by -90°. | ||
One possible use for this button is to flip the orientation of a gradient through 180° – in the case of my example shape, to change it from red-yellow to yellow-red. But right next to the rotate button is one that was already present in earlier releases, which reverses the direction of the gradient. Obviously it makes more sense to use that single-click button, rather than two clicks on the rotate button, right? | One possible use for this button is to flip the orientation of a gradient through 180° – in the case of my example shape, to change it from red-yellow to yellow-red. But right next to the rotate button is one that was already present in earlier releases, which reverses the direction of the gradient. Obviously it makes more sense to use that single-click button, rather than two clicks on the rotate button, right? | ||
Ligne 27: | Ligne 52: | ||
In the vast majority of cases, either button will do the job. But there is a technical difference between the way they work which means they’re not quite equivalent, in ways that could affect your design if you’re sharing gradients among multiple objects. To demonstrate this, I’ve taken my original square and made two duplicates. Then I reversed the gradient on the first one, and rotated it twice on the second. As you might expect, both duplicates look the same. | In the vast majority of cases, either button will do the job. But there is a technical difference between the way they work which means they’re not quite equivalent, in ways that could affect your design if you’re sharing gradients among multiple objects. To demonstrate this, I’ve taken my original square and made two duplicates. Then I reversed the gradient on the first one, and rotated it twice on the second. As you might expect, both duplicates look the same. | ||
- | The differences appear when looking at the gradient settings in the Fill & Stroke dialog (below). | + | The differences appear when looking at the gradient settings in the Fill & Stroke dialog (below).** |
- | On the left we can see that the ‘Reverse’ button has done exactly that – it’s reversed the order of the color stops entirely. The gradient that had previously run from red to yellow now runs from yellow to red, but with a rotation of 0°. The ‘Rotate’ version, on the right, maintains the same stop order as the original object, but with a rotation of 180°. | + | Ce bouton est un raccourci potentiellement pratique, mais présente une lacune flagrante : |
+ | |||
+ | Ce bouton peut notamment servir à inverser l' | ||
+ | |||
+ | Dans la grande majorité des cas, l'un ou l' | ||
+ | |||
+ | Les différences apparaissent lorsque vous examinez les paramètres de dégradé dans la boîte de dialogue Fond et contour (ci-dessous). | ||
+ | |||
+ | |||
+ | **On the left we can see that the ‘Reverse’ button has done exactly that – it’s reversed the order of the color stops entirely. The gradient that had previously run from red to yellow now runs from yellow to red, but with a rotation of 0°. The ‘Rotate’ version, on the right, maintains the same stop order as the original object, but with a rotation of 180°. | ||
Within the Inkscape Preferences (Edit > Preferences), | Within the Inkscape Preferences (Edit > Preferences), | ||
- | Notice that there are now two gradients for our three objects. The first is shared by two objects (as indicated by the number in the ‘#’ column) – our original, and the copy with the rotated gradient. The second was created as soon as the ‘Reverse’ button was clicked, and is only used by one object. | + | Notice that there are now two gradients for our three objects. The first is shared by two objects (as indicated by the number in the ‘#’ column) – our original, and the copy with the rotated gradient. The second was created as soon as the ‘Reverse’ button was clicked, and is only used by one object.** |
- | The problems arise when you do want to share gradients. Consider that you might want that yellow changed to green throughout your entire drawing – perhaps due to a change of corporate style or branding. As I discussed last time, you can’t use swatches as gradient color stops, so it’s not possible to define your gradient in terms of named swatches that you can edit in a single place. Instead you’re faced with tracking down and changing the color in every gradient separately. | + | À gauche, on peut voir que le bouton « Inverser » a eu exactement cet effet : il a complètement inversé l' |
+ | |||
+ | Dans les Préférences d' | ||
+ | |||
+ | Remarque : nos trois objets possèdent désormais deux dégradés. Le premier est partagé par deux objets (comme l' | ||
+ | |||
+ | |||
+ | **The problems arise when you do want to share gradients. Consider that you might want that yellow changed to green throughout your entire drawing – perhaps due to a change of corporate style or branding. As I discussed last time, you can’t use swatches as gradient color stops, so it’s not possible to define your gradient in terms of named swatches that you can edit in a single place. Instead you’re faced with tracking down and changing the color in every gradient separately. | ||
Un-checking the option in the Preferences dialog causes Inkscape to not create additional gradients on a whim, but comes with its own set of issues. This time, as soon as you reverse the gradient on the first copy, the gradient on the original also flips direction, resulting in a pair of yellow-red gradients and no sign of the original red-yellow direction at all. We’ve told Inkscape to share the gradient definition, so a change in the order of stops (due to the ‘Reverse’ button) has affected both our objects. | Un-checking the option in the Preferences dialog causes Inkscape to not create additional gradients on a whim, but comes with its own set of issues. This time, as soon as you reverse the gradient on the first copy, the gradient on the original also flips direction, resulting in a pair of yellow-red gradients and no sign of the original red-yellow direction at all. We’ve told Inkscape to share the gradient definition, so a change in the order of stops (due to the ‘Reverse’ button) has affected both our objects. | ||
- | Using the rotate button a couple of times, however, does not affect the original. Let’s create another copy, and flip that one back to red-yellow using this technique (above). | + | Using the rotate button a couple of times, however, does not affect the original. Let’s create another copy, and flip that one back to red-yellow using this technique (above).** |
- | Now there’s only a single gradient used across three objects even though, visually, we have them running in two different directions. Changing a color stop now affects all the objects using that gradient, as with the yellow-to-green swap I suggested earlier (below). | + | Les problèmes surviennent lorsque vous souhaitez partager des dégradés. Imaginez que vous souhaitiez changer le jaune en vert sur l' |
+ | |||
+ | Désactiver cette option dans la boîte de dialogue Préférences empêche Inkscape de créer des dégradés supplémentaires à la demande, mais cela entraîne des problèmes. Cette fois, dès que vous inversez le dégradé sur la première copie, celui de l' | ||
+ | |||
+ | Cependant, utiliser deux fois le bouton de rotation n' | ||
+ | |||
+ | |||
+ | **Now there’s only a single gradient used across three objects even though, visually, we have them running in two different directions. Changing a color stop now affects all the objects using that gradient, as with the yellow-to-green swap I suggested earlier (below). | ||
Now our entire document has been updated to match the new (if tasteless) corporate branding, without us having to change myriad gradients across lots of objects. | Now our entire document has been updated to match the new (if tasteless) corporate branding, without us having to change myriad gradients across lots of objects. | ||
- | Note, however, that disabling this preference means it’s easy to inadvertently change the gradient of another object when you didn’t mean to. For example, if you absent-mindedly use the ‘Reverse’ button, you may find that an object that’s currently off-screen and out of sight also has its gradient reversed. For this reason, unless you really, really want to share gradients, and you understand the implications of doing so, I recommend most users leave this setting checked, and just accept that you may have a bit more work to do if you genuinely do want to change a single stop color across multiple objects. | + | Note, however, that disabling this preference means it’s easy to inadvertently change the gradient of another object when you didn’t mean to. For example, if you absent-mindedly use the ‘Reverse’ button, you may find that an object that’s currently off-screen and out of sight also has its gradient reversed. For this reason, unless you really, really want to share gradients, and you understand the implications of doing so, I recommend most users leave this setting checked, and just accept that you may have a bit more work to do if you genuinely do want to change a single stop color across multiple objects.** |
+ | |||
+ | Il n'y a désormais qu'un seul dégradé utilisé pour trois objets, même si, visuellement, | ||
+ | |||
+ | L' | ||
+ | |||
+ | Notez cependant que la désactivation de cette préférence peut facilement modifier par inadvertance le dégradé d'un autre objet. Par exemple, si vous utilisez involontairement le bouton « Inverser », | ||
+ | |||
+ | |||
+ | **If you just want to reverse a gradient, therefore, using the ‘Rotate’ button a couple of times is a better option than the ‘Reverse’ button. It won’t result in an additional gradient being created, regardless of the state of this setting, and will give you the same visual result. | ||
+ | |||
+ | So does that mean that the ‘Reverse’ button is completely useless? Not at all! Everything I’ve written above applies only to linear gradients. When working with radial gradients the Orientation section of the Fill & Stroke dialog is disabled entirely, so if you want to flip your gradient from being red in the center and yellow at the edge to the opposite style, you have no choice but to use the ‘Reverse’ button, even though it does mean creating a second gradient. ** | ||
+ | |||
+ | Si vous souhaitez simplement inverser un dégradé, il est préférable d' | ||
+ | |||
+ | Le bouton « Inverser » est-il donc totalement inutile ? Absolument pas ! Tout ce que j'ai expliqué ci-dessus ne s' | ||
- | If you just want to reverse a gradient, therefore, using the ‘Rotate’ button | + | **The fact that the Orientation section is disabled for radial gradients is, itself, a little odd. Although it serves no purpose when the gradient |
- | So does that mean that the ‘Reverse’ button | + | The addition of these new controls |
- | The fact that the Orientation | + | La désactivation de la section |
- | The addition of these new controls is another case where a small, seemingly insignificant change to the UI opens up a can of worms when you begin to dig into what’s actually happening in your SVG file. I think the new Orientation controls are definitely a positive addition | + | L' |
issue221/inkscape.1759059655.txt.gz · Dernière modification : 2025/09/28 13:40 de d52fr