● HA작업) LVGL Display 메뉴구성 media_player.volume_set 볼륨조정




컨텐츠 정보


본문

●  HA작업) LVGL Display 메뉴구성 media_player.volume_set  볼륨조정

볼륨부분

3232235521_1727719391.6947.png

1)센서부분 조건

# Home Assistant에서 media_player의 volume_level을 슬라이더 및 라벨에 연동
  - platform: homeassistant
    id: speaker_vol_11
    entity_id: media_player.nest_hub_seojae
    attribute: volume_level
    on_value:
      - then:
          - lvgl.slider.update:
              id: speaker_vol_11_slider
              value: !lambda |-
                return (x * 100);
              animated: LV_ANIM_ON
             
          - lvgl.label.update:
              id: volume_label_11
              text: !lambda |-
                static char buf[15];
                float percentage = x * 100;
                snprintf(buf, sizeof(buf), "%.0f%%", percentage); \
                return {buf};


2) 위젯부분 구성


                    - slider:
                          id: speaker_vol_11_slider  # 슬라이더 ID 정의
                          x: 0
                          y: 50
                          align: TOP_LEFT
                          width: 50
                          height: 300
                          pad_all: 8
                          min_value: 0
                          max_value: 100
                          adv_hittest: true
                          on_value:
                            - homeassistant.action:
                                action: media_player.volume_set
                                data:
                                  entity_id: media_player.nest_hub_seojae
                                  volume_level: !lambda 'return (x / 100);'
                                 
                            - lvgl.label.update:
                                id: volume_label_11
                                text: !lambda |-
                                  static char buf[15];
                                  snprintf(buf, sizeof(buf), "%.0f%%", x);
                                  return {buf};

                      - label:
                          id: volume_label_11  # 텍스트 라벨 ID 정의
                          x: 0
                          y: 150
                          width: 50
                          height: 50
                          align: TOP_LEFT
                          text: "---"  # 초기 텍스트 값
                          text_font: font_26
                          text_color: 0xFFA500
                          text_align: CENTER

                      - button:
                          x: 0
                          y: 0
                          # id: madia_hub1_btn  # change item
                          align: TOP_LEFT
                          width: 50
                          height: 50
                          checkable: true
                          widgets:

                            - label:
                                text: 'Hub'  # change item F0425
                                text_font: font_21
                                text_align: CENTER
                                text_color: 0xFFFFFF
                                align: BOTTOM_MID

                            - label:
                                # id: lbl_Radio_power_1
                                text_font: font_40
                                text_align: CENTER
                                text: "\U000F0425" # POWER ICON F0425                                    
                                text_color: 0xFF0000
                                align: CENTER

                          on_click:
                            then:
                              - homeassistant.service:
                                  # service: media_player.media_play_pause
                                  service: media_player.toggle
                                  data:
                                    entity_id: media_player.nest_hub_seojae  # change item                          
# ----------------------------------------------------------------------------


수평으로 변경 하는 방법

lvgl:

  slider:

    id: slider_media_player3  # 슬라이더 ID

    x: 200

    y: 50

    align: TOP_LEFT

    width: 300  # 수평 슬라이더의 너비를 길게 설정

    height: 50  # 수평 슬라이더의 높이를 작게 설정

    pad_all: 8

    min_value: 0

    max_value: 100

    adv_hittest: true

==============
3232235521_1727719509.2073.png

<  볼륨 조정 하는 방법>
백라이트는 동작 범위는 0 ~ 255 입니다 백분율료 표시 하기  
0 으로 가면 화면이 나오지 않고  이상  문제 발생 5 ~ 250 범위지정
3232235521_1727719550.6526.png

위젯 부분 > 슬라이드 적용 > 소스 동작 
3232235521_1727744258.3095.png

위젯 부분

                 - obj:
                        x: 0
                        y: 10
                        align: CENTER
                        width: 600
                        height: 300
                        styles: card
                        widgets:
                          - slider:
                              id: back_light_in
                              x: 0
                              y: 0
                              width: 450
                              height: 80
                              pad_all: 5
                              min_value: 5
                              max_value: 250
                              align: CENTER
                              on_release:
                                - homeassistant.action:
                                    action: light.turn_on
                                    data:
                                      entity_id: ${back_light_id_on_off_id_entity_id}
                                      brightness: !lambda 'return int(x);'

                          - label:
                              text: "Back_Light"  # 글자는 영어로 먼저 하고 한글은 나중에
                              x: 0
                              y: 80
                              align: CENTER
                              recolor: true
                              text_align: CENTER
                              text_font: title_font
                              text_color: 0xF5F5F5

                          - label: # 백라이트 밝기 % 표시
                              x: 0
                              y: 10
                              width: 450
                              height: 80
                              align: CENTER
                              text: "---"  # UI TEXT 초기값
                              id: back_light_in_text # UI TEXT 백라이트 밝기 표시
                              text_font: font_40
                              text_color: 0xFFA500
                              text_align: CENTER      


