Weather Widget

freaksworth

Hallo,
habe mal, inspiriert von diesem Thread: http://forum.xbmc.org/showthread.php?t=87384 ein Wetter Widget gebastelt.
Ist vielleicht insg. etwas gross und wirkt etwas farblos, was allerdings auch am Wetter liegt.

Externer Inhalt www.xbmcnerds.com

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Externer Inhalt www.xbmcnerds.com

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

XML

<!--widget begin-->
		<control type="group">
			<posx>925</posx>
			<posy>420</posy>
			<visible>Weather.IsFetched + !Player.HasMedia</visible>
			<control type="group">
				<control type="image">
					<description>background top</description>
					<posx>0</posx>
					<posy>0</posy>
					<width>410</width>
					<height>64</height>
					<colordiffuse>CCFFFFFF</colordiffuse>
					<texture>DialogContextTop.png</texture>
				</control>
				<control type="image">
					<posx>0</posx>
					<posy>64</posy>
					<description>background</description>
					<width>410</width>
					<height>180</height>
					<colordiffuse>CCFFFFFF</colordiffuse>
					<texture>DialogContextMiddle.png</texture>
				</control>
				<control type="image">
					<description>background bottom</description>
					<posx>0</posx>
					<posy>244</posy>
					<width>410</width>
					<height>44</height>
					<colordiffuse>CCFFFFFF</colordiffuse>
					<texture>DialogContextBottom.png</texture>
				</control>
<!-- current -->			
				<control type="image">
					<description>current condition</description>
					<posx>40</posx>
					<posy>10</posy>
					<width>128</width>
					<height>128</height> -->
					<texture>$INFO[Window(weather).Property(Current.ConditionIcon)]</texture>
				</control>
				<control type="label">
					<description>current temperature</description>
					<posx>180</posx>
					<posy>25</posy>
					<width>150</width>
					<height>60</height>
					<textcolor>white</textcolor>
					<shadowcolor>black</shadowcolor>
					<font>font50caps_title</font>
					<label>$INFO[Window(weather).Property(Current.Temperature)]$INFO[System.TemperatureUnits]</label>
				</control>
				<control type="label">
					<description>location</description>
					<posx>165</posx>
					<posy>90</posy>
					<width>185</width>
					<textcolor>white</textcolor>
					<font>font12</font>
					<label>$INFO[Window(weather).Property(Location)]</label>
				</control>
				<control type="label">
					<description>updated</description>
					<posx>165</posx>
					<posy>110</posy>
					<textcolor>grey</textcolor>
					<font>font10</font>
					<label>(Stand: $INFO[Window(weather).Property(Updated)])</label>
				</control>
<!-- forecast -->				
				<control type="group">
					<description>forecast</description>
					<posx>80</posx>
					<posy>140</posy>
<!-- day1 -->				
					<control type="label">
						<description>day1 title</description>
						<posx>10</posx>
						<posy>0</posy>
						<font>font12</font>
						<label>$INFO[Window(weather).Property(Day1.Title)]</label>
					</control>					
					<control type="image">
						<description>day1 current condition</description>
						<posx>10</posx>
						<posy>30</posy>
						<width>64</width>
						<height>64</height>
						<texture>$INFO[Window(weather).Property(Day1.OutlookIcon)]</texture>
					</control>	
					<control type="label">
						<description>day1 temp high</description>
						<posx>0</posx>
						<posy>85</posy>
						<font>font12</font>
						<label>$INFO[Window(weather).Property(Day1.HighTemp)]$INFO[System.TemperatureUnits]</label>
					</control>			
					<control type="label">
						<description>day1 temp low</description>
						<posx>40</posx>
						<posy>90</posy>
						<font>font10</font>
						<textcolor>grey</textcolor>
						<label>$INFO[Window(weather).Property(Day1.LowTemp)]$INFO[System.TemperatureUnits]</label>	
					</control>
