Mise en forme

Stephen · 2025-03-07T11:33:17+00:00

Bonjour,

Je voudrais savoir si c'était possible de scripter une somme pour qu'elle ait un entourage qui puisse s'adapter aux montants. Pour plus de clarté, je vous joint un exemple, sur l'image de gauche, les sommes positives sont avec un bandeau bleu, est ce que ce serait possible de faire comme l'image de droite juste un encadré de la somme (variable selon la longueur de la somme).

je n'ai aucune idée de comment faire et déjà si c'est possible...

Exemple

FredoMkb · 2025-03-10T07:03:03+00:00

Stephen

Bonjour 🙂

Une piste serait d'appliquer une mise en forme conditionnelle à la rubrique du montant, avec un calcul du genre :

Contenu > 0

Puis passer par les options de mise en forme supplémentaires et cocher l'option "Mettre en surbrillance".

Cela aura pour effet de mettre en surbrillance jaune l'ensemble du montant, quelque soit sa longueur, hélas, je ne sais pas s'il est possible de changer la couleur jaune par défaut par une autre couleur de son choix (mes tests n'ont rien donné de probant).

Désolé, pas mieux… 😉

Stephen · il y a 25 jours

Merci Fredo, je connais l'option "Mettre en surbrillance" mais ce n'est pas tout à fait la même chose, on ne peut pas paramétrer grand chose avec (je voulais un encadré avec bord arrondi et que l'on puisse définir les marges sur tous les bords ainsi que les couleurs), (de mémoire la surbrillance en jaune fluo colle beaucoup au texte et ce n'est pas très joli).

Donc, sauf avis contraire, on ne peut pas le faire...

Jacques_Rechain · il y a 25 jours

Une solution "acrobatique" consiste à superposer le nombre d'encadrés voulus (5, 6 ?) avec masquage conditionnel (Contenu < 10 000) pour le plus grand, (Contenu < 1 000) etc.
Ne fonctionne pas ou très mal en Web Direct..

Stephen · il y a 25 jours

@Jacques_Rechain oui, ça pourrait marcher, à condition d'utiliser une police à chasse fixe... Est-ce que cela ne vas pas alourdir la base d'avoir 5-6 éléments graphiques en plus à chaque enregistrements ?

Jacques_Rechain · il y a 25 jours

L'écartement des caractères nombres, faut tester ..
Cela ne va pas alourdir la base. Mais cela peut créer une latence d'affichage d'une grande liste. On est pas sur une évaluation de rubriques liées, très gourmandes en resources. La aussi il faut tester... Mais dans votre cas je pense qu'il n'y aura pas d'incidence significative.

Stephen · il y a 25 jours

Merci @Jacques_Rechain .
Je pense que c'est tout à fait jouable de cette façon... c'est un peu du bricolage, mais la fonction n'existe pas pour le moment, et ce n'est pas compliqué à mettre en place...

FredoMkb · il y a 25 jours

Bonjour à tous 🙂

@Stephen tu peux également utiliser un WebViewer pour afficher le montant, ce qui offre plus de possibilités de mise en forme graphique que FileMaker, voici un code d'exemple :

Liste ( 
	"data:text/html," ;
	"<body style='margin: 2px; padding: 2px; background-color: #fff; font-size: 16px; font-color: #000; text-align: right;'>" ;
	"<span style='padding:3px 4px 1px 4px; outline: 1px solid blue; border-radius: 4px;'>" & Table::Montant & " €</span>" ;
	"</body>" ;
)

Il faudra remplacer "Table::Montant" par la rubrique concernée de ta base.

Attention toutefois, l'affichage des milliers et des fractions risque d'être un peu plus délicat à mettre en place, en effet, FileMaker propose des solutions de formatage des nombres en mode modèle qui sont très pratiques (onglet "Données" de l'inspecteur), ce qui, hélas, il faudra recréer pour le WebViewer (on peut éventuellement utiliser des fonctions personnalisés Fmp pour gérer ça correctement)…

À tester… 😉

Stephen · il y a 24 jours

je vais tester Fredo

Stephen · il y a 23 jours

J'ai réussi Fredo, ça fonctionne très bien avec le webviewver (j'aurai quelques réglages html encore à faire), maintenant, comment on paramètre les espaces des milliers avec le web viewer ?

Edit : j'ai vu aussi un petit bogue, est ce que le web viewer peut être transparent ?, je vois le cadre blanc quand je suis sur la fiche

Montants encadré

FredoMkb · il y a 23 jours

Stephen comment on paramètre les espaces des milliers avec le web viewer ?

Et bien, comme je le disais plus tôt, c'est le principal soucis avec le WebViewer, il faut traiter les données directement pour arriver au formatage visuel qu'offre FileMaker… et cela peut apporter son lot de complexité…

Donc, deux propositions, la première en utilisant une fonction personnalisée côté FileMaker, et la seconde avec un brin de JavaScript dans le code HTML du WebViewer.

--

1. Fonction Perso FileMaker

Le code du WebViewer sera quelque chose comme ceci (assez similaire au premier proposé) :

Liste ( 
	"data:text/html," ;
	"<body style='margin: 2px; padding: 2px; background-color: #fff; font-size: 16px; font-color: #000; text-align: right;'>" ;
	"<span style='padding:3px 4px 1px 4px; outline: 1px solid blue; border-radius: 4px;'>" & setMilliers ( Table::Montant ; "" ; "" ) & " €</span>" ;
	"</body>" ;
)

On ajoute donc ici une fonction perso Fmp nommée "setMilliers()", dont voici le code (en français) :

/*
setMilliers ( nNbr ; sSep ; sRes )

Fonction récursive pour retourner un nombre au format texte avec un séparateur des milliers fourni 

Paramètres
nNbr (number) : nombre entier ou flotant à traiter
sSep (string) : le caractère de séparation (espace par défaut)
sRes (string) : le résultat du traitement (chaîne vide "" lors de l'appel de la fonction)

Exemples
setMilliers ( 85,45 ; "" ; "" ) = "85,45"
setMilliers ( -7385,45 ; "" ; "" ) = "-7 385,45"
setMilliers ( 277385,45 ; "" ; "" ) = "277 385,45"
setMilliers ( -4927385,45 ; "" ; "" ) = "-4 927 385,45"
setMilliers ( 24927385,45 ; "" ; "" ) = "24 927 385,45"
setMilliers ( -12524927385,45 ; "" ; "" ) = "-12 524 927 385,45"

FredoMkb © 2020
*/
Definir (
[
	_ent = Ent ( Abs ( ObtenirNombre ( nNbr ) ) ) ;
	_sgn = Si ( Signe ( nNbr ) < 0 ; "-" ; "" ) ;
	_dec = ObtenirCommeBooleen ( Abs ( ObtenirNombre ( nNbr ) ) <> _ent ) ;
	_fra = Si ( _dec ; Fin ( Abs ( ObtenirNombre ( nNbr ) ) - _ent ; 2 ) ; "00" ) ;
	_cma = Filtre ( ObtenirTexte ( Alea ) ; ",." ) ;
	_sep = Si ( EstVide ( sSep ) ; " " ; Debut ( sSep ; 1 ) ) ;
	_lng = Longueur ( _ent ) ;
	_dbt = Debut ( _ent ; _lng - 3 ) ;
	_fin = Fin ( _ent ; 3 ) ;
	_rec = Longueur ( _dbt ) ;
	_num = Si ( _rec > 0 ; _sgn & _dbt ; _sgn ) ;
	_res = Si ( EstVide ( sRes ) ; _fin ; _fin & _sep & sRes ) ;
	_z = ""
] ;
	Cas ( 
		_rec > 3 ; setMilliers ( _num & _cma & _fra ; sSep ; _res ) ; 
		_lng > 3 ; _num & _sep & _res & _cma & _fra ; 
		_sgn & _res & _cma & _fra
	)
)

--

2. Fonction Perso JavaScript

Ici on gère tout directement dans le WebViewer grâce à un peu de JavaScript, voici donc le code :

Liste ( 
	"data:text/html," ;
	"<body style='margin: 2px; padding: 2px; background-color: #fff; font-size: 16px; font-color: #000; text-align: right;' onload='milliers(" & Table::Montant & ")'>" ;
	"<span id='montant' style='padding:3px 4px 1px 4px; outline: 1px solid blue; border-radius: 4px;'></span>" ;
	"<script>" ; 
	"function milliers(nombre){const formatage = new Intl.NumberFormat('fr-FR', {style:'currency', currency:'EUR', minimumFractionDigits:2, maximumFractionDigits:2});" ;
	"document.getElementById('montant').textContent = formatage.format(nombre).replace(/\u202F/g, ' ');}" ;
	"</script>" ;
	"</body>" ;
)

--

Je ne sais pas quelle solution donnera l'affichage le plus fluide dans la liste, il faudra faire des tests je pense…

Mais, la première solution, avec la fonction perso Fmp, pourrait être un peu améliorée en créant une rubrique calcul dans laquelle on ferait déjà la conversion avec la fonction perso, du coup, on n'aurait plus qu'à afficher cette rubrique dans le code Html du WebViewer, ce qui aurait pour bénéfice d'éviter les calculs à la volée…

Dans tous les cas, tout ceci est à tester et à adapter à ta solution…

--

Stephen est ce que le web viewer peut être transparent ?

Hélas, non 😶 … malgré les demandes faites à Claris, apparemment cela est plus complexe que ça n'y paraît (il me semble, sauf erreur, que c'est une histoire de moteur Web géré par le système… enfin, de ce que j'ai compris 🙃 ).

Tiens-nous au courant Stp 🙂

Stephen · il y a 23 jours

Alors, j'ai essayé les deux méthodes,

la première, la fonction personnalisée,
je n'ai pas pu la faire fonctionner..
Il m'indique dans le code que la fonction setMilliers n'existe pas dans le web viewer.
Et dans la fonction personnalisé, je n'ai pu la crée, j'ai eu le soucis d'une première erreur "nNbr" était introuvable

pour la deuxième méthode, j'ai eu plus de succès, j'y suis arrivé (voir capture), par contre comment on peut supprimer le " €" à la fin des chiffres ?

Sinon, j'ai mis en superposition des autres chiffres standards, l'encadré bleu camoufle les autres chiffres...

Pour le web viewer, ok c'est noté...

Pour les erreurs que j'ai eu (j'ai peut-être mal fait les choses)