센서부분에서 계산을 합니다.
# =============================================================================
# sensor: #에 추가합니다
  - platform: homeassistant
    id: light_brightness
    entity_id: ${back_light_id_on_off_id_entity_id}
    attribute: brightness
    on_value:
      - lambda: |-
          // Convert brightness to percentage (1% to 100%)
          float percentage = ((x - 5) / (250.0 - 5)) * 100;

      - lvgl.slider.update:
          id: back_light_in
          value: !lambda |-
            return (int)x;  // Update slider value with raw brightness
     
      - lvgl.label.update:
          id: back_light_in_text
          text: !lambda |-
            static char buf[15];
            float percentage = ((x - 5) / (250.0 - 5)) * 100;
            snprintf(buf, sizeof(buf), "%.0f%%", percentage);
            return {buf};  // Return the percentage text  


최근 lvgl display 작업 내용 2024_1002_1042_03
3232235521_1727744392.939.png

=
3232235521_1727719462.176.png

보일러 적용

3232235521_1727719476.8086.png


보일러 적용 슬라이더

주) + , -는 동작 하지 않음

3232235521_1727719490.7814.png

                   widgets:
                    - obj:
                        x: 10
                        y: 10
                        align: TOP_LEFT
                        styles: card
                        width: 350
                        height: 370
                        radius: 20
                        widgets:

                          - arc:
                              x: 0
                              y: 0
                              width: 300
                              height: 300
                              border_width: 0
                              bg_opa: TRANSP
                              align: CENTER
                              adjustable: true     # 조절 가능한지 여부, false의 경우 수치 조정 안 됨
                              min_value: 18
                              max_value: 30
                              arc_width: 30
                              id: climate_set_temp_arc33 #센서 부에서 lvgl.indicator.update: 로 변경 가능 sensor부에서 정보옴
                              # aircon_set_temp_arc  to climate_set_temp_arc
                              indicator:
                                arc_color: 0x007BB0
                                arc_width: 30
                              on_release:
                              # on_release:
                                then:
                                  - homeassistant.action:
                                      action: climate.set_temperature
                                      data:
                                        entity_id: climate.485_ttl_ip109_bookroom_boier
                                        temperature: !lambda 'return x;'
                                       
                              widgets:
                                - label:
                                    x: 0
                                    y: 50
                                    align: TOP_MID
                                    text: "book_room"
                                    # id: climate_set_temp_arc33
                                    text_font: font_25
                                    text_color: 0xE5E5E5
                                    text_align: CENTER

                                - label:
                                    x: 0
                                    y: 80
                                    align: TOP_MID
                                    text: "--.-°c"
                                    id: climate_set_temp_arc33_text  # aircon_set_temp_text 를 climate_set_temp_arc_text
                                    text_font: font_25
                                    text_color: 0xFF0000
                                    text_align: CENTER

                                - label:
                                    x: 0
                                    y: 130
                                    align: TOP_MID
                                    text: "setting_tmp"
                                    text_font: font_25
                                    text_color: 0xE5E5E5
                                    text_align: CENTER
                          - button:
                              x: 100
                              y: 200
                              width: 50
                              height: 50
                              align: TOP_LEFT
                              bg_opa: TRANSP
                              radius: 75
                              outline_width: 1
                              checkable: true
                              id: spin_down_climate_33 #                                          
                              on_click:
                                then:
                                  - homeassistant.action:
                                      action: climate.set_temperature
                                      data:
                                        entity_id: climate.485_ttl_ip109_bookroom_boier  #
                                        temperature: !lambda 'return (id(climate_set_temp_arc33).state) - 1 ;'
                                     
                                                                         
                              widgets:
                                - label:
                                    align: CENTER
                                    text: "-"
                                    text_align: center
                                    text_font: font_40

 

                          - button:
                              x: 200
                              y: 200
                              width: 50
                              height: 50
                              align: TOP_LEFT
                              bg_opa: TRANSP
                              radius: 75
                              outline_width: 1
                              checkable: true
                              id: spin_up_climate_33 #  
                              on_click:
                                then:
                                  - homeassistant.action:
                                      action: climate.set_temperature
                                      data:
                                        entity_id: climate.485_ttl_ip109_bookroom_boier
                                        temperature: !lambda 'return (id(climate_set_temp_arc33).state) + 1;'

                                     
                              widgets:
                                - label:
                                    align: CENTER
                                    text: "+"
                                    text_align: center
                                    text_font: font_40
                          - label:
                              x: 110
                              y: 250
                              align: TOP_LEFT
                              text: "현재 온도 --.-°c"
                              id: label_current_climate_temperature33
                              text_font: font_40
                              text_color: 0x00FF00
                              text_align: CENTER    