<!-- day2 -->
					<control type="label">
						<description>day2 title</description>
						<posx>95</posx>
						<posy>0</posy>
						<font>font12</font>
						<label>$INFO[Window(weather).Property(Day2.Title)]</label>
					</control>					
					<control type="image">
						<description>day2 current condition</description>
						<posx>95</posx>
						<posy>30</posy>
						<width>64</width>
						<height>64</height>
						<texture>$INFO[Window(weather).Property(Day2.OutlookIcon)]</texture>
					</control>	
					<control type="label">
						<description>day2 temp high</description>
						<posx>85</posx>
						<posy>85</posy>
						<font>font12</font>
						<label>$INFO[Window(weather).Property(Day2.HighTemp)]$INFO[System.TemperatureUnits]</label>
					</control>	
					<control type="label">
						<description>day2 temp low</description>
						<posx>125</posx>
						<posy>90</posy>
						<font>font10</font>
						<textcolor>grey</textcolor>
						<label>$INFO[Window(weather).Property(Day2.LowTemp)]$INFO[System.TemperatureUnits]</label>
					</control>
<!-- day3 -->
					<control type="label">
						<description>Day3 title</description>
						<posx>180</posx>
						<posy>0</posy>
						<font>font12</font>
						<label>$INFO[Window(weather).Property(Day3.Title)]</label>
					</control>					
					<control type="image">
						<description>Day3 current condition</description>
						<posx>180</posx>
						<posy>30</posy>
						<width>64</width>
						<height>64</height>
						<texture>$INFO[Window(weather).Property(Day3.OutlookIcon)]</texture>
					</control>	
					<control type="label">
						<description>Day3 temp</description>
						<posx>170</posx>
						<posy>85</posy>
						<font>font12</font>
						<label>$INFO[Window(weather).Property(Day3.HighTemp)]$INFO[System.TemperatureUnits]</label>
					</control>		
					<control type="label">
						<description>Day3 temp low</description>
						<posx>210</posx>
						<posy>90</posy>
						<font>font10</font>
						<textcolor>grey</textcolor>
						<label>$INFO[Window(weather).Property(Day3.LowTemp)]$INFO[System.TemperatureUnits]</label>
					</control>						
				</control>	
			</control>
		</control>
<!-- widget end -->

Alles anzeigen

Verbesserungen und Feedback erwünscht!

don

Und schon wieder was dazugelernt:

Code

$INFO[System.TemperatureUnits]

und

Code

$INFO[Window(weather).Property(Updated)]

kannte ich noch nicht.

djtoll

Klasse, wieder eine sehr nette Überraschung heute, da gibt es nix zu verbessern ... ist vollkommen.

Animierte Images finde ich per. dann doch zu unruhig und man konzentriert sich gar nicht auf das Wetter ablesen .

Ihr/Du hab ja ein richtigen lauf was Ideen und UMSETZUNG angeht ... weiter so

PS: jetzt lernt Ihr noch scripten und baut mir ein kleines Script von Livescores.com ... dann ist mein xbmc Welt sowas von Geeeeiiilll

don

Ein guter Scripter, wie "seinerzeit" der Rocko .... sowas fehlt uns wirklich.

Zippolighter

Hallo, generell denke ich wäre es gut wenn bei einem howto für alle nicht skin experten auch beschrieben wird, in welcher Datei an welcher Stelle der xml-code eingefügt werden muss, um das Ergebnis auf den Bildern zu erreichen.

Wäre nett wenn Du das noch nachliefern könntest.

Ansonsten sieht das erstmal sehr gut aus.

keibertz

ja in welche XML Datei das muss habe ich mich auch schon gefragt.
Wäre wirklich sehr Sinnvoll das immer dazu zu schreiben. Erspart zumindest einige Zeit bei der Suche.

don

Ich habe es jetzt nicht getestet.
Aber ich würde behaupten, dass es irgendwo in die home.xml gehört.

