[Abandoned] Weather Widget Custom Tile Collection

Thanks for the response Michael, I am new to this so forgive my knowledge issue, I went to GitHub and tried to upload an image but it is saying they have to be less than 1mb, after unzipping to I need to do anything to the files they are named 200, 300 500 and so on, thanks.

You do not want to change the file names (200, 300, etc) - Choose a hosting service and upload the files as is. IF they get renamed… you will have to change the function variables (i.e thunderstorm = “new name”, rain = “new_name”, and so on).


You should be able to upload the images to GitHub - (100 MB Limit)
After signing up for an account and creating a repository… you should see a set of buttons inside the repository that looks like this:

upload

Click ‘Add file’ > ‘Upload files’ which will then take you here:

Click ‘choose your files’ (which will open up the file window) and select the folder which contains the images. Then, drag the entire folder and drop it in the boxed area. After it finishes adding all the files > Scroll to the bottom and click the ‘Commit changes’ button. You should now have a folder (presumably named “images”) containing the images in your repository.

Thanks again MIchael, I did as you mentioned, now question is how do I get the url to put into the weather tile, thanks.

Background image: URL Path

url_path
Dashboard Tile Settings


GitHub:

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

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

Imgur:

https://i.imgur.com/

:exclamation:Be sure to include the trailing /

1 Like

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