basic_example.yaml

### 
### This is a basic example, showing all features of the Button+
### 

esphome:
  name: buttonplus-test
  friendly_name: ButtonPlus_test

esp32:
  board: esp32-s3-devkitc-1
  flash_size: 16MB
  framework:
    type: arduino

# Enable logging
logger:

# Enable Home Assistant API
api:
  encryption:
    key: "xxx"

ota:
  - platform: esphome
    password: "xxx"

wifi:
  ssid: !secret wifi_ssid
  password: !secret wifi_password
  
### 
### Code below is specific for the Button+
###
    
packages:
  remote_package_files:
    url: https://github.com/dixi83/ESPHome_ButtonPlus
    files: [package/1bar_1display.yaml]
    ref: main 
    refresh: 1d

font:
  - file: "https://github.com/web-fonts/ttf/raw/refs/heads/master/bpg-ingiri-arial-webfont.ttf"
    id: my_font20
    size: 20
  - file: "https://github.com/web-fonts/ttf/raw/refs/heads/master/bpg-ingiri-arial-webfont.ttf"
    id: my_font15
    size: 15
  - file: "https://github.com/web-fonts/ttf/raw/refs/heads/master/bpg-ingiri-arial-webfont.ttf"
    id: my_font40
    size: 40

image:
  - file: mdi:lightbulb
    id: lightbulb
    resize: 80x80
  - file: mdi:alert
    id: alert
    resize: 80x80
  - file: "https://i.postimg.cc/CMXFmZ5n/henk.png"
    id: henk
    resize: 120x100
    type: RGB565
    use_transparency: true

color:
  - id: red
    hex: FF0000
  - id: blue
    hex: 0000FF
  - id: yellow
    hex: FFFF00
  - id: green
    hex: 00FF00

display:
  - id: !extend display_j2_main
    lambda: |-
      // Print inside temperature (from homeassistant sensor)
      if (id(inside_temperature).has_state()) {
        it.printf(2, 60, id(my_font20), id(blue), TextAlign::BASELINE_LEFT , "%.1f°", id(inside_temperature).state);
      }
      it.printf(2, 80, id(my_font15), id(blue), TextAlign::BASELINE_LEFT, "Binnen");

      // Print time and date
      it.strftime(160, 60, id(my_font40), TextAlign::BASELINE_CENTER, "%H:%M", id(datetime).now());
      it.strftime(160, 80, id(my_font20), id(red), TextAlign::BASELINE_CENTER, "%d-%m-%Y", id(datetime).now());

      // Draw the image my_online_image at position
      // it.image(160, 100, id(henk), ImageAlign::TOP_CENTER);
  - id: !extend display_j3_Left
    lambda: |-
      it.image(80, 0, id(lightbulb), ImageAlign::TOP_CENTER, id(red));
  - id: !extend display_j3_Right
    lambda: |-
      it.image(80, 0, id(alert), ImageAlign::TOP_CENTER);