[Abandoned] Weather Widget Custom Tile Collection

Michael thank you so much was able to finally get it to work i guess I forgot to publish it thanks again for the assistance.

The Weather Widget Collection has been updated to fully support, 34 languages. The complete list with language codes can be found above under Setup.


To update your current widget(s)

  1. Open the Developer Tools
  2. Select the desired Custom Tile from the list
  3. In the code editor, tap the gear icon and select ‘Update from Source’
    image

:warning: Be sure to scroll down and click ‘Update’

4 Likes

It occurred to me that… In order to get (be aware of) a possible update, you would need to visit the community on a regular basis. I’ve updated the Weather Collection widgets, to include an option to be notified (via the dashboard tile) if an update is available.

update_notice

Go into the Developer Tools to update (recommended) your current version (see how above).

Note: The notification option is turned off by default. Go into the tile settings to change it (on/off).

3 Likes

A New Weather Widget (Post-it Note) has been added to the collection. See details above.

2 Likes

Is it possible to CSS increase The size of The text and icons in The horizontal bar? What function should i target?

Christian,
A couple notes on this:
The Horizontal Widget is thought to fill the width of a dashboard (max 10x)


1)You could increase the font size slightly to 1.25vw (currently 1vw) but anything larger… the text will begin to overlap.

2)The max tile dimension (width) is currently 10 - If the dashboard (width/columns) is larger than the tiles width… the font will scale relative to the dashboard, and at some point, become too small to read.

3)You could create some custom tiles that ‘split up’ the week,

Example: Create 1 custom tile for days 1-3 and a second for 4-6. The font size could then be increased appx 3X.

but if your dashboard is greater than 30 columns… you may want to consider a different solution/design approach.

There is a SmartThings driver that would give you a little more flexibility when working with a large dashboard size/columns. You would need a SmartThings account to install the handler and the app to enter the location (ie. zip code or latitude & longitude) and authorize access/add it to SharpTools.

NOTE: Enter latitude & longitude, separated by a comma (i.e. 123.456,789.123), in the zip code setting.

First off, great reply. I hadnt considered this. If this works off The weather station ide mine hasnt worked for a while, dont know why but The old or The new doesnt update The temp. Going to remove and re add this then try these Tiles.thanks again

A New version (V2) of the Weather Widget and Horizontal Weather Widget is available to download. This update includes several additional options/features and is fully customizable.

The import button(s) can be found above.

To update an earlier version

  1. Open the Developer Tools

  2. Select the desired Custom Tile from the list

  3. In the code editor, tap the ‘gear’ icon and select ‘Update from Source’

Be sure to scroll down and click ‘Update’
:exclamation:IMPORTANT NOTE: You will need to edit the tile and update the Unit Measure ( Celsius/Fahrenheit). Your API, Geo Location and Language will be saved.


Features:

  • Icons: Choose from 3 designs (Default/Outline, Solid, Color), with an option to animate the ‘color’ icons.
    icon_type

  • You can customize the Icon Color, Text Color, and If ‘Color’ icons are selected … ALL elements are customizable (i.e. Sun/Thunder, Raindrops, Snow, Broken Cloud).


New Options (Horizontal Widget) include:

  • Weather: Current condition, Forecast (Daily/Hourly), or Both.
    NOTE: Tap the tile to toggle between daily and hourly forecast.

  • Forecast (Days/Hours): Select from 3,5,7

  • Display Style: View weather horizontally in a Row (across) or vertically as Columns in a row.

  • Themes: Select from pre-defined styles or create your own.

  • If you select the ‘Transparent’ or ‘Custom’ theme… You can customize the Background Color, Icon Color and Text Color. If ‘Color’ icons are selected … ALL elements are customizable (i.e. Sun/Thunder, Raindrops, Snow, Broken Cloud).
    NOTE: When ‘Transparent’ is selected… the background color of the Tile will show through.

  • Text Size: Enter a number. NOTE: Decimals are accepted (e.g. 1.5).

  • Time Format: 12HR or 24HR clock.


New Options (Weather Widget) include:


Example: Forecast with Current Conditions (left) or Forecast Only (right)

img4
Example: Weather Tile (Thing) with Custom Tile (Forecast Only)

  • Weather: Forecast (Daily/Hourly) with Current Conditions or Forecast Only.
    NOTE: Tap the tile to toggle between daily and hourly forecast.

  • Time Format: 12HR or 24HR clock.

2 Likes

A New Weather Widget (Analog Clock) has been added to the collection. See details above.

3 Likes

That first screenshot is a really striking visual combination! Nice work!

1 Like

I am a very new user here and can’t tell you how much I appreciate these custom tiles. I had a questions @MIchael regarding the Live Weather Widget. Have the descriptions provided from the OpenWeather API changed? I see in the code that “partly cloudy” is described, however with the API, I am starting to see different descriptions displayed (ie. “Overcast Clouds” or “Light Snow”). More of a curiousity than anything on my part.

1 Like

Welcome to the community @Marz

The code descriptions (e.g. partly cloudy…) are internal references only. The tile will display conditions sent/pulled from OpenWeather

2 Likes

@Michael - that makes complete sense. I played around quite a bit with it and a number of image hosting sites, turns out that my url from github was incorrect. So it appears that it was, as usual, user errror. Thanks for the very quick response.

2 Likes

@Michael - I finally got around to the Analog Clock Widget. I am so happy with it! I’ve replaced the boring old digital clock with the attractive new analog clock.

I customized it by diddling with font size and hand width. Style States would be nice to have; different face colors for day and night, for example.

4 Likes

@Stan_Silverman, Glad you’re enjoying it - Thanks for the feedback!

  • There is a ‘Face Style’ option (Weather Ambience), where the color changes based on the current conditions and time of day. - OR - Are you looking for just a 2 color setting (day/night)?

  • I’ve updated the tile to include an option to adjust the time’s font size.

3 Likes

Thanks for the update! Time text size option is great! Saves a whole bunch of time.

Now trying to decide if I really want to increase the height of the hands or not. (Probably will…)

////////////////////////////////////

The face color story is a little longer. I started a “project” a while back using the old digital clock. My objective was to have four color states:

dawn/dusk, sunrise/sunset, day, night.

Couldn’t be done of course. A discussion with James led me to looking at the Analog Clock Widget.

The Style would have to allow changing the content (text, hands, icons) as well as the background color.

This project is completely non-essential. Some of the things we do with dashboards are in the category of “just because it can be done”.

But day/night would be nice!

1 Like

@Stan_Silverman, Thanks for the insight - Maybe I can add something along those lines in a future update.

1 Like

This is really cool, I just started using it but no matter what I do, I can’t get the background images to load. I tried github, google drive, and my own website/domain. I made sure the image names weren’t changed and I included the trailing /.

When a background image isn’t selected in settings, I understand the tile color should change, mine has been solid black with weather data superimposed over it.

I even went back and loaded the original code and updated my widget. I feel like an idiot, lol but obviously I’m missing something. Each URL that i put in for background images checks out if I copy and paste it in my browser, and like I said the names haven’t changed.

Any ideas???

Update - I toggled the use background image option and the background color is now there. Still not seeing the images yet thought.

@Nicholas_Joseph, So I’m clear… You’re receiving the weather data, just not the image!

Is the url (in the tile setting) using a secure connection (i.e. https) - If not… It could be a ‘mixed content’ issue that prevents it from loading.

For GitHub: Be sure you are using the following address:

https://raw.githubusercontent.com/account/repository/branch/folder/

Replace account, repository, branch (usually main/master), and folder (if created) with your details.