freaksworth

Hallo,
also generell ist der code-Schnipsel überall direkt einsetzbar, z.B. einfach in die home.xml einfügen.
Wie man es ordentlich macht, erkläre ich kurz am Beispiel Confluence:
Man benötigt folgende Dateien aus dem 720p Ordner:
- custom_skinsettings_1111.xml
- includes.xml
- Home.xml
- strings.xml aus skin.confluence/language/German/

- die IncludesWeatherWidget.xml aus dem Anhang in den 720p-Ordner kopieren.

Einstellungmöglichkeit über die Settings: in der custom_skinsettings_1111.xml folgenden Eintrag suchen:

XML

<control type="radiobutton" id="204">
	<description>enable weather info</description>
	<width>750</width>
	<height>40</height>
	<font>font13</font>
	<textcolor>grey2</textcolor>
	<focusedcolor>white</focusedcolor>
        <label>20084</label>
	<onclick>Skin.ToggleSetting(homepageWeatherinfo)</onclick>
	<selected>!Skin.HasSetting(homepageWeatherinfo)</selected>
	<texturefocus>MenuItemFO.png</texturefocus>
	<texturenofocus>MenuItemNF.png</texturenofocus>
</control>

Alles anzeigen

und darunter einfügen:

XML

<control type="radiobutton" id="2040">
	<description>enable weather widget</description>
	<width>750</width>
	<height>40</height>
	<font>font13</font>
	<textcolor>grey2</textcolor>
	<focusedcolor>white</focusedcolor>
	<label>$LOCALIZE[52040]</label>
	<onclick>Skin.ToggleSetting(homepageWeatherWidget)</onclick>
	<selected>Skin.HasSetting(homepageWeatherWidget)</selected>
	<texturefocus>MenuItemFO.png</texturefocus>
	<texturenofocus>MenuItemNF.png</texturenofocus>
</control>

Alles anzeigen

in der strings.xml folgende Zeile hinzufügen:

XML

<string id="52040">Wetter-Widget anzeigen</string>

in der includes.xml hinzufügen:

XML

<include file="IncludesWeatherWidget.xml" />

Jetzt könnt Ihr das widget überall im skin mit der Zeile:

XML

<include condition="Skin.HasSetting(homepageWeatherWidget)"</include>

einbinden.

z.B. in der Home.xml:

XML

<window id="0">
	<defaultcontrol always="true">8999</defaultcontrol>
	<allowoverlay>no</allowoverlay>	
	<controls>
		<control type="multiimage">
			<posx>0</posx>
			<posy>0</posy>
			<width>1280</width>
			<height>720</height>
			<imagepath background="true">$INFO[Container(9000).ListItem.Icon]</imagepath>
			<timeperimage>8000</timeperimage>
			<randomize>true</randomize>
			<fadetime>1000</fadetime>
		</control>
		<include>CommonMediaPlayingBackground</include>		
		<include condition="Skin.HasSetting(homepageWeatherWidget) + Weather.IsFetched">WeatherWidget</include>
		<include condition="Skin.HasSetting(homepageHideRecentlyAdded)">HomeRecentlyAddedInfo</include>
...

Alles anzeigen

Zippolighter

Ja das nenne ich doch mal eine tolle Beschreibung.

Die habe ich sogar verstanden als nicht Skinner.

Toll auch, das Du es so beschrieben hast, das es aus und einschaltbar ist.

Schönen Dank und weiter so.

don

Und diese Anleitung kann man echt als Basis für zig Modifikationen nutzen.
Sehr gut.

keibertz

könntet ihr aus der Beschreibung vielleicht einen eigenen Beitrag machen. Denn wenn der immer anwendbar ist dann kann der doch super zur allgemeinen Erklärung zur Einbindung solche Codeschnipsel dienen.

Zippolighter

Mir sind noch drei Sachen aufgefallen an den Widget. Vielleicht kann man da noch was optimieren.