erreur 1
erreur 2

Avec le web viewer, j'ai juste le € que j'aimerais supprimer, mais je ne sais pas ce qu'il faut supprimer dans la formule
Webviewer

FredoMkb · il y a 22 jours

Stephen Et dans la fonction personnalisé, je n'ai pu la crée, j'ai eu le soucis d'une première erreur "nNbr" était introuvable

Alors oui, désolé Stéphen, parfois j'oublie que ce qui me paraît évident ne l'est pas forcément pour les autres…

Donc, pour la fonction perso, voici en résumé les étapes à suivre (dsl si je dis des choses que tu connais déjà) :

Aller à : menu "Fichier" -> "Gérer" -> "Fonctions Personnalisées…"
Cliquer sur le bouton "Créer"
Dans le champ "Nom de la fonction" inscrire "setMilliers"
Via le champ "Paramètres de la fonction" créer les trois suivants dans le même ordre : nNbr ; sSep et sRes
Copier-Coller l'ensemble du code proposé plus tôt
Valider les deux fenêtres et c'est tout 😉

Voir une capture de la fenêtre de la fonction perso (cadre bleu)

Pour l'appel de la fonction, dans le WebViewer ou dans une rubrique, suit l'un des exemples fournis

--

Stephen Avec le web viewer, j'ai juste le € que j'aimerais supprimer

