Tutorials Forums
     Tutorials Videos
        Sign Up Now For FREE
Welcome, Guest
Username Password: Remember me

Creating a Weather Gadget for (Windows 7)
(1 viewing) (1) Guest
A programming language that evolved in part from Microsoft C++, C# was designed for building enterprise-level applications that run on the .NET Framework. C# is simple, modern, type safe, and object oriented. Whether you’re new to the language or an old pro, you’ll find articles in this section that will help you get your projects done.
  • Page:
  • 1

TOPIC: Creating a Weather Gadget for (Windows 7)

Creating a Weather Gadget for (Windows 7) 02 May 2010 11:42 #365

Introduction
In this article we will see how you can develop a Weather gadget for Windows 7 which uses Yahoo Weather API for fetching Weather data. The application will also have some of the latest exciting features of Windows 7 like Thumbnail Toolbar and Progress bar.
We will need the Windows API Codepack to add Windows 7 features to the application. Download Windows API code pack and extract the contents to a location of your choice. The download has samples and projects files which we will be using in our project.
Below is the screenshot of the application you will be developing.

The Code
Step 1: Fire up Visual Studio and create a new Windows Forms Application Project.
Note: Make sure you choose the .net framework as 3.5
Step 2:Right Click Solution > Add > Existing Project and navigate to the folder in which the Windows API Code pack was extracted. Open ‘WindowsAPICodePack’ folder and then add the following projects to your solution.
    a. ‘Core’ which can be found under ‘core’folder b. Shell which can be found under ‘shell’folder.

Step 3:Now right click your new project we created in Step 1 and Add References to the above projects. In the resulting window select "Projects" tab and it will list the projects currently added to the solution. We have to select both and click ok.
Step 4:Add the following controls to your form
    a. Rich Text Box : RTTemp : This control will be used to display the temperature. b. Rich Text Box : RTWeatherType : This control will be used to display the weather type. c. Picture Box : weatherImage

Step 5: Import the following namespaces
    a. Microsoft.WindowsAPICodePack.Shell; b. Microsoft.WindowsAPICodePack.Taskbar; c. System.Xml; d. System.Xml.XPath;

Step 6:Yahoo has a weather API, using which we will be fetching weather report of a particular location. To fetch a particular location’s weather data we will need WOEID (Where on Earth Identification) of that location. To find the WOEID of a particular location, go to weather.yahoo.com and search for the location. The WOEID of the location can be found on the URL. In the below URL 906057is the WOEID for Stockholm

Step 7:According to Yahoo Weather API page
The Weather RSS feed enables you to get up-to-date weather information for your location.
We will use this RSS feed (XML file) to display weather details about a location.
Step 8:Following are the global variables which will be used in the application.
String[] strLocationID = { "12888494", "2251945", "44418", "906057", "2373278" };
String[] strLocations = { "vasteras", "tehran", "London", "stockholm", "california" };
int currentLocation = 0;
private ThumbnailToolbarButton buttonNext;
private ThumbnailToolbarButton buttonPrevious;
TaskbarManager tbManager = TaskbarManager.Instance;

In the code shown above, we have the list of locations and their WOEID’s. We also have 2 ‘ThumbnailToolbarButtons’ which will be used to change locations.
Step 9:The following code shown below will fetch the weather report of a particular location. We will be using currentLocation to keep track of the location details.
  private void GetWeatherReport(int locationId)
{
 
this.Text = strLocations[locationId];
XPathDocument doc = new XPathDocument("http://weather.yahooapis.com/forecastrss?w=" + strLocationID[locationId] + "&u=c");
XPathNavigator nav = doc.CreateNavigator();
 
XmlNamespaceManager ns = new XmlNamespaceManager(nav.NameTable);
ns.AddNamespace("yweather", "http://xml.weather.yahoo.com/ns/rss/1.0");
XPathNodeIterator nodes = nav.Select("/rss/channel/item/yweather:condition", ns);
 
while (nodes.MoveNext())
{
XPathNavigator node = nodes.Current;
RTTemp.Text = node.GetAttribute("temp", ns.DefaultNamespace).ToString() + "°C";
RTWeatherType.Text = node.GetAttribute("text", ns.DefaultNamespace).ToString();
weatherImage.ImageLocation = "http://l.yimg.com/a/i/us/we/52/" + node.GetAttribute("code", ns.DefaultNamespace).ToString() + ".gif";
SetProgressBarStyle(Convert.ToInt16(node.GetAttribute("temp", ns.DefaultNamespace)));
 
}
 
 
 
}

