Extending the Hello Location example for showing nearby events

In Chapter 2, Using Location in Windows Phone 7.5, we saw a simple location example titled "Hello Location" that showed our location information. We will extend this to build a location-enabled events app using the Eventful API.

The following are essential before we start building our location-enabled events app:

We will use the simple Windows Phone application template to create a new sample application titled Hello Events, and add a new page to it; so let's begin:

  1. Open the Microsoft Visual Studio 2010 Express for Windows Phone IDE, and create a new project by selecting File | New Project. Select the Windows Phone Application template within the Visual C# option; Name it as HelloEvents.
  2. Copy the code and UI from our Hello Location example within the MainPage.xaml and MainPage.xaml.cs files that mimic the Hello Location app.
  3. Next, right-click on your project name in Solution Explorer and select Add | New Item, as shown in the following screenshot:
    Extending the Hello Location example for showing nearby events
  4. From the Add New Item pop up page select the Windows Phone Portrait Page option. Name the page EventPage.xaml, as shown in the following screenshot:
    Extending the Hello Location example for showing nearby events
  5. Now in your MainPage.xaml, add a new button titled Show Events. This button will fire an event that will load the EventPage.xaml page and load ten nearby events from the Eventful API, by passing in the location values obtained from the GeoCoordinateWatcher object.
  6. Define the Click handler for your Show Events button in the MainPage.xaml file as:
    <Button Content="Show Events" Height="72"
HorizontalAlignment="Left" Margin="-4,270,0,0" Name="button1"
VerticalAlignment="Top" Width="207" Click="showEvents_Click" />
  7. Now let us define the showEvents_Click() event handler function. We use the NavigationService class to navigate across the various pages in our application. As we want to pass in the latitude and longitude pair to our Events Page, we send it as a query string to the NavigationService.Navigate method as:
    Private void showEvents_Click(objectsender,RoutedEventArgs e)
{
NavigationService.Navigate(
new Uri("/EventPage.xaml?latitude=" + latitudeText.Text +
"&longitude="+longitudeText.Text, UriKind.Relative)
);
}
  8. Now let's start writing some code to fetch the nearby events from the Eventful API, and display the details on the events page of our application. We begin by declaring a variable of type WebClient and a string variable to store our Eventful API key in our EventPage class declaration in the EventPage.xaml.cs file.
    public partial class EventPage :PhoneApplicationPage
{
WebClient myWebClient;
String apiKey = "xxxxxxxxxxxxx"; // Get your own key from
//eventful.com
public EventPage()
{
InitializeComponent();
  9. As we will be using the XML API from Eventful.com, don't forget to include the System.Xml and System.Xml.Linq namespaces. For debugging we added the System.Diagnostics namespace as well. You may need to Add Reference to the libraries from the Solution Explorer | References tab.
    using System.Xml;
using System.Xml.Linq;
using System.Diagnostics;
  10. Next, initialize the WebClient variable in the EventPage() constructor as:
    myWebClient = new WebClient();
  11. We use the OnNavigatedTo overridable method of the PhoneApplicationPage class to notify our EventPage class that the page has been navigated to (the page has been visited or browsed). Here is where we catch the passed location query by using the NavigationContext class's QueryString method.
  12. We then pass on the latitude and longitude values to the Eventful.com API via the myWebClient variable and initiate the web request, the callback function being myWebClient_DownloadStringCompleted.
    Protected override void
OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
base.OnNavigatedTo(e);
string latitude= NavigationContext.QueryString["latitude"];
string longitude= NavigationContext.QueryString["longitude"];
// Load Events from Eventful.com API
myWebClient.DownloadStringCompleted += new
DownloadStringCompletedEventHandler
(myWebClient_DownloadStringCompleted);
Uri uri = new Uri
("http://api.eventful.com/rest/events/search?keywords=concerts&
location=" + latitude + "," + longitude +
"&app_key="+apiKey+"&within=10");
myWebClient.DownloadStringAsync(uri);
// End of Eventful API call.
}
  13. To display the nearby events (we are searching for nearby concerts), we added a ListBox control to the EventPage.xaml file, as well as a ProgressBar control (the awesome loading animation you see in almost all Windows Phone 7.5 apps), and enable its animation activity by setting the IsIndeterminate property to true as shown in the following code:
    <ProgressBar Name="loadingBar" Margin="0,251,0,263"
IsIndeterminate="true">
</ProgressBar>
<ListBox Height="595" HorizontalAlignment="Left"
Margin="2,6,0,0" Name="myEventsList" VerticalAlignment="Top"
Width="448">
</ListBox>
  14. Now when the API request completes downloading the response, the myWebClient_DownloadStringCompleted method parses the XML and appends the events titles to the ListBox control we added in the EventPage.xaml file. We also set the ProgressBar control to inactive and collapse it. We use the List class from System.Collections.Generic and create a list of string objects that represent the event name from the XML response. When we are done collecting the event names in the list object, we assign the list object as the source to our ListBox.
    private void myWebClient_DownloadStringCompleted(object sender,
DownloadStringCompletedEventArgs e)
{
XElement xml = XElement.Parse(e.Result);
// Best practice for pausing a ProgressBar loading animation.
loadingBar.IsIndeterminate = false;
loadingBar.Visibility = Visibility.Collapsed;
List<string>myListItem = newList<string>();
IEnumerable<XElement> elements = xml.Descendants("event");
foreach (XElement element in elements)
{
myListItem.Add(element.Element("title").Value);
}
Hello Location exampleHello Location exampleextendingmyEventsList.ItemsSource = myListItem;
}
  15. Running the application in the emulator produces the following screenshot:
    Extending the Hello Location example for showing nearby events
  16. Clicking on the Show Events button produces the following screenshot:
    Extending the Hello Location example for showing nearby events

For real-world results, run it on your Nokia Lumia 800 or any other Windows Phone 7.5 device, to find nearby events! Notice the back button on the Events Page; this will take you back to the Your Location page automatically. You can also customize the back button behavior, by changing the BackStack property in the NavigationService class. Refer to the Back Stack page on MSDN at http://msdn.microsoft.com/en-us/library/hh394012(v=vs.92).aspx.

You can find this example project in the code files for the book underChapter 4, titled HelloEvents.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.147.205.3