1. Bei der Vorhersage ragt der Schriftzug Donnerstag als dritter vorhersage Tag rechts aus dem Hintergrund heraus.

2. Das Widget wird schon angezeigt, auch wenn noch keine Wetterdaten geladen wurden. Hier wäre es schöner wenn es erst angezeigt wird, wenn die Daten vorhanden sind.

3. Das Widget ist von der Position genau an der Stelle wo auch Audio Informationen vom Webradio oder abspielen von Audio-Cds angezeigt werden, die dann über dem Widget liegen.

Dies sieht nicht wirklich gut aus. Weiss nicht ob und was es da für Möglichkeiten gibt (z.B. Widget ausblenden wenn Audio Informationen angezeigt werden, Position des Widgets verändern beim abspielen von Webradio oder Audio-CDs)

Externer Inhalt i852.photobucket.com

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Dies ist keine Kritik, finde das Widget immer noch klasse. Beziehe mich auf das Statement aus dem ersten Beitrag

Zitat

Verbesserungen und Feedback erwünscht!

Gruss Zippolighter

don

Ist alles machbar. (Ich nutze es jedoch nicht)

1. Man könnte das Widget breiter machen oder den Text scrollen lassen.
2. Dafür gibt es "Weather is fedched"
3. Entweder einfach höher setzen oder eine von beiden Anzeigen ausblenden, wenn die andere aktiv ist.

Breiter, Position höher und weiter nach links und als visible-tag "weather is fedchet".
So würde ich es lösen.

freaksworth

Hi,
1) Hab ich auch gesehen. Verschieben der Tagesnamen sollte reichen.
2) genau, Weather.IsFetched als include-condition hinzufügen, war auch mal drin, ist wohl wieder rausgefallen.
3) Generell ausschalten, wenn player.isPlaying oder .HasMedia, wenn ein Video im Hintergrund läuft, sieht´s ja auch doof aus.

Zippolighter

Schonmal danke für die Tipps.

Vielleicht könnt Ihr das noch ein bischen mehr beschreiben. Zumindest wie die komplette Zeile (Befehlskette) sein muss für Punkt 2 und 3. Punkt 1 ist denke ich nicht ganz so gravierend.

Habe mal in meinem jugendlichen Leichtsinn folgende Anpassung probiert

Zitat

<include condition="Skin.HasSetting(homepageWeatherWidget)" + "Weather.IsFetched">WeatherWidget</include>

Hiermit wird es dann aber gar nicht mehr angezeigt.

Ja ist halt so wenn man als James Dean User nicht weiss was man tut.

freaksworth

.. ne, eigentlich müsste es gehen, wenn man die attribute einfach nacheinander schreibt.
[edit]NICHT![/edit]

Zippolighter

Wenn ich das so eingebe wie Du gerade beschrieben hast, wird der Skin nicht mehr geladen und er springt zum default skin Confluence.

Auch manuell kann ich dann den Skin nicht mehr setzen.

freaksworth

... hast Recht, ist auch komplett Unsinn. Attribute dürfen natürlch nicht mehrfach vorkommen.

XML

<include condition="Skin.HasSetting(homepageWeatherWidget) + Weather.IsFetched">WeatherWidget</include>

...so müsste es. Also die Häkchen um die komplette(n) Bedingung(en).

Zippolighter

So wird es jetzt angezeigt, allerdings erst wenn die Home.xml nachgeladen wird. Dies verhalten ist anders als die kleine Wetteranzeige in der Kopfzeile. Die wird angezeigt sobald die Wetterdaten geladen sind auch ohne nachladen der Home.xml.

Hängt das damit zusammen das es als include gebaut ist und nicht als visible??

freaksworth

... glaub ich nicht. Bin grad auf Schicht, schaue heute Abend nochmal nach.
Gibt es eigentich mittlerweile verschiedenen Wetterdienste/-Add-Ons?

Jetzt mitmachen!