In the code shown above, we fetch the current weather details about the location and then set the progressbar style based on the temperature. This article will not talk about the XML response from Yahoo weather. See developer.yahoo.com/weather/ for more details.
Step 10:Now in the code shown below, we set the progress bar style and value using ‘SetProgressValue’and ‘SetProgressState’. Windows 7 has some new exciting features which includes showing the progress in the taskbar. Colour of the progress bar changes based on the current state of the progressbar.
  private void SetProgressBarStyle(int weather)
{
//tbManager.SetProgressState(TaskbarProgressBarState.Normal);
tbManager.SetProgressValue(50, 100);
 
if (weather <= 10)
{
tbManager.SetProgressState(TaskbarProgressBarState.Normal);
 
}
if (weather >= 20)
{
tbManager.SetProgressState(TaskbarProgressBarState.Paused);
 
}
if (weather >= 30)
{
tbManager.SetProgressState(TaskbarProgressBarState.Error);
 
}
 
}

The progress bar style is set based on the temperature.
    TaskbarProgressBarState.Normal : A normal progressbar is shown TaskbarProgressBarState.Paused : Displays a progressbar with yellow colour TaskbarProgressBarState.Error :Displays a progressbar with Red colour.

Step 11:Add the following code to the Form’s Shown event.
 buttonNext = new ThumbnailToolbarButton(Properties.Resources.nextarrow, "Next Location");
buttonNext.Enabled = true;
buttonNext.Click += new EventHandler<ThumbnailButtonClickedEventArgs>(buttonNext_Click);
 
buttonPrevious = new ThumbnailToolbarButton(Properties.Resources.prevarrow, "Previous Location");
buttonPrevious.Enabled = true;
buttonPrevious.Click += new EventHandler<ThumbnailButtonClickedEventArgs>(buttonPrevious_Click);
TaskbarManager .Instance.ThumbnailToolbars.AddButtons(this.Handle, buttonPrevious, buttonNext);
//TaskbarManager.Instance.TabbedThumbnail.SetThumbnailClip(this.Handle, new Rectangle(weatherImage.Location, weatherImage.Size));
 
GetWeatherReport(currentLocation);

In the code shown above, we created two new thumbnail buttons and set its properties. ‘ThumbnailToolbarButton’accepts two arguments. The first one is the icon of the button and the second one is the tool tip to be displayed. We have also added an event handler for these buttons for client event. Once the buttons are created, we add them to the taskbar instance using
TaskbarManager.Instance.ThumbnailToolbars.AddButtons(this.Handle, buttonPrevious, buttonNext)

Step 12: The following code defines the client event for the thumbnail toolbar buttons.
    void buttonNext_Click(object sender, EventArgs e)
{
 
if ((currentLocation + 1) < strLocationID.Length)
{
currentLocation += 1;
GetWeatherReport(currentLocation);
}
 
}
 
void buttonPrevious_Click(object sender, EventArgs e)
{
 
if ((currentLocation - 1) >= 0)
{
currentLocation -= 1;
GetWeatherReport(currentLocation);
}
}

That’s it. Save and run your application. Below are some of the screenshots of the weather gadget in action!
,
This attachment is hidden for guests. Please log in or register to see it.
Attachments:
  • Attachment This attachment is hidden for guests. Please log in or register to see it.
  • CE
  • OFFLINE
  • Administrator
  • Posts: 197
  • Karma: 78
The following user(s) said Thank You: Ghasem
CodersEngine
  • Page:
  • 1
Moderators: mnjon
Time to create page: 0.91 seconds