# \[APP\]\[Pro\] Enhanced Device Widgets. Live 1.1.29, Test 1.1.30

**URL:** <https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835>\
**Category:** Apps\
**Created:** [October 10, 2024, 5:25pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835 "2024-10-10T17:25:43Z")\
**Posts on this page:** 20\
**Page:** 17

<div class="post-metadata">

**Author:** ![Adrian\_Rockall](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/adrian_rockall/32/13209_2.png) [@Adrian\_Rockall](https://community.homey.app/u/Adrian_Rockall)\
**Post date:** [February 7, 2025, 1:17pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/324 "2025-02-07T13:17:27Z")

</div>

Have you tried putting ‘Mop’ and ‘Vacuum’, eg in quotes?

I haven’t tried it but it’s what I would try.

---

<div class="post-metadata">

**Author:** ![Yann\_Liqueur](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/yann_liqueur/32/114031_2.png) [@Yann\_Liqueur](https://community.homey.app/u/Yann_Liqueur)\
**Post date:** [February 7, 2025, 5:39pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/325 "2025-02-07T17:39:24Z")

</div>

Yes I tried that with = and ==  
I tried simple and double quotes too

---

<div class="post-metadata">

**Author:** ![Adrian\_Rockall](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/adrian_rockall/32/13209_2.png) [@Adrian\_Rockall](https://community.homey.app/u/Adrian_Rockall)\
**Post date:** [February 8, 2025, 9:12am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/326 "2025-02-08T09:12:46Z")

</div>

OK, I worked it out. The Flow card returns the string value unquoted, so in your case it would create a formula for the parser as “Mop == ‘Mop’…”. The parser would then assume that Mop is a variable that hasn’t been defined.  
To fix it just put quotes around the variable name like this example:  
 ![image](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/f/4/f4c06c0eee15427b1e439f8260834b1d5a255b8d.png)

---

<div class="post-metadata">

**Author:** ![Tormod\_F](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/tormod_f/32/49057_2.png) [@Tormod\_F](https://community.homey.app/u/Tormod_F)\
**Post date:** [February 10, 2025, 8:16am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/327 "2025-02-10T08:16:37Z")

</div>

The Enhanced Device Widget is replacing all line shifts with   
 in the HTML code which makes the blank space above the table. This was implemented in a resent version. I have experienced that it is not very practically to edit the HTML code in the When card dialog. When you typically need variables in the code it becomes VERY unpractical.  
I have also made a graph that shows current prices through the day and night. For this I am using Homeyscript that feches the prices from the “Power by the hour” app and that makes the HTML code that is passed til the Enhanced Device Widget’s when card. This works fine.  
Though I haven’t found a script that makes a table and feches the input from devices. But I do beleave this is the way to do it.

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [March 28, 2025, 6:49pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/328 "2025-03-28T18:49:49Z")

</div>

> [@Peter\_Kawa](#):
>
> About `<table style="width:250%">`:  
> When not declaring width, both columns appear on the left half of the widget.

> [@Showcase your Dashboard](https://community.homey.app/t/showcase-your-dashboard/116965/283):
>
> I’m not sure about the width as the content is just set into a div tag as html. The div tag has some boundaries plus Homey also has boundaries it applies to the content.

@Peter_Kawa / @Adrian_Rockall: earlier both Peter and I noted that, when using an HTML table in the status widget of the Enhanced Device Widget app, you need to set the table width to values well above 100% to scale correctly.

I also noted myself that for the same widget with the same HTML table (for which the column/cell widths have also been set), but with other data in the table cells, the table width value that results in a proper scaling is also different.

I found out that if you use the `table-layout: fixed;` style tag, the table is rendered correctly/respecting the cell and table widths you specified. You can use this tag as part of the table tag `<table style="table-layout: fixed;"></table>` or apply it as a default to all tables in the style tag section in the header, e.g. `<style>table {table-layout: fixed;}<style>`

The four status widgets in the following example all align in the same manner, when using the indicated style tag. Without that tag, the cell widths in each status widget would be different. In my case I need to set the table with to 97% to get even widget frame/border spacing on both sides. If set to 100%, the border of the widget on the left hand side is larger than the right hand side.

 ![IMG_1736.PNG](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/2/3/2309df1f4a856e2e82492a912c23e744fc680cf7.jpeg)

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [April 2, 2025, 7:43pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/329 "2025-04-02T19:43:30Z")

</div>

> [@Cuprani](#):
>
> I implemented an image (png transparant image of 100x100 pixels) that I have loaded with the Homey Gallery App to the Homey Pro.
> 
> In [developer tools](https://tools.developer.homey.app/) you can overview all your images, and find the correct reference link to use in your HTML code for reference.

Do you also run into the issue that after a Homey firmware update, the image ID changes? And hence you have to update all your image references in the HTML code? I had that issue today after updating to version 12.4.1. Not sure if there is an other way to refer to images.

---

<div class="post-metadata">

**Author:** ![Cuprani](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/cuprani/32/3575_2.png) [@Cuprani](https://community.homey.app/u/Cuprani)\
**Post date:** [April 8, 2025, 7:15am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/330 "2025-04-08T07:15:11Z")

</div>

Yes I had, thats why I switched to refer my images from an online server instead from the Homey itself. I’d rather keep them local, I also asled the Homey team if this can be fixed.

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 8:16am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/331 "2025-04-08T08:16:36Z")

</div>

I am not able to get the text centered in the status widget. I have tried different HTML codes with no success. Any ideas?

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [April 8, 2025, 9:45am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/332 "2025-04-08T09:45:28Z")

</div>

Assuming you have defined a table that has only one column, you can center the text in a row by using the following HTML code:

`<tr><td style="text-align: center;">YOUR TEXT</td></tr>`

Further you must set and fix the width of the table, using these style tags in your `<table>` tag:

```auto
table-layout: fixed;
width: 97%;

```

In my case the available canvas in the status widget is 97%, so I set the table with accordingly.

If you want the max out of the available space, you can set the cell border spacing to 0 pixels via this style tag: `border-spacing: 0px`

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 10:54am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/333 "2025-04-08T10:54:32Z")

</div>

Forgot to mention I am not using table layout.  
Do I need to to being able to center?  
Can I use `<td style="text-align: center;">YOUR TEXT</td>` only?

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [April 8, 2025, 11:16am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/334 "2025-04-08T11:16:57Z")

</div>

No, because the `<td></td>` tags mark the start and end of a table cell, so such a declaration requires a table.

If you don’t have a table this might work, but I am not sure:

`<div style="text-align: center;">YOUR TEXT</div>`

The `<div></div>` tags mark the start and end of a section.

By the way, this resource has a lot of information on HTML coding: [HTML Tutorial](https://www.w3schools.com/html/default.asp)

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 11:57am UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/335 "2025-04-08T11:57:02Z")

</div>

did unfortunately not work. I will check the page you mentioned, thanks.

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [April 8, 2025, 12:31pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/336 "2025-04-08T12:31:51Z")

</div>

You can, of course, consider creating a simple table with just one cell that contains your text:

```auto
<table style=“table-layout: fixed; width: 97%;”>
<tr><td style="text-align: center;">YOUR TEXT</td></tr></table>

```

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 1:37pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/337 "2025-04-08T13:37:53Z")

</div>

That’s true 🙂

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 1:46pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/338 "2025-04-08T13:46:00Z")

</div>

That did not align the text centered either 🙂  
Strange

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [April 8, 2025, 2:42pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/339 "2025-04-08T14:42:03Z")

</div>

Can you share your flow / the flow cards that set the HTML code?

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 5:50pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/340 "2025-04-08T17:50:52Z")

</div>

![Homey-status-card](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/e/4/e4cff3dcc9b3b8f68eac50851af6e1ea1629b23e.png)

---

<div class="post-metadata">

**Author:** ![SunBeech](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/sunbeech/32/111391_2.png) [@SunBeech](https://community.homey.app/u/SunBeech)\
**Post date:** [April 8, 2025, 7:40pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/341 "2025-04-08T19:40:36Z")

</div>

That’s strange. I did some tests.

The following options - without using a table, but with a paragraph element - should also work, but somehow do not:

- `<p style="text-align:center;">Your Text</p>`
- `<p style="margin-left:auto; margin-right:auto;">Your Text</p>`

The suggested table option should also work. However somehow it does not when you only have one tabel column, so not part of a more elaborate table with multiple columns and rows. I am using the `text-align:center` style in multiple tables where it works just fine:

 ![IMG_1793.PNG](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/c/5/c527ed2f58fc3f6aa712d8bae19b76a3adba207f.jpeg)

I also checked whether perhaps the widget allows the deprecated `<center></center>` tags, but those also don’t work.

I have no clue why the centering does not work in EDW’s status widget 😊.  
Maybe @Adrian_Rockall can explain this behaviour?

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 8, 2025, 7:50pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/342 "2025-04-08T19:50:35Z")

</div>

Exactly my findings too. I also tested with `<p>`, etc.

---

<div class="post-metadata">

**Author:** ![Anders\_Gregow](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/anders_gregow/32/61721_2.png) [@Anders\_Gregow](https://community.homey.app/u/Anders_Gregow)\
**Post date:** [April 20, 2025, 5:16pm UTC](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835/343 "2025-04-20T17:16:09Z")

</div>

I have a Android phone set up with Enhanced Device Widgets only, 7 different label wigdets. And eventually the Homey app has crashed or at least closed.  
I read that using the Canvas API might cause the dashboard to crash. Is Enhanced Device Widgets using Canvas API?

[Previous page](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835.md?page=16)

[Next page](https://community.homey.app/t/app-pro-enhanced-device-widgets-live-1-1-29-test-1-1-30/117835.md?page=18)