SmartHome
SERIES
🌐 VI • EN[OpenHAB] Share a Remote-Control Widget for LG WebOS TV
TABLE OF CONTENTS (Nhấn để xem)
Requirements
- OpenHAB version: 4.3.3
- The LG WebOS binding is installed.
I redesigned this widget based on widgets shared on the OpenHAB community site. If you copy it, please keep the attribution. ^^.
Usage
- Open MENU > Developer Tools > Widgets, add a new widget, paste the code, and enjoy.
uid: LGWebOSremote
tags: []
props:
parameters:
- context: item
description: Select the RCButton item
label: Simulate a Remote Control button press
name: item
required: true
type: TEXT
- context: item
description: Select the Power switch item
label: Power ON/OFF TV
name: power
required: true
type: TEXT
- context: item
description: Select the Mute switch item
label: Mute audio of the device
name: mute
required: true
type: TEXT
parameterGroups: []
timestamp: Mar 11, 2025, 8:00:38 PM
component: f7-card
config:
style:
--f7-card-margin-horizontal: 0px
background-color: rgb(26, 26, 26)
border-radius: 50px
height: 48rem
width: 23rem
slots:
default:
- component: Label
config:
style:
color: white
font-size: 18px
left: 20px
top: 22px
line-height: 32px
overflow: hidden
position: absolute
text-overflow: ellipsis
text-shadow: -1px 1px 1px hsl(0,0%,66%)
white-space: nowrap
text: ="LG WebOS TV"
- component: oh-button
config:
action: command
actionCommand: "=(items[props.power].state === 'OFF') ? 'ON' : 'OFF' "
actionItem: =props.power
iconF7: power
iconSize: 30
color: white
style:
background-color: rgb(53,53,53)
color: "=(items[props.power].state === 'OFF') ? 'green' : 'red' "
display: flex
border-radius: 50%
height: 60px
left: 154px
position: absolute
top: 10px
width: 60px
- component: oh-button
config:
action: command
actionCommand: HOME
actionItem: =props.item
iconF7: house
iconSize: 30
style:
background-color: rgb(53,53,53)
border-radius: 50px 0 0 50px
color: white
display: flex
font-size: 25px
height: 60px
left: 45px
position: absolute
top: 80px
width: 136px
- component: oh-button
config:
action: command
actionCommand: EXIT
actionItem: =props.item
text: THOÁT
style:
background-color: rgb(53,53,53)
border-radius: 0 50px 50px 0
color: white
display: flex
font-size: 25px
height: 60px
left: 187px
position: absolute
top: 80px
width: 136px
- component: oh-button
config:
action: command
actionCommand: VOLUMEUP
actionItem: =props.item
iconF7: plus
iconSize: 35
style:
background-color: rgb(53,53,53)
border-radius: 50px 50px 0 0
color: white
display: flex
font-size: 25px
height: 95px
left: 11px
position: absolute
top: 153px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: VOLUMEDOWN
actionItem: =props.item
iconF7: minus
iconSize: 35
style:
background-color: rgb(53,53,53)
border-radius: 0 0 50px 50px
color: white
display: flex
font-size: 25px
height: 95px
left: 11px
position: absolute
top: 253px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: UP
actionItem: =props.item
iconF7: chevron_up
iconSize: 35
style:
border-radius: 50%
color: white
display: flex
font-size: 25px
height: 60px
left: 154px
position: absolute
top: 150px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: RIGHT
actionItem: =props.item
iconF7: chevron_right
iconSize: 35
style:
border-radius: 50%
color: white
display: flex
font-size: 25px
height: 60px
right: 84px
position: absolute
top: 220px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: DOWN
actionItem: =props.item
iconF7: chevron_down
iconSize: 35
style:
border-radius: 50%
color: white
display: flex
font-size: 25px
height: 60px
left: 154px
position: absolute
top: 290px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: LEFT
actionItem: =props.item
iconF7: chevron_left
iconSize: 35
style:
border-radius: 50%
color: white
display: flex
font-size: 25px
height: 60px
left: 84px
position: absolute
top: 220px
width: 60px
z-index: 2
- component: f7-badge
config:
style:
border: white solid 1px
background-color: rgb(53,53,53)
border-radius: 50%
height: 65px
left: 150px
position: absolute
top: 220px
width: 65px
z-index: 2
- component: f7-badge
config:
style:
border-radius: 50%
background-color: rgb(53,53,53)
height: 200px
left: 84px
position: absolute
top: 150px
width: 200px
z-index: 1
- component: oh-button
config:
action: command
actionCommand: ENTER
actionItem: =props.item
style:
border-radius: 50px
color: white
display: flex
font-size: 25px
height: 65px
left: 149px
position: absolute
top: 220px
width: 65px
z-index: 2
text: OK
- component: oh-button
config:
action: command
actionCommand: CHANNELUP
actionItem: =props.item
iconF7: arrow_up
iconSize: 35
style:
background-color: rgb(53,53,53)
border-radius: 50px 50px 0 0
color: white
display: flex
font-size: 25px
height: 95px
left: 297px
position: absolute
top: 153px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: CHANNELDOWN
actionItem: =props.item
iconF7: arrow_down
iconSize: 35
style:
background-color: rgb(53,53,53)
border-radius: 0 0 50px 50px
color: white
display: flex
font-size: 25px
height: 95px
left: 297px
position: absolute
top: 253px
width: 60px
z-index: 2
- component: oh-button
config:
action: command
actionCommand: BACK
actionItem: =props.item
iconF7: arrow_uturn_left
iconSize: 25
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 11px
height: 55px
left: 11px
position: absolute
top: 357px
width: 90px
text: BACK
- component: oh-button
config:
action: command
actionCommand: MENU
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
height: 55px
left: 140px
position: absolute
top: 357px
width: 90px
text: MENU
- component: oh-button
config:
action: command
actionCommand: INFO
actionItem: =props.item
text: INFO
style:
background-color: rgb(53,53,53)
color: white
display: flex
height: 55px
left: 267px
position: absolute
top: 357px
width: 90px
- component: oh-button
config:
action: command
actionCommand: MUTE
actionItem: =props.item
color: "=(items[props.mute].state === 'OFF') ? 'white' : 'red'"
iconF7: speaker_slash_rtl
iconSize: 30
style:
background-color: rgb(53,53,53)
border-radius: 50px 0 0 50px
display: flex
font-size: 25px
height: 60px
left: 44px
position: absolute
top: 428px
width: 90px
- component: oh-button
config:
action: command
actionCommand: PAUSE
actionItem: =props.item
iconF7: pause_fill
iconSize: 30
style:
background-color: rgb(53,53,53)
color: white
display: flex
height: 60px
left: 140px
position: absolute
top: 428px
width: 90px
- component: oh-button
config:
action: command
actionCommand: PLAY
actionItem: =props.item
iconF7: play_fill
iconSize: 30
style:
background-color: rgb(53,53,53)
border-radius: 0 50px 50px 0
color: white
display: flex
height: 60px
left: 236px
position: absolute
top: 428px
width: 90px
- component: oh-button
config:
action: command
actionCommand: 1
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 44px
position: absolute
top: 494px
width: 90px
text: 1
- component: oh-button
config:
action: command
actionCommand: 2
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 140px
position: absolute
top: 494px
width: 90px
text: 2
- component: oh-button
config:
action: command
actionCommand: 3
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 236px
position: absolute
top: 494px
width: 90px
text: 3
- component: oh-button
config:
action: command
actionCommand: 4
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 44px
position: absolute
top: 560px
width: 90px
text: 4
- component: oh-button
config:
action: command
actionCommand: 5
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 140px
position: absolute
top: 560px
width: 90px
text: 5
- component: oh-button
config:
action: command
actionCommand: 6
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 236px
position: absolute
top: 560px
width: 90px
text: 6
- component: oh-button
config:
action: command
actionCommand: 7
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 44px
position: absolute
top: 625px
width: 90px
text: 7
- component: oh-button
config:
action: command
actionCommand: 8
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 140px
position: absolute
top: 625px
width: 90px
text: 8
- component: oh-button
config:
action: command
actionCommand: 9
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 236px
position: absolute
top: 625px
width: 90px
text: 9
- component: oh-button
config:
action: command
actionCommand: 0
actionItem: =props.item
style:
background-color: rgb(53,53,53)
border-radius: 10px
color: white
display: flex
font-size: 25px
height: 60px
left: 140px
position: absolute
top: 690px
width: 90px
text: "0"
TAGS:
#openhab
Series
•
4 TậpSmartHome
- [OpenHAB] Share a Vietnamese Lunar Calendar Script for OpenHAB
- [OpenHAB] Xiaomi LYWSD03MMC Temperature and Humidity Sensor with ESPHome on ESP32-C3
- [OpenHAB] Energy Meter with PZEM004T and ESPHome on ESP32-C3
- [OpenHAB] Share a Remote-Control Widget for LG WebOS TV Reading
Discussion & Feedback 0
Share your questions, feedback or insights with the community