Windows Phone – Daily Horoscope Example

Do you believe on horoscope? I do not but my wife does. Sometimes she watches in Internet some predictions about her horoscope and tells me that they are not correct in her case. But in most of cases it was correct and she believes it a lot. She says me that everyone has his own fate and man can not change or something likes that. I always say she should be a fortuneteller. She will earn millions of dollars from this career. ^^. Although I do not believe on horoscope but today I decide to write a small application on Windows Phone to tell user his daily horoscope. With this application I would like to test if I can use DependencyObject to create a custom image button control. The result is ” I failed”. In WPF I can easily create a image button with RelativeSource and AncestorType but Silverlight and Windows Phone do not support it. There is work around with DependencyObject but I still do not know how to do it. So if you know how to make a custom image button control in Windows Phone then please tell me.

The application is very simple. It just fetches data from a RSS feed under XML format and gives information back to GUI. Because I failed with create a custom image button therefore my XAML file looks very terrible as following

<StackPanel Orientation="Vertical">
	<Rectangle Height="25"></Rectangle>
	<StackPanel Orientation="Horizontal">
		<StackPanel Style="{StaticResource CustomSPStyle}" Orientation="Vertical">
			<Image MouseLeftButtonDown="imgAries_MouseLeftButtonDown" x:Name="imgAries" Style="{StaticResource CustomImageStyle}" Source="Images/DuongCuu.jpg"></Image>
			<TextBlock Style="{StaticResource CustomTBStyle}" Text="Aries"></TextBlock>
		</StackPanel>
		<StackPanel Style="{StaticResource CustomSPStyle}" Orientation="Vertical">
			<Image MouseLeftButtonDown="imgTaurus_MouseLeftButtonDown" x:Name="imgTaurus" Style="{StaticResource CustomImageStyle}" Source="Images/KimNguu.jpg"></Image>
			<TextBlock Style="{StaticResource CustomTBStyle}" Text="Taurus"></TextBlock>
		</StackPanel>
		<StackPanel Style="{StaticResource CustomSPStyle}" Orientation="Vertical">
			<Image MouseLeftButtonDown="imgGemini_MouseLeftButtonDown" x:Name="imgGemini" Style="{StaticResource CustomImageStyle}" Source="Images/SongTu.jpg"></Image>
			<TextBlock Text="Gemini" Style="{StaticResource CustomTBStyle}"></TextBlock>
		</StackPanel>
	</StackPanel>
	...
</StackPanel>

You can see that I use StackPanel to store my custom control consisting of an image and a textblock. For each horoscope I add such StackPanel and it is really stupid to do that because when I want to apply style for textblock/image, I must apply it for every textblock/image through copying and pasting. Because I am stuck in creating such control like this http://blogs.msdn.com/mikehillberg/archive/2007/02/01/ParameterizedTemplates.aspx , this is current status. I will update the code if I find a solution. The remaining code is really easy. It is combination of navigating between pages, getting data from web client and parsing data,… etc. Nothing special.

private void imgLeo_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
	NavigationService.Navigate(new Uri("/Astrology.xaml?Horoscope=Leo", UriKind.Relative));
}
...
void wcTemp_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
	try
	{
		XDocument doc = XDocument.Parse(e.Result);
		var vGotArticle = (from s in doc.Descendants("item")
						   select new Horoscope
						   {
							   Title = s.Element("title").Value,
							   Description = TrimAndRemoveNewLine(s.Element("description").Value.ToString()),
						   });
		m_lstHoroscope = vGotArticle.ToList();

		if (m_lstHoroscope.Count > 0)
		{
			var vFound = (from h in m_lstHoroscope
							   where h.Title.IndexOf(m_strHoroscope) >= 0
							   select h).FirstOrDefault();
			HoroscopeImage = GetImageUri(m_strHoroscope);
			NotifyPropertyChanged("HoroscopeImage");
			HoroscopeDescription = vFound.Description;
			NotifyPropertyChanged("HoroscopeDescription");
		}

	}
	catch (Exception ex)
	{
		throw ex;
	}
}

The complete source code of this example you can download here “Windows Phone Horoscope