PC SOFT

FORUMS PROFESSIONNELS
WINDEVWEBDEV et WINDEV Mobile

Accueil → WINDEV Mobile 2025 → ZR avec image svg ; comment changer les couleurs par programmation ?
ZR avec image svg ; comment changer les couleurs par programmation ?
Débuté par Pascal BOULESTEIX, 29 nov. 2025 10:07 - 5 réponses
Membre enregistré
1 180 messages
Posté le 29 novembre 2025 - 10:07
Bonjour à tous

J'utilise une zone répétée pour créer un ruban d'icones dont les images sont au format svg.





Ce que je voudrais ce serait de changer les coloris de l'icone sélectionnée au clic.

Dans le xml des svg, le bloc path est qualifié avec un style.
Le fond de l'image est attribué dans le style de l'image.

Exemple de svg.

<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 43 43">
<!-- Generator: Adobe Illustrator 29.6.1, SVG Export Plug-In . SVG Version: 2.1.1 Build 9) -->
<defs>
<style>
.st0 {
fill: #2b6bb8;
}
</style>
</defs>
<path class="st0" d="M17.17,16.58c.18-.16.4-.34.66-.52-.12-.24-.21-.43-.25-.53-.15-.47-.07-1.63-.27-1.77-.2-.14-.78.82-.4,2.14.06.22.15.45.25.68ZM18.98,17.77s.07.03.1.06c.04.04,4.08,4.16,5.72,6,.02.02.03.04.04.06,0,0,.32.87.6,2.04.98-.73,1.45-1.65,1.61-2.08-.38-1.2-.76-1.91-.76-1.92-1.42-1.74-5.21-5.02-5.6-5.35l-1.43-.43c-.91.34-1.61.99-1.88,1.28l1.6.34ZM15.63,17.96c-.05-.09-.11-.17-.14-.25-.37-.82-.54-2.26-.83-2.19-.27.07-.4,1.54.31,2.86.16-.11.39-.26.66-.43ZM12.35,20.56s.02,0,.02,0c.05-.15.13-.29.27-.38.08-.05.24-.16.43-.28-.18-.04-.35-.06-.49-.07-1.27-.06-2.47.06-2.44.43.03.37,1.71.24,2.2.3ZM20.92,16.24c.17.15,4.17,3.58,5.7,5.47.04.06.46.85.86,2.19,1.08-1.31,1.35-2.47,1.41-3.01-.72-1.14-1.31-1.79-1.31-1.8-1.73-1.58-4.56-3.86-4.59-3.88l-1.47-.82c-.88.24-1.91,1.05-2.26,1.34l1.58.47s.05.02.07.04ZM14.89,30.26c-.03.56-.08,1.56-.18,2.66,1.58-.16,2.4-1.01,2.7-1.42-.05-1.32-.18-2.3-.21-2.48-1.34-2.73-4.1-5.26-4.47-5.59-.41-.07-1.07-.1-1.91-.07-.72.54-1.61,1.64-1.93,2.05l2.35-.04s.05,0,.07.01c.17.06,4.15,1.61,3.59,4.4,0,.04-.01.21-.03.47ZM9.41,23.01c.12-.03.27-.04.44-.04.01-.19.08-.37.22-.5.04-.04.15-.13.29-.26-.37-.02-.7-.01-.95.04-1.07.2-2.32,1.09-2.09,1.34.22.25.83-.25,2.09-.57ZM20.22,14.14s0-.02,0-.03c-.12-.6.63-1.75.4-1.98-.24-.23-1.12.97-1.17,2.03,0,.14.01.3.04.46.22-.16.47-.32.74-.48ZM27.86,18.81s.67.75,1.45,1.99c.98-2.17.82-3.6.64-4.23-.47.06-.87.09-.91.1,0,0-.01,0-.02,0-.04,0-.08-.01-.11-.04-1.17-.82-3.55-2.67-3.57-2.68-.04-.03-.06-.07-.07-.12-.07-.38-.12-.77-.15-1.12-1.45-.12-3.12.86-3.64,1.2l1.73.97c.06.04,2.89,2.33,4.65,3.93ZM27.46,11.94c.14.09.29.2.43.37.18-.03.38-.03.59,0-.03-.42-.11-.78-.16-.96l-.71.27-.15.32ZM27.59,11.2l.63-.24c-.21-.93-.79-1.94-1.02-2.32l-.67.27c.15.45.57,1.61,1.06,2.29ZM30.74,14.6l.38-.22-.17-.63s-.03,0-.03,0c-.35-.03-.71-.02-1.04-.01,0,.02,0,.03,0,.05.35.14.67.4.85.82ZM27.53,13.2c-.51-1.23-1.55-.87-2.02-.63.03.34.07.73.14,1.11.37.29,2.36,1.82,3.43,2.58.13-.01.41-.04.75-.08.06-.05.54-.49.26-1.21-.24-.62-1.06-.59-1.06-.59,0,0,.35-.71-.2-1.14s-1.3-.04-1.3-.04ZM26.34,8.55l.66-.27c-.5-1-1.15-1.81-1.44-2.16l-.53.25c.32.86,1.03,1.81,1.31,2.17ZM23.81,11.75c.08-.49.84-1.4.54-1.47s-.84.45-1.15,1.24c-.09.23-.13.51-.15.8.24-.09.48-.17.74-.24,0-.11,0-.22.02-.32ZM25.31,5.8c-.26-.43-1.05-1.71-1.25-1.51-.19.19.49,1.29.78,1.74l.47-.23ZM6.02,26.42c.14.05.73-.37,1.46-.69.18-.28.43-.53.8-.74.05-.06.12-.16.2-.25-.1.02-.19.03-.3.06-.35.08-.65.18-.9.29-1.23.52-1.51,1.24-1.25,1.33ZM30.52,21.8c-.23.03-.63.02-1.05-.02-.08.28-.2.59-.35.93.57.03,1.2.01,1.63-.17.97-.42,1.79-1.66,1.49-1.8-.3-.14-1.11.97-1.72,1.07ZM29.25,25.13c-.25,0-1.08-.15-1.85-.3-.14.24-.32.51-.54.78.72.16,1.55.3,2.25.27,1.37-.04,2.11-.9,1.91-1.04-.2-.15-1.28.29-1.77.29ZM31.29,17.14c-.15.04-.32.06-.48.06.02.22.02.47.01.74.27-.04.54-.1.75-.21.75-.38,1.23-.96,1.13-1.25-.1-.29-.94.54-1.42.66ZM25.88,27.56c-.2-.07-.46-.21-.74-.39-.14.21-.29.44-.48.66.13.08.27.16.42.23,1.42.7,3.01.42,3.06.13.05-.29-1.4-.34-2.25-.63ZM39.04,16.94c-.44-.25-1.26-.5-1.57-.59l-.15.62c.94.26,2.27.99,2.43.8.16-.2-.16-.51-.71-.83ZM24.48,24.06c-1.56-1.74-5.21-5.47-5.64-5.91l-1.35-.29c-.79.29-1.74.91-2.12,1.17l1.37.32s.07.03.1.06c.03.03,2.87,3,5.56,6.08.02.02.03.05.04.07,0,.01.38,1.22.62,2.68,1.24-.8,1.79-2.03,1.93-2.44-.23-.9-.46-1.58-.52-1.73ZM33.83,14.87c.57.46,2.43,1.52,3.12,1.92l.16-.67c-1-.87-2.51-1.61-3.01-1.85l-.27.6ZM31.55,14.43c.68.19,1.49.29,1.9.33l.28-.61c-.61-.13-1.72-.27-2.35-.34l.17.62ZM16.59,19.73l-1.14-.27c-.75.29-1.82.98-2.22,1.24.9.25,1.55.48,1.9.68.02.01.03.02.05.04.02.02,2.28,2.45,4.67,5.82.04.06.54,1.04.89,2.71,1.16-.66,1.69-1.5,1.89-1.89-.21-1.17-.49-2.13-.55-2.33-2.5-2.86-5.13-5.62-5.48-5.99ZM12.85,35.54c-.03.33,1.12.29,2.33-1.36.17-.23.31-.45.43-.66-.26.07-.56.12-.87.15-.65.98-1.87,1.66-1.89,1.87ZM14.49,30.24c.02-.39.02-.48.03-.53.47-2.34-2.93-3.78-3.31-3.94l-2.84.05c-.76.64-.4,1.61-.4,1.61-.71.63-.16,1.5-.16,1.5-.37.4-.39.91-.39,1.06l.96.29c.08.02.14.1.14.19v.8s.04-.02.04-.02l-.04.13v.49l1.49-.08c.06,0,.12.02.16.06.04.04.06.1.05.16l-.14,1.39c.7.15,1.27-.1,1.27-.1.87.39,1.42-.12,1.42-.12.79.05,1.3-.37,1.55-.65.08-.96.12-1.8.15-2.3ZM12.36,31.28c-.04.06-.1.1-.17.1-.04,0-.07,0-.1-.03-1.89-1.12-2.72-2.69-2.75-2.76-.05-.1-.01-.22.09-.27.1-.05.22-.01.27.09,0,.01.82,1.54,2.6,2.6.1.06.13.18.07.27ZM13.7,30.28c-.04.07-.1.1-.18.1-.03,0-.07,0-.1-.03-2.36-1.3-3.31-3.21-3.34-3.29-.05-.1,0-.22.09-.27.1-.05.22,0,.27.09,0,.02.94,1.88,3.18,3.12.1.05.13.17.08.27ZM7.78,34.44c.27.15,1.41-.96,1.96-1.51l.07-.73-.71.04c-.53.67-1.58,2.06-1.32,2.21ZM21.51,30.35c.01.36,0,.73-.04,1.05-.07.5-.62,2.08-.27,2.21.35.13.77-1.01,1.04-2.25.08-.39.08-.99.03-1.62-.22.21-.46.41-.75.61ZM18.17,33.3c-.63,1.14-1.27,1.6-1.08,1.88s1.36-.7,1.83-1.69c.18-.37.3-.97.4-1.58-.26.15-.55.3-.88.42-.06.4-.14.76-.26.97ZM8.13,30.61l-.1-.03c-.68.27-2.25.95-2.13,1.29.12.32,1.51-.17,2.23-.45v-.81ZM14.91,21.71c-.29-.16-.82-.35-1.52-.56-1.12.37-2.57,1.64-2.77,1.82,1.01-.04,1.77-.02,2.24.08.03,0,.07.02.09.05.13.11,3.16,2.78,4.62,5.78,0,.02.02.04.02.06,0,.01.17,1.19.22,2.79,1.57-.47,2.25-1.4,2.49-1.88-.33-1.51-.8-2.4-.8-2.41-2.23-3.14-4.37-5.47-4.6-5.73Z"/>
</svg>


