Ecran OLED et Polices ttf

Entraide Home Assistant
,
1

Bonjour,

Je suis totalement novice, et je tente d’apprendre grace a des exemples, je suis sur ce sujet décrit dans le « cookbook » « esphome Time & Temperature on OLED Display ».
Je bute sur l’installation de polices de caracteres dans /config/esphome/

Je ne comprend pas le principe, faut-il réellement télécharger des polices et les installer ? ou simplement écrire la phrase ‹ BebasNeue-Regular.ttf › dans le fichier de config ?
Existe t-il quelque part un tuto qui explique la démarche ?
merci pour votre aide .

Ma configuration

version core-2021.6.6
installation_type Home Assistant OS
dev false
hassio true
docker true
virtualenv false
python_version 3.8.9
os_name Linux
os_version 5.10.17-v8
arch aarch64
timezone America/Marigot
Home Assistant Cloud
logged_in false
can_reach_cert_server ok
can_reach_cloud_auth ok
can_reach_cloud ok
Home Assistant Supervisor
host_os Home Assistant OS 6.1
update_channel stable
supervisor_version supervisor-2021.06.3
docker_version 20.10.6
disk_total 28.6 GB
disk_used 4.8 GB
healthy true
supported true
board rpi4-64
supervisor_api ok
version_api ok
installed_addons Samba share (9.5.0), Mosquitto broker (6.0.1), ESPHome (1.19.4), Duck DNS (1.12.5), Home Assistant Google Drive Backup (0.104.3), File editor (5.3.1)
Lovelace
dashboards 2
resources 0
views 2
mode storage
[center]Texte à remplacer par votre configuration[/center] Comment récupérer ma configuration : Dans votre HA, Menu latéral `Configuration` > `Info` > bouton copier > `Pour Github` ![image|648x167, 75%](upload://1ietIxFU6nXP1GFrJTzwc2mh0j2.png) ___
2

Tout est expliqué en détails ici sur le site d’ESPHome Display Component — ESPHome et cela fonctionne très bien (attention à l’occupation mémoire dans l’ESP, les polices prennent beaucoup de place !). Si tu as toujours un soucis après avoir lu tout ca, poste ton code ici et où tu as mis les fichiers de police pour qu’on puisse t’aider :wink:

3

Grand merci Vincent, Je prend le temps de lire tout ca, et je te répond dés que mon neurone a refroidit…

4

Bonsoir…
Quelque chose m’échappe.
Dans ce tutoriel, je tombe sur la phrase mystérieuse suivante:
« To use fonts you first have to define a font object in your ESPHome configuration file. Just grab a .ttf file from somewhere on the internet and place it, for example, inside a fonts folder next to your configuration file. »
Qui dit que je dois importer un fichier .ttf de n’importe ou sur internet, et le placer dans un dossier config, en l’occurence, j’utilise le dossier * /config/esphome préconisé par le tuto…
mais je suppose qu’il ne s’ajit pas de n’importe quel fichier, mais de la police true type que l’on souhaite utiliser. si je prend l’exemple de la police arial.ttf, je la trouv effectivement, je la télécharge sous format zip, et je la décompresse dabs mes documents, (mon PC), or HA se trouve lui sur un PI4, est-ce que c’est pour cela que rien ne marche ?, est-ce que je dois faire la manip depuis le PI via VNC par exemple ?

5

Se traduit par :

Récupérer la police au format ttf et placez le fichier dans un dossier (par exemple fonts) à côté de votre fichier de configuration.

Et toi tu dis :

Tu vois le soucis ? :sweat_smile:

6

Oui il faut apprendre un minimum l’anglais mister @VieuxZebre plutôt que d’interpréter en n’importe quoi :smiley:
Sinon un exemple perso d’utilisation des polices dans ESPHome (le sketch de mon écran Inkplate), les fameux fichiers de polices ont été mis dans le dossier config/esphome/fonts soit via le gestionnaire de fichier de hassio ou le partage samba si tu as activé l’extension dans hassio !

substitutions:
  friendly_name: inkplate display
  partial_update: 10s
  full_update: "360"

esphome:
  name: inkplate
  platform: ESP32
  board: esp-wrover-kit

wifi:
  networks:
  - ssid: !secret wifi
    password: !secret wifi_passwd

#deep_sleep:
#  run_duration: 120s
#  sleep_duration: 10min

logger:

api:

switch:
  - platform: restart
    name: "Inkplate Reboot"
    id: reboot
  - platform: gpio
    id: battery_read_mosfet
    pin:
      mcp23xxx: mcp23017_hub
      number: 9
      inverted: true
  - platform: template
    name: "Inkplate Partial Updating"
    lambda: return id(inkplate_display).get_partial_updating();
    turn_on_action:
      - lambda: id(inkplate_display).set_partial_updating(true);
    turn_off_action:
      - lambda: id(inkplate_display).set_partial_updating(false);
      
text_sensor:
  - platform: wifi_info
    ip_address:
      name: $friendly_name IP Address
#  - platform: homeassistant
#    id: garage_1
#    name: Garage 1
#    entity_id: cover.garage_1_door
#  - platform: homeassistant
#    id: garage_2
#    name: Garage 2
#    entity_id: cover.garage_2_door
  - platform: homeassistant
    id: current_weather
    entity_id: weather.lausanne
  - platform: homeassistant
    id: current_weather_bayonne
    entity_id: weather.bayonne
  - platform: homeassistant
    id: current_weather_espezel
    entity_id: weather.espezel
  - platform: homeassistant
    id: current_weather_rabat
    entity_id: weather.rabat
  - platform: homeassistant
    entity_id: sensor.ligne_1_depart
    id: ligne_1_depart
    internal: true
  - platform: homeassistant
    entity_id: sensor.ligne_1_depart_depart
    id: ligne_1_depart_depart
    internal: true
  - platform: homeassistant
    entity_id: sensor.ligne_1_depart_depart_depart
    id: ligne_1_depart_depart_depart
    internal: true
  - platform: homeassistant
    entity_id: sensor.ligne_21_depart
    id: ligne_21_depart
    internal: true
  - platform: homeassistant
    entity_id: sensor.ligne_21_depart_depart
    id: ligne_21_depart_depart
    internal: true
  - platform: homeassistant
    entity_id: sensor.ligne_21_depart_depart_depart
    id: ligne_21_depart_depart_depart
    internal: true

sensor:
  - platform: adc
    id: battery_voltage
    update_interval: never
    attenuation: 11db
    pin: 35
  - platform: template
    name: "Inkplate Battery Voltage"
    lambda: |-
      id(battery_read_mosfet).turn_on();
      delay(1);
      float adc = id(battery_voltage).sample();
      id(battery_read_mosfet).turn_off();
      return adc;
    filters:
      - multiply: 2
  - platform: wifi_signal
    name: $friendly_name WiFi Strength
    update_interval: 60s
  - platform: uptime
    name: $friendly_name "Uptime"
  - platform: homeassistant
    id: temp_lausanne
    name: "Lausanne"
    entity_id: sensor.temp_ext_lausanne
    internal: true
  - platform: homeassistant
    id: temp_int_lausanne
    name: "Lausanne Int."
    entity_id: sensor.temperature_2
    internal: true
  - platform: homeassistant
    id: temp_bayonne
    name: "Bayonne"
    entity_id: sensor.temp_ext_bayonne
    internal: true
  - platform: homeassistant
    id: hum_bayonne
    name: "Bayonne"
    entity_id: sensor.hum_ext_bayonne
    internal: true
  - platform: homeassistant
    id: temp_espezel
    name: "Espezel"
    entity_id: sensor.temp_ext_espezel
    internal: true
  - platform: homeassistant
    id: hum_espezel
    name: "Espezel"
    entity_id: sensor.hum_ext_espezel
    internal: true
  - platform: homeassistant
    id: temp_rabat
    name: "Rabat"
    entity_id: sensor.temp_ext_rabat
    internal: true
  - platform: homeassistant
    id: hum_rabat
    name: "Rabat"
    entity_id: sensor.hum_ext_rabat
    internal: true
  - platform: homeassistant
    id: hum_lausanne
    name: "Humidité"
    entity_id: sensor.hum_2
  - platform: homeassistant
    id: co2_lausanne
    name: "Humidité"
    entity_id: sensor.co2_value
    internal: true
  - platform: homeassistant
    entity_id: sensor.plex_lausanne
    id: plex_users
    internal: true
  - platform: homeassistant
    entity_id: binary_sensor.internet
    id: internet
    internal: true
  - platform: homeassistant
    entity_id: binary_sensor.remote_ui
    id: remote_ui
    internal: true
  - platform: homeassistant
    entity_id: binary_sensor.rpi_power_status
    id: rpi_power_status
    internal: true
  - platform: homeassistant
    entity_id: binary_sensor.pro_3_ipv4
    id: pro_3
    internal: true
  - platform: homeassistant
    entity_id: binary_sensor.ns1_ams_ipv4
    id: ns1
    internal: true
  - platform: homeassistant
    entity_id: binary_sensor.ns4_waw_ipv4
    id: ns4
    internal: true
  - platform: homeassistant
    entity_id: sensor.hp_laserjet_200_colormfp_m276nw_cyan_cartridge_hp_cf211a
    id: printer_cyan
    internal: true
  - platform: homeassistant
    entity_id: sensor.hp_laserjet_200_colormfp_m276nw_magenta_cartridge_hp_cf213a
    id: printer_magenta
    internal: true
  - platform: homeassistant
    entity_id: sensor.hp_laserjet_200_colormfp_m276nw_yellow_cartridge_hp_cf212a
    id: printer_yellow
    internal: true
  - platform: homeassistant
    entity_id: sensor.hp_laserjet_200_colormfp_m276nw_black_cartridge_hp_cb540a
    id: printer_black
    internal: true
  

i2c:

mcp23017:
  - id: mcp23017_hub
    address: 0x20

binary_sensor:
  - platform: status
    name: "Inkplate Status"
    id: system_status
  - platform: gpio
    name: "Inkplate Touch Pad 1"
    pin:
      mcp23xxx: mcp23017_hub
      number: 10
  - platform: gpio
    name: "Inkplate Touch Pad 2"
    pin:
      mcp23xxx: mcp23017_hub
      number: 11
  - platform: gpio
    name: "Inkplate Touch Pad 3"
    pin:
      mcp23xxx: mcp23017_hub
      number: 12

time:
  - platform: sntp
    id: esptime
    timezone: Europe/Zurich

font:
  - file: "fonts/BebasNeue-Regular.ttf"
    id: helvetica_96
    size: 96
    glyphs: '!"%()+,-_.:°0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz/'
  - file: "fonts/BebasNeue-Regular.ttf"
    id: helvetica_85
    size: 85
    glyphs: '!"%()+,-_.:°0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz/'
  - file: "fonts/BebasNeue-Regular.ttf"
    id: helvetica_48
    size: 48
    glyphs: '!"%()+,-_.:°0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz/'
  - file: "fonts/BebasNeue-Regular.ttf"
    id: helvetica_36
    size: 36
    glyphs: '!"%()+,-_.:°0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz/'
  - file: "fonts/BebasNeue-Regular.ttf"
    id: helvetica_25
    size: 25
    glyphs: '!"%()+,-_.:°0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz/'

image:
  - file: "images/0-default.png"
    id: wpng_0
    type: BINARY
  - file: "images/1-clear-night.png"
    id: wpng_1
    type: BINARY
  - file: "images/2-cloudy.png"
    id: wpng_2
    type: BINARY
  - file: "images/3-fog.png"
    id: wpng_3
    type: BINARY
  - file: "images/4-hail.png"
    id: wpng_4
    type: BINARY
  - file: "images/5-lightning.png"
    id: wpng_5
    type: BINARY
  - file: "images/6-lightning-rainy.png"
    id: wpng_6
    type: BINARY
  - file: "images/7-partlycloudy.png"
    id: wpng_7
    type: BINARY
  - file: "images/8-pouring.png"
    id: wpng_8
    type: BINARY
  - file: "images/9-rainy.png"
    id: wpng_9
    type: BINARY
  - file: "images/10-snowy.png"
    id: wpng_10
    type: BINARY
  - file: "images/11-snowy-rainy.png"
    id: wpng_11
    type: BINARY
  - file: "images/12-sunny.png"
    id: wpng_12
    type: BINARY
  - file: "images/13-windy.png"
    id: wpng_13
    type: BINARY
  - file: "images/14-windy-variant.png"
    id: wpng_14
    type: BINARY
  - file: "images/15-exceptional.png"
    id: wpng_15
    type: BINARY

display:
- platform: inkplate6
  id: inkplate_display
  greyscale: false
  partial_updating: true
  update_interval: $partial_update
  full_update_every: $full_update # When partial updating is enabled, forces a full screen update after chosen number of updates
  ckv_pin: 32
  sph_pin: 33
  gmod_pin:
    mcp23xxx: mcp23017_hub
    number: 1
  gpio0_enable_pin:
    mcp23xxx: mcp23017_hub
    number: 8
  oe_pin:
    mcp23xxx: mcp23017_hub
    number: 0
  spv_pin:
    mcp23xxx: mcp23017_hub
    number: 2
  powerup_pin:
    mcp23xxx: mcp23017_hub
    number: 4
  wakeup_pin:
    mcp23xxx: mcp23017_hub
    number: 3
  vcom_pin:
    mcp23xxx: mcp23017_hub
    number: 5
  pages:
    - id: page1
      lambda: |-
        it.fill(COLOR_ON);
        // Icones meteo Lausanne
        if (id(current_weather).state == "clear-night")
        {
           it.image(25, 25, id(wpng_1));
        }
        else if (id(current_weather).state == "cloudy")
        {
           it.image(25, 25, id(wpng_2));
        }
        else if (id(current_weather).state == "fog")
        {
           it.image(25, 25, id(wpng_3));
        }
        else if (id(current_weather).state == "hail")
        {
           it.image(25, 25, id(wpng_4));
        }
        else if (id(current_weather).state == "lightning")
        {
           it.image(25, 25, id(wpng_5));
        }
        else if (id(current_weather).state == "lightning-rainy")
        {
           it.image(25, 25, id(wpng_6));
        }
        else if (id(current_weather).state == "partlycloudy")
        {
           it.image(25, 25, id(wpng_7));
        }
        else if (id(current_weather).state == "pouring")
        {
           it.image(25, 25, id(wpng_8));
        }
        else if (id(current_weather).state == "rainy")
        {
           it.image(25, 25, id(wpng_9));
        }
        else if (id(current_weather).state == "snowy")
        {
           it.image(25, 25, id(wpng_10));
        }
        else if (id(current_weather).state == "snowy-rainy'")
        {
           it.image(25, 25, id(wpng_11));
        }
        else if (id(current_weather).state == "sunny")
        {
           it.image(25, 25, id(wpng_12));
        }
        else if (id(current_weather).state == "windy")
        {
           it.image(25, 25, id(wpng_13));
        }
        else if (id(current_weather).state == "windy-variant")
        {
           it.image(25, 25, id(wpng_14));
        }
        else if (id(current_weather).state == "exceptional")
        {
           it.image(25, 25, id(wpng_15));
        }
        else
        {
           it.image(25, 25, id(wpng_0));
        }
        // icones Meteo Bayonne
        if (id(current_weather_bayonne).state == "clear-night")
        {
           it.image(175, 25, id(wpng_1));
        }
        else if (id(current_weather_bayonne).state == "cloudy")
        {
           it.image(175, 25, id(wpng_2));
        }
        else if (id(current_weather_bayonne).state == "fog")
        {
           it.image(175, 25, id(wpng_3));
        }
        else if (id(current_weather_bayonne).state == "hail")
        {
           it.image(175, 25, id(wpng_4));
        }
        else if (id(current_weather_bayonne).state == "lightning")
        {
           it.image(175, 25, id(wpng_5));
        }
        else if (id(current_weather_bayonne).state == "lightning-rainy")
        {
           it.image(175, 25, id(wpng_6));
        }
        else if (id(current_weather_bayonne).state == "partlycloudy")
        {
           it.image(175, 25, id(wpng_7));
        }
        else if (id(current_weather_bayonne).state == "pouring")
        {
           it.image(175, 25, id(wpng_8));
        }
        else if (id(current_weather_bayonne).state == "rainy")
        {
           it.image(175, 25, id(wpng_9));
        }
        else if (id(current_weather_bayonne).state == "snowy")
        {
           it.image(175, 25, id(wpng_10));
        }
        else if (id(current_weather_bayonne).state == "snowy-rainy'")
        {
           it.image(175, 25, id(wpng_11));
        }
        else if (id(current_weather_bayonne).state == "sunny")
        {
           it.image(175, 25, id(wpng_12));
        }
        else if (id(current_weather_bayonne).state == "windy")
        {
           it.image(175, 25, id(wpng_13));
        }
        else if (id(current_weather_bayonne).state == "windy-variant")
        {
           it.image(175, 25, id(wpng_14));
        }
        else if (id(current_weather_bayonne).state == "exceptional")
        {
           it.image(175, 25, id(wpng_15));
        }
        else
        {
           it.image(175, 25, id(wpng_0));
        }
        // icones Meteo Espezel
        if (id(current_weather_espezel).state == "clear-night")
        {
           it.image(325, 25, id(wpng_1));
        }
        else if (id(current_weather_espezel).state == "cloudy")
        {
           it.image(325, 25, id(wpng_2));
        }
        else if (id(current_weather_espezel).state == "fog")
        {
           it.image(325, 25, id(wpng_3));
        }
        else if (id(current_weather_espezel).state == "hail")
        {
           it.image(325, 25, id(wpng_4));
        }
        else if (id(current_weather_espezel).state == "lightning")
        {
           it.image(325, 25, id(wpng_5));
        }
        else if (id(current_weather_espezel).state == "lightning-rainy")
        {
           it.image(325, 25, id(wpng_6));
        }
        else if (id(current_weather_espezel).state == "partlycloudy")
        {
           it.image(325, 25, id(wpng_7));
        }
        else if (id(current_weather_espezel).state == "pouring")
        {
           it.image(325, 25, id(wpng_8));
        }
        else if (id(current_weather_espezel).state == "rainy")
        {
           it.image(325, 25, id(wpng_9));
        }
        else if (id(current_weather_espezel).state == "snowy")
        {
           it.image(325, 25, id(wpng_10));
        }
        else if (id(current_weather_espezel).state == "snowy-rainy'")
        {
           it.image(325, 25, id(wpng_11));
        }
        else if (id(current_weather_espezel).state == "sunny")
        {
           it.image(325, 25, id(wpng_12));
        }
        else if (id(current_weather_espezel).state == "windy")
        {
           it.image(325, 25, id(wpng_13));
        }
        else if (id(current_weather_espezel).state == "windy-variant")
        {
           it.image(325, 25, id(wpng_14));
        }
        else if (id(current_weather_espezel).state == "exceptional")
        {
           it.image(325, 25, id(wpng_15));
        }
        else
        {
           it.image(325, 25, id(wpng_0));
        }
        // icones Meteo Rabat
        if (id(current_weather_rabat).state == "clear-night")
        {
           it.image(475, 25, id(wpng_1));
        }
        else if (id(current_weather_rabat).state == "cloudy")
        {
           it.image(475, 25, id(wpng_2));
        }
        else if (id(current_weather_rabat).state == "fog")
        {
           it.image(475, 25, id(wpng_3));
        }
        else if (id(current_weather_rabat).state == "hail")
        {
           it.image(475, 25, id(wpng_4));
        }
        else if (id(current_weather_rabat).state == "lightning")
        {
           it.image(475, 25, id(wpng_5));
        }
        else if (id(current_weather_rabat).state == "lightning-rainy")
        {
           it.image(475, 25, id(wpng_6));
        }
        else if (id(current_weather_rabat).state == "partlycloudy")
        {
           it.image(475, 25, id(wpng_7));
        }
        else if (id(current_weather_rabat).state == "pouring")
        {
           it.image(475, 25, id(wpng_8));
        }
        else if (id(current_weather_rabat).state == "rainy")
        {
           it.image(475, 25, id(wpng_9));
        }
        else if (id(current_weather_rabat).state == "snowy")
        {
           it.image(475, 25, id(wpng_10));
        }
        else if (id(current_weather_rabat).state == "snowy-rainy'")
        {
           it.image(475, 25, id(wpng_11));
        }
        else if (id(current_weather_rabat).state == "sunny")
        {
           it.image(475, 25, id(wpng_12));
        }
        else if (id(current_weather_rabat).state == "windy")
        {
           it.image(475, 25, id(wpng_13));
        }
        else if (id(current_weather_rabat).state == "windy-variant")
        {
           it.image(475, 25, id(wpng_14));
        }
        else if (id(current_weather_rabat).state == "exceptional")
        {
           it.image(475, 25, id(wpng_15));
        }
        else
        {
           it.image(475, 25, id(wpng_0));
        }
        // Time
        // Weekday 
        it.strftime(620, 25, id(helvetica_48), COLOR_OFF, TextAlign::TOP_LEFT, "%A", id(esptime).now());
        it.strftime(620, 100, id(helvetica_48), COLOR_OFF, TextAlign::TOP_LEFT, "%d/%m/%y", id(esptime).now());
        it.strftime(620, 150, id(helvetica_96), COLOR_OFF, TextAlign::TOP_LEFT, "%H:%M", id(esptime).now());
    
        // Temperature 
        if (id(temp_lausanne).has_state()) {
          it.print(25, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Lau. ");
          it.printf(65, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.1f°C", id(temp_lausanne).state);
        }
        if (id(hum_lausanne).has_state()) {
          it.print(25, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Hum. ");
          it.printf(65, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.0f%%", id(hum_lausanne).state);
        }
        if (id(temp_int_lausanne).has_state()) {
          it.print(25, 225, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Int. ");
          it.printf(65, 225, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.0f°C", id(temp_int_lausanne).state);
        }
        if (id(co2_lausanne).has_state()) {
          it.print(25, 255, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Co2. ");
          it.printf(65, 255, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.0fppm", id(co2_lausanne).state);
        }

        if (id(temp_bayonne).has_state()) {    
          it.print(175, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Bay. ");
          it.printf(215, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.1f°C", id(temp_bayonne).state);
        }
        if (id(hum_bayonne).has_state()) {
          it.print(175, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Hum. ");
          it.printf(215, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.0f%%", id(hum_bayonne).state);
        }
    
        if (id(temp_espezel).has_state()) {
          it.print(325, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Esp. ");
          it.printf(365, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.1f°C", id(temp_espezel).state);
        }
        if (id(hum_espezel).has_state()) {
          it.print(325, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Hum. ");
          it.printf(365, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.0f%%", id(hum_espezel).state);
        }
        
        if (id(temp_rabat).has_state()) {
          it.print(475, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Rab. ");
          it.printf(515, 165, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.1f°C", id(temp_rabat).state);
        }
        if (id(hum_rabat).has_state()) {
          it.print(475, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Hum. ");
          it.printf(515, 195, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%.0f%%", id(hum_rabat).state);
        }
        
        // Line x=10, y=180 to x=590, y=180
        it.line(10, 290, 790, 290, COLOR_OFF);
        
        it.print(25, 310, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "Bus 6");
        it.printf(25, 350, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%s", id(ligne_1_depart).state.c_str());
        it.printf(25, 380, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%s", id(ligne_1_depart_depart).state.c_str());
        it.printf(25, 410, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%s", id(ligne_1_depart_depart_depart).state.c_str());
        
        it.print(120, 310, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "M2)");
        it.printf(120, 350, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%s", id(ligne_21_depart).state.c_str());
        it.printf(120, 380, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%s", id(ligne_21_depart_depart).state.c_str());
        it.printf(120, 410, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "%s", id(ligne_21_depart_depart_depart).state.c_str());
        
        // Status
        
        it.print(25, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "PLEX");
        it.printf(30, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT , "%.0f", id(plex_users).state);

        it.print(75, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "NET");
        if (id(internet).state == true) {
          it.print(75, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "OK");
        } else {
          it.print(75, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "DN");
        }
        
        it.print(125, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "REM.");
        if (id(remote_ui).state == true) {
          it.print(125, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "OK");
        } else {
          it.print(125, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "DN");
        }
        
        it.print(175, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "POW.");
        if (id(rpi_power_status).state == false) {
          it.print(175, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "Dn");
        } else {
          it.print(175, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "OK");
        }
        
        it.print(225, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Pro3");
        if (id(pro_3).state == false) {
          it.print(225, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "Dn");
        } else {
          it.print(225, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "OK");
        }
        
        it.print(275, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Ns1");
        if (id(ns1).state == false) {
          it.print(275, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "Dn");
        } else {
          it.print(275, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "OK");
        }
        
        it.print(325, 500, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT, "Ns4");
        if (id(ns4).state == false) {
          it.print(325, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "Dn");
        } else {
          it.print(325, 540, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "OK");
        }

        // Printer
        
        it.print(620, 310, id(helvetica_36), COLOR_OFF, TextAlign::TOP_LEFT, "Printer");
        it.printf(640, 350, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT , "Cyan: %.0f%%", id(printer_cyan).state);
        it.printf(640, 380, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT , "Mag.: %.0f%%", id(printer_magenta).state);
        it.printf(640, 410, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT , "Yel.: %.0f%%", id(printer_yellow).state);
        it.printf(640, 440, id(helvetica_25), COLOR_OFF, TextAlign::TOP_LEFT , "Blk.: %.0f%%", id(printer_black).state);
7

Oui, je vois le souci mon ami…
Je vais tenter d’y remédier mais le chemin sera long, je comprend avant tout que HA n’est pas du tout à la portée d’un novice comme moi. Mais je n’ai pas envie de retourner sur Domoticz qui par contre est à la portée de n’importe qui.
HA est installé sur un PI, mais j’y accede depuis un PC via son adresse IP,
Je suppose donc que c’est depuis HA que je dois installer les polices, Vincent me met sur la voie en parlant de Samba, Je regarde tout ça ce matin.
Content néanmoins de vous avoir fait rire… Je sens que ce n’est pas fini d’ailleurs :smirk:

8

:grinning: Ca Y est, ca marche… Merci pour votre aide Vincen et Clemalex, Effectivement et vous avez eu raison de me reprendre, je n’apréhendais pas correctement l’arborescence des fichiers de config… Je sens d’ailleurs qu’il me reste beaucoup à apprendre là dessus,
De surcroit Le premier fichier Arial.ttf téléchargé n’était pas un truetype, et m’a bien chauffé les neurone,
Mais comme je vous l’ai dit, je part presque de Zéro. et c’est dans la galère que l’on progresse.

Derniere remarque: j’ai voulu mettre les polices dans un dossier ‹ fonts › dans * /config/esphome/fonts
or le sketch s’evertue à chercher la police dans /config/esphome, faut-il juste relancer l’appli ? quel tuto me conseillez vous pour en apprendre plus sur l’organisation et la mise a jour des fichiers de config… mais bon, ca je trouverai moi même.
Encore merci de votre aide.

9

En principe les ttf sont des truetype mais tu peux le vérifier facilement soit en regardant les propriétés du fichiers dans ton OS favori (même Windows l’indique :wink: ou en l’ouvrant dans le gestionnaire de polices de ton ordi :wink:

Ben non si tu fais comme dans mon exemple les polices sont dans un sous-dossier fonts d’esphome et c’est indiqué dans le chemin de la police dans le sketch (le paramètre file :wink:

Attention par contre que chaque occurrence que tu déclares d’une police dans le sketch prend de la place en Flash et que tu as vite fait de t’aliéner les capacités d’OTA de l’ESP :expressionless: et ne parlons pas du code de mise en page (celui que j’ai posté plus haut occupe 91% de la flash de l’ESP dans lequel il est chargé ! et du coup pas d’OTA :frowning_face:

1 « J'aime »