Dans le code Html du WebViewer, remplace la 5e ligne :

"function milliers(nombre){const formatage = new Intl.NumberFormat('fr-FR', {style:'currency', currency:'EUR', minimumFractionDigits:2, maximumFractionDigits:2});" ;

Par cette nouvelle ligne :

"function milliers(nombre){const formatage = new Intl.NumberFormat('fr-FR', {minimumFractionDigits:2, maximumFractionDigits:2});" ;

Normalement ça devrait le faire… 😉

Stephen · il y a 22 jours

Merci beaucoup Fredo pour ton aide...

alors, je venais tout juste de trouver par moi même pour la fonction web viewer pour enlever le "€", (après quand même quelques essais je dois l'avouer...

Pour la version fonction personnalisée, j'avoue que c'est plus pour les programmeurs que moi, mais je l'ai testé et ça fonctionne parfaitement (avec ta deuxième aide). (je n'avais jamais fait de fonctions personnalisées).

Sur la capture d'écran :
le premier montant sans les espaces...
le montant correct avec la fonction personnalisée (ça fonctionne très bien)
le montant correct avec l'intégration du web viewer (ça fonctionne très bien)
le montant correct avec l'euro (mais pas besoin dans ce cas)

Montants ok

Tout fonctionne très bien, je t'en remercie...

Maintenant que j'ai les 2 méthodes, entre la fonction personnalisée et le web viewer, je ne me rend pas compte au niveau de l'affichage étant donné que c'est un exemple, ça s'affiche à peu prêt en même temps (environ 1/2 seconde), mais si j'avais plus d'enregistrements, lequel serait le plus rapide ?

