Aller au contenu

Personnalisation des QA, Mise en couleur, police Etc..


Messages recommandés

Posté(e)

Personnalisation des QA, Mise en couleur, police Etc..

 

merci a FredoKL pour cette découverte

toto.jpg.6474bf18a4e715239f950c01ff314aa6.jpg

 

il est maintenant possible de personnaliser nos QA et cela fonctionne avec l'application Android 

 

Je ne suis pas un pro des balises HTML donc vais juste donner quelques exemples

 

Pour changer la police

face=times new roman

Pour changer la couleur (lien pour trouver le bon code couleur https://htmlcolorcodes.com/fr/)

color= #7d3c98

pour changer la taille

size=+3

Exemple pour l'etiquete "lal"

self:updateView('la1', 'text', "<span class=\"section-title\"><b><font color= #7d3c98 face=times new roman size=+3>Titre personnalisable avec couleur") 

 

Voici un autre exemple pour ajouter un lien dans un QA

 

self:updateView("la2", "text", '<a href="https://www.google.com/">Google Search</a>')

 

Pour envoyer un email

self:updateView("la6","text", '<a href="mailto:pere-noel@laposte.net"> Envoyer un email au Père Noël</a>')

Afficher un image clikable

self:updateView("la9","text", '<a href="https://www.lamborghini.com/fr-en"><img alt="Lamborghini-Countach-2021" src="https://www.largus.fr/images/images/countach-avg.jpg"width=150" height="100"></a>') --clickable

 

Voici le QA partager par notre ami FredoKL : Test_UI.fqa

  • Like 3
  • Lazer a épinglé ce sujet
  • 2 ans après...
Posté(e)

Salut tout le monde.

Je suis assez désireux de personnaliser l'apparence de mes QA, et j'ai commencé à tester pas mal de balises HTML. 

Je vous propose une liste de balises avec leur résultat en copie.

En ce qui concerne les images, il est aussi possible des les encoder en base64 dans le code LUA pour ne pas les appeler depuis l'extérieur.

 

self:updateView("label_html", "text", "<strong>strong</strong><br><em>em</em><br><i>i</i><br><u>u</u><br><font color='red' size='1'>font_color_red_size_1</font><br><small>small</small><br><big>big</big><br><sub>sub</sub><br><sup>sup</sup><br><code>code</code><br><kbd>kbd</kbd><br><s>s</s><br><mark>mark</mark><br><details><summary>summary</summary>detail1<br>detail2</details><br><pre>pre</pre><p><hr><img width='25%' src='https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'>")

 

donnera

 

image.thumb.png.09474ec89ba9c97bc2f4c1d055d721b6.png 

 

Il y en a d'autres classiques qui fonctionnent comme <TABLE> <UL> <OL> ...

 

Y'a moyen de pas mal déjà customiser les vues, alors si vous avez d'autres astuces, on peut partager ici :D

 

bon dimanche

 

 

  • Like 3
  • Thanks 1
Posté(e)

cool, j'en avais mise à un moment, puis avec un FW upgrade, ça ne fonctionnait plus, et pire ça affichait le texte de la balise.
Je vais donc réessayer => merci !

  • Like 1
Posté(e)

plein d'espoir, j'ai donc réessayé de ce pas, mais que fais-je mal ?

self:updateView("Config", "text", "<big>Durée filtration : </big>")

image.png.d3ce100d69f9ef597682c3f1c2a13600.png

 

Merci de votre aide

Posté(e) (modifié)

Tu n’as pas décoché la case “utiliser les nouvelles vues pour les apps” dans ta QA

 

INFOS ici

 

J’ai écrit une routine pour forcer la propriété webview sur false si tu veux 


 

mais pour commencer décoche cette case !!!

Modifié par fel-x
  • Like 1
Posté(e)

MERCI pour l'info. 

Evidemment ça fonctionne.

Je mettrai cela dans onInit() de chacun des mes QA.

  • Like 1
Posté(e) (modifié)

voici le code à ajouter dans onInit() dans toutes les QA qui emploient un affichage personnalisé (images, HTML...)

-- force 'Use the new views in mobile application' property to be disabled
  local ui_view = api.get("/devices/" .. self.id)
  local useUiView = ui_view.properties and ui_view.properties.useUiView
  hub.debug("UI VIEW PROPERTY", "Property 'Using new views in mobile app' is set to : " .. json.encode(useUiView))
    if useUiView == true then
    hub.debug("UI VIEW PROPERTY", "Property modification required to ensure compatibility in web and app views")
    hub.debug("UI VIEW PROPERTY", "Property 'Using new views in mobile app' has been disabled")
    hub.debug("UI VIEW PROPERTY", "Restarting QA...")
    api.put("/devices/" .. self.id, {properties = { useUiView = false } })
    elseif useUiView == false then
    hub.debug("UI VIEW PROPERTY", "App and Web view compatibility checked — no modification needed")
    else
    hub.debug("UI VIEW PROPERTY", "Unable to check App and Web view compatibility. Let's hope it works...")
    end

 

Le changement de cette propriété force la QA à redémarrer pas le choix !

Donc je préviens dans le debug.

Modifié par fel-x
  • Like 1
  • Thanks 2
Posté(e)
Il y a 2 heures, fel-x a dit :

la propriété webview sur false

Je n'ai pas trouvé la propriété Webview,

mais la useUiView qui bascule bien de False à true en fonction que la case soit cochée ou pas.

Donc, j'ai simplement rajouté ceci :

    self:updateProperty("useUiView", false)

et la case se décoche bien, MAIS les balises html ne son toujours pas interprétées.

Et quand je le change manuellement, c'est bon, donc il doit aussi changer autre chose ...

 si tu es ok pour partager le code "qui marche", je suis preneur.

Posté(e)
Il y a 4 heures, jojo a dit :

Je n'ai pas trouvé la propriété Webview,

Tu as raison.Je n'avais pas remarqué que mon smartphone avait auto-corrigé ce que je tapais.

Il s'agit bien de la 'useUiView' !

C'est à ma connaissance la seule qu'il faut changer.

Par contre si tu la passes à false, sans un restart de la QA ce ne sera pas pris en compte.

 

As-tu essayé le code que j'ai mis ci-dessus ? Il vérifie la valeur de useUiView et si elle est true, il la passe en false, alors que si elle est false il ne change rien. 

La différence avec ton code est que tu passes par updateProperty() alors qu'il faut passer par un api.put() afin que le changement soit pris en compte par la QA (ça la redémarre).

Je suis quasi certain que le problème vient de là.

 

 

Posté(e)
Il y a 22 heures, fel-x a dit :

As-tu essayé le code que j'ai mis ci-dessus ?

je l'ai zappé (yeux de m...) Je l'implémente de ce pas...

  • Haha 1
Posté(e)

On (moi en tous cas) en  apprend tous les jours !

Effectivement, c'était le restart du QA qui posait problème.

En fait, quand tu coches la case, tu dois sauver ta modif (ce qui génère un restart). Donc avec "mon" code fonctionne si je fait manuellement (ce qui n'est évidemment pas l'objectif) un save après.

Donc ton api.put fonctionnera car il ferait un save du QA, et il FAUT (en effet) faire un test de la valeur du paramètre, car sinon boucle infinie ...

Posté(e)

en effet le api.put relance le QA (ça se voit dans le debug)

 

J'ai modifié ton code car self.id n'était pas défini, et pour qu'il soit compatible avec ma  compréhension

    -- force 'Use the new views in mobile application' property to be disabled
    local useUiView = hub.getValue(plugin.mainDeviceId,"useUiView")
    if useUiView == nil then
        self:debug("paramètre inexistant")
    else
        self:debug("UI VIEW PROPERTY", "Property 'Using new views in mobile app' is set to :", useUiView)
        if useUiView then
            api.put("/devices/" .. plugin.mainDeviceId, {properties = { useUiView = false } })
        end
    end

 

×
×
  • Créer...