Wear OS - Add custom text to tile icon

[Racle]

Is your feature request related to a problem? Please describe.
Using tile to change multiple light groups (living room, kitchen, bedroom etc.) you cannot separate icons anyhow.

Describe the solution you'd like
One solution is to make icon little smaller and add small custom Text under icon.
OR add one letter to top of light bulb so I could manually change that to something useful.
OR add big letter behind light bulb and make that icon transparent so I can see the letter.

I would be happy to have this configure in home-assistant server config, home assistant android app file OR even somehow in wear os app.

Describe alternatives you've considered, if any
Ability to rearrange icons might even work for me (so I could make those show almost as in my floor plan).
But rearrange icons + some extra custom info would be best combo.

Additional context
What multiple light groups shows now:

[dshokouhi]

Why don't you just assign a custom icon to the lights instead of them all using the default? This way you can distinguish them easily.

[Racle]

Why don't you just assign a custom icon to the lights instead of them all using the default? This way you can distinguish them easily.

That would also change icons at home assistant instance, wouldn't it?

And I could use custom png , but I'm not sure if wear os tile handles that. (+ I'm not a designer, so result could be bad..)

I still like to have light bulb as icon as it's very clear and very easily readable to my wife and kids.

[dshokouhi]

That would also change icons at home assistant instance, wouldn't it?

Yes the goal is to let you quickly identify a light by looking at the icon only

And I could use custom png , but I'm not sure if wear os tile handles that. (+ I'm not a designer, so result could be bad..)

use a material design icon like you do in the HA interface: https://materialdesignicons.com/

I still like to have light bulb as icon as it's very clear and very easily readable to my wife and kids.

There are MANY variants of the light bulb you can pick from to make them unique, that is the idea behind using the icon itself. Right now you are using the default icon.

[brewston]

@Racle You can override the icon in the lovelace dashboard (Presumably what your wife & kids see right ?)

[Racle]

Yes the goal is to let you quickly identify a light by looking at the icon only

And that doesn't work very well if you have multiple same type devices.

use a material design icon like you do in the HA interface: https://materialdesignicons.com/

That doesn't help. There isn't 6 different light bulb icons where I could easily see if that belongs to different rooms even if I change the icons.
And I don't really like the idea of using ex. Sofa/TV icon for livingroom lights.

Adding small text would help with that. Even reorganizing to different place would help. Now they are (in my option) in random order.

Id there were some way to organize icons how I like I could arrange those according to my Floorplan and I could easily use lights without text or new icon.

Or can I somehow change the order? Like adding items in certain order to that tile?

That could help me in situation as I have light groups pretty much identically in that screenshot compared to my floorplan :P (two left, two right and middle for hallway and front door)

[dshokouhi]

Now they are (in my option) in random order.

You set the order in the app settings actually, go to Settings > Tile Shortcuts and re-arrange in the order you like.

[Racle]

You set the order in the app settings actually, go to Settings > Tile Shortcuts and re-arrange in the order you like.

I actually missed that. In initial setup you just add those in one go, so I never thought that you can actually select where icon goes.

EDIT: and this works, I rearranged my light group to match floorplan. Works for me, might now be ideal for everyone.

[Kisty]

It would be cool if when you long-pressed on an icon it could tell you what it was.

[Racle]

It would be cool if when you long-pressed on an icon it could tell you what it was.

Too bad it's not possible for tiles.
Long pressing tile brings tile edit view (where you can add, remove and rearrange tiles).

[bachoo786]

Hello there
How can I download HA Wear os on my Galaxy Watch 4 ?

[dshokouhi]

Hello there
How can I download HA Wear os on my Galaxy Watch 4 ?

You need to be on the beta for the phone app. Check the read me for the beta link

[leroyboerefijn]

I'm having a hard time thinking of a good way to add text that is useful, readable, configurable and appealing. We could add the friendly name, but then the letters will be tiny. There is something called ArcText though, but I'm not sure if it can we used like this. The way I understood it, is that it's meant for text along the border of the watch screen.

For options with 1 or 2 letters, I'd imagine that the group of people that like this is relatively small. And would it be the first letter of the friendly name? Or should it be configurable in the app?

@Racle what is your opinion? Is setting an icon and reordering them sufficient? Or would you really prefer to have a text option?

[Racle]

@leroyboerefijn after using reordered icons a while, I had to think few times before I clicked correct one. But it's usable. But I would still prefer text or some other indicator. It's very hard thing to do so it's appealing to other people. And considering that I have largest Watch4 and people with smaller watch would have really small text.

But if it's going to be text, that should be user configurable. Defaults as hidden, when enabled shows first letter of friendly name and it should be configurable after that.
Or maybe add option to use small mdi icon instead of text.

One other solution I could think is user configurable custom wallpaper behind icons. (and more transparent circles behind icons). Then I could just put my (cropped) image of floorplan there and call it a day.
But I'm not sure how many actually would use that. If it's going to be just me, it's not worth it.

[dshokouhi]

@Racle if you are looking to use a single letter, then why not just use a MDI icon for a specific letter. If you search "letter" on the link I gave up above you'll find a few icons to fit your need for a single character.

I think this would solve your issue right?

[Racle]

@dshokouhi it's just a personal preference that I would still like to see light bulb when I'm controlling light bulb.

And issue would be still same for another users, not just for me.

I still rather have recorded light bulbs what I've done now than just a letter.

[Racle]

And just to add, is it possible to add status effect to icon?
Now I have 6 bulbs and no way to know if they are on or off.
New issue created: #2045

(and after few more weeks, I still need to pause and think what bulb to press, I probably need to change icons and make adjustment to every lovelace page I have which includes those bulbs just to get wear os app working little better)

[dshokouhi]

And just to add, is it possible to add status effect to icon?

please create a new feature request for this, we shouldn't combine multiple requests into one

[Racle]

Sharing this quick workaround if you don't want to change your lights icon on home-assistant views. Still not perfect solution IMO, but I don't have to pause and think what to press anymore 🤷

In your configuration.yaml:

1. Create new light group

light:
- platform: group
 name: LightName (WearOS)
 entities:
  - light.light_entity

2. Add custom icon in customize:

homeassistant:
  customize:
    - light.lightname_wearos:
      icon: 'mdi:alpha-l-circle-outline'

3. Restart home-assistant
4. Use new light group(s) in wearos tiles

[leroyboerefijn]

I had a look. It turns out that it is possible to add a curved text around the icon. I will make a PR for it once the template tile PR is merged. One problem I cannot find a solution for is that I'd like to have the text under the icon, but that will render the text upside down.

Anyone familiar with the Tile API to help me out? @dshokouhi would you have any insights?

LayoutElementBuilders.Arc.Builder()
                .setAnchorAngle(
                    DimensionBuilders.DegreesProp.Builder()
                        .setValue(180f)
                        .build()
                )
                .addContent(
                    LayoutElementBuilders.ArcText.Builder()
                        .setText(entity.friendlyName)
                        .setFontStyle(
                            LayoutElementBuilders.FontStyle.Builder()
                                .setSize(sp(8f))
                                .build()
                        )
                        .build()
                )
                .build()