# ----------------------------------------------------------------- power button 추가
                          - button:
                              x: 40 # + 200
                              y: 300 # + 90
                              align: TOP_LEFT
                              width: 270
                              height: 50
                              radius: 10
                              border_width: 5     # 위젯 안의 오렌지색 border 너비를 10 pixel로 설정
                              border_color: 0x2F8CD8       # 컬러는 0x000000 HEX 색상, 0은 블랙
                              checkable: true
                              id: btn_text_sensor_temperature_c_climate33 #  # text_sensor: 777777777777777777777777777777777777777
                              on_short_click:
                                - homeassistant.action:
                                    action: climate.toggle
                                    data:
                                      entity_id: climate.485_ttl_ip109_bookroom_boier  # 777777777777777777777777777777777777777
                              widgets:
                                - label:
                                    id: lbl_text_sensor_temperature_c_climate33 # 777777777777777777777777777777777777777
                                    align: TOP_LEFT  # Center the label vertically and horizontally                                    
                                    text_font: font_40  # Adjust text font size
                                    text: "\U000F0425" # U000F0F92"  # Boiler icon  U000F0425 # power iocn
                                    text_align: LEFT
                                    x: -20
                                    y: -10
                                - label:
                                    # id: lbl_text_sensor_temperature_c_climate33 # 777777777777777777777777777777777777777
                                    align: TOP_LEFT  # Center the label vertically and horizontally                                    
                                    text_font: font_26  # Adjust text font size
                                    text: "BOOK_ROOM"  # Boiler icon
                                    text_align: RIGHT
                                    x: 50
                                    y: -10
# -------------------------------------------------------#   temperature_c_climate_arc_33


# 2024_0930_1704_11   temperature_c_climate33 보일러원형 조정 =================================              
# sensor:
  - platform: homeassistant
    id: temperature_c_climate33  # 설정 온도  # 77777777777777777777777777777777777
    entity_id: climate.485_ttl_ip109_bookroom_boier # 77777777777777777777777777777777777
    attribute: temperature
    on_value:
      then:
        - lvgl.spinbox.update:
            id: climate_set_temp_arc33   # 77777777777777777777777777777777777 spinbox_id43 climate_set_temp_arc
            value: !lambda return x;

        - lvgl.label.update:
            id: climate_set_temp_arc33_text  # 보일러 설정 온도 라벨  # 77777777777777777777777777777777777
            text: !lambda |-
              static char buf[10];
              snprintf(buf, sizeof(buf), "%.1f°C", x);
              return std::string(buf);
# sensor:  aircon_set_temp_arc aircon_mode_text  aircon_set_temp_text  climate.eeokeon aircon_now_temp_text
  - platform: homeassistant
    id: current_temperature_c_climate33  # 집안 현재 온도  # 77777777777777777777777777777777777
    entity_id: climate.485_ttl_ip109_bookroom_boier    # 77777777777777777777777777777777777
    attribute: current_temperature  # 현재 온도 속성
    on_value:
      then:
        - lvgl.label.update:
            id: label_current_climate_temperature33  # 집안 현재 온도를 표시하는 라벨 ID  # 77777777777777777777777777777777777
            text: !lambda |-
              static char buf[10];
              snprintf(buf, sizeof(buf), "%.1f°C", x);
              return std::string(buf);
# sensor:


☞ https://11q.kr 에 등록된 자료 입니다. ♠ 정보찾아 공유 드리며 출처는 링크 참조 바랍니다♠1.png

뷰PDF add1,add2



관련자료

댓글 0
등록된 댓글이 없습니다.



♥간단_메모글♥


최근글


새댓글



PHP 안에 HTML ☞ 홈페이지 화면갱신 시간은 ♨
▶ 2024-11-23 19:52:25

오늘의 홈 현황


  • 현재 접속자♨ 295 명
  • 오늘 가입자※ 1 명
  • 어제 가입자※ 3 명
  • 주간 가입자※ 9 명
  • 오늘 방문자 2,783 명
  • 어제 방문자 3,461 명
  • 최대 방문자 13,042 명
  • 전체 방문자 4,805,400 명
  • 전체 게시물※ 8,856 개
  • 전체 댓글수※ 25,233 개
  • 전체 회원수 11,326 명

QR코드


☞ QR코드 스캔은 kakao앱 자체 QR코드

알림 0








최신글↑