en tout cas, c'est au top, c'est mieux qu'avant !! encore merci @FredoMkb

FredoMkb · il y a 22 jours

Stephen mais si j'avais plus d'enregistrements, lequel serait le plus rapide ?

Honnêtement, je ne sais pas… il faudra sûrement faire quelques tests…

En tout cas, selon mon intuition, si tu utilises la version avec la fonction perso "setMilliers" directement dans une rubrique calcul de type texte, qu'on pourrait nommer par exemple "Montant_Affichage", et que tu places cette rubrique dans le WebViewer (au lieu du calcul de la fonction perso), je pense que tu auras un affichage un peu plus fluide, car le calcul ne se fera plus à la volée mais sera déjà fait dans la nouvelle rubrique…

Ce qui donnerait :

Liste ( 
	"data:text/html," ;
	"<body style='margin: 2px; padding: 2px; background-color: #fff; font-size: 16px; font-color: #000; text-align: right;'>" ;
	"<span style='padding:3px 4px 1px 4px; outline: 1px solid blue; border-radius: 4px;'>" & Table::Montant_Affichage & "</span>" ;
	"</body>" ;
)

Évidemment, c'est à tester…

Stephen · il y a 22 jours

je testerai ce soir aussi 🙏

Edit, je n'ai pas réussi à faire fonctionner cette dernière solution, je n'ai pas bien compris comment faire,
il faut créer une rubrique "Calcul > résultat texte" nommé "Montant_Affichage" mais comment on met la fonction Setmilliers dedans ? et comment on récupère la valeur "Montant" ?

Après, il faut faire un web viewer avec le nouveau code...
Mais j'ai loupé une étape dans la rubrique Calcul je pense...

FredoMkb · il y a 22 jours

Stephen mais comment on met la fonction Setmilliers dedans ? et comment on récupère la valeur "Montant" ?

Voici une petite capture d'écran :

Fonction peso "setMilliers()" dans une rubrique

Et voici un rapide fichier d'exemple :

MiseEnForme-WebViewer.fmp12.zip

😉

Stephen · il y a 22 jours

Impeccable, ça fonctionne à merveille...
Je vais mettre ça au propre dans ma solution, c'est exactement ce que je voulais, top !!
merci beaucoup pour ta patience.

(n'étant pas développeur pro, à mon niveau, je suis resté aux fonctions basiques de Filemaker, mais dès fois, ça coince...).

Stephen · il y a 2 jours

Je remonte ce sujet, j'ai finalement un petit bogue, les décimales ne sont pas pris en compte
sur une partie, j'ai utilisé la version web viewer

Liste ( "data:text/html," ; "<body style='margin: 0px; padding: 3px; font-family: Geneva; font-size: 11px; font-color: #ffffff; text-align: right;' onload='milliers(" & Comptes bancaires::Montant & ")'>" ; "<span id='montant' style='background-color: #E1E7F0; padding:3px 5px 2px 5px; outline: 0px solid blue; border-radius: 10px; color: #000000;'></span>" ; "<script>" ; "function milliers(nombre){const formatage = new Intl.NumberFormat('fr-FR', {minimumFractionDigits:2, maximumFractionDigits:2});" ; "document.getElementById('montant').textContent = formatage.format(nombre).replace(/\u202F/g, ' ');}" ; "</script>" ; "</body>" ; )

ca m'arrondit les chiffres...
exemple : 123,45 devient 123,00

FredoMkb · il y a 2 jours

Stephen ca m'arrondit les chiffres...
exemple : 123,45 devient 123,00

Ahahah… merdum 🤪… dsl, je n'avais pas testé les fractions… je vais voir si je trouve une solution…

Ok, j'ai compris, c'est simple, la fonction JavaScript n'accepte des nombres qu'en notation anglaise, c'est-à-dire, avec le point "." comme séparateur des fractions, et non pas la virgule "," en notation française…

Du coup, il suffit de faire un petit "Substituer()" lors de l'appel de la fonction "milliers()"… il faut donc remplacer la ligne suivante :

"<body style='margin: 0px; padding: 3px; font-family: Geneva; font-size: 11px; font-color: #ffffff; text-align: right;' onload='milliers(" & Comptes bancaires::Montant & ")'>" ;

Par cette nouvelle :

"<body style='margin: 0px; padding: 3px; font-family: Geneva; font-size: 11px; font-color: #ffffff; text-align: right;' onload='milliers(" & Substituer ( Comptes bancaires::Montant ; "," ; "." ) & ")'>" ;

En principe, ça devrait bien fonctionner maintenant… 🤪