Au clic de l'image, j'ai codé

MySVG is xmlDocument

MySVG = XMLOpen(IMG_SansNom1,depuisChaîne)
MySVG.svg.path..Attribute["fill"] = "#000000"
IMG_SansNom1 = XMLBuildString(MySVG)


mais je ne peux pas débugger MySVG et l'attribut fill ne fonctionne pas.

Comment m'en sortir ?

--
Pascal Boulesteix
Applications Visiolittoral et WNat
Message modifié, 29 novembre 2025 - 10:08
Membre enregistré
3 748 messages
Posté le 29 novembre 2025 - 14:29
Salut
Personnellement, je modifierai la chaîne puis reatriburer l'image
Pour info, une fois que tu as attribué le champ image, il est possible de la modifier directement car elle devient binaire
Mais le plus simple est de créer les images avec ton noir, d'associer les deux images en une pour qu'elles aient 2 états.
Membre enregistré
1 180 messages
Posté le 30 novembre 2025 - 10:30
Salut Popoy
La solution de changer le fichier image n'est pas applicable dans mon cas, car la couleur à appliquer en fond d'image est calculée fonction d'un contexte.
Je recherche donc comment modifier les attributs du svg

--
Pascal Boulesteix
Applications Visiolittoral et WNat
Membre enregistré
3 748 messages
Posté le 02 décembre 2025 - 08:49
Salut
Je viens de m'apercevoir que ce n'est pas supporté sur Android
Scalable Vector Graphics (*.svg)
Attention : les styles CSS et les éléments de type <filter> dans les images au format SVG ne sont pas supportés.
Message modifié, 02 décembre 2025 - 08:52
Membre enregistré
1 009 messages
Posté le 02 décembre 2025 - 15:19
Bonjour,
Habituellement je n'interviens pas sur le Forum Windev Mobile mais en Windev, j'ai déjà eu à générer ou modifier des SVG et je le faisais en ouvrant le fichier avec fChargeTexte et les Fonctions de gestion des chaîne de caractères (remplace, etc ...).
Après analyse de la structure du SVG, c'est assez simple et fonctionnel.
Cdlt
Membre enregistré
1 367 messages
Posté le 11 décembre 2025 - 18:01
Bonjour, comme le format svg est un format texte, il suffit de copier le fichier svg source par programmation et de modifier la couleur HEX du nouveau fichier, tu pourras utiliser le nouveau fichier par programmation. :)