65.9K
CodeProject 正在变化。 阅读更多。
Home

Windows Phone 7的星座程序

2010年11月4日

CPOL

5分钟阅读

viewsIcon

51575

downloadIcon

1231

如何创建Windows Phone 7的星座应用程序。

引言

Zodiac_Phone/StartScreen.png

智能手机的未来是:为单身人士构建手机应用程序。许多智能手机开发者将充当广告代理商的软件,或向新网站广播。
微软现在向开发者指出,可以使用 Framework.NET 结合好的想法为普通人开发应用。

现在,我在我的文章中展示了一个使用 framework.NET 技术轻松为 Windows Phone 创建优质产品的可能性。

本文可以帮助那些想知道在安装 Windows Phone 开发者包后能做什么的开发者。他们可能会问:我已经知道 .NET,并且安装了必要的程序,如何开始?
本文将展示一种方法。

开发者希望了解如何实现 WCF 来与云通信。本文是一个很好的例子。

商务人士希望拥有新的未来商业领域,本文的简单性展示了如何做到这一点。

背景

本文展示了如何在 Windows Phone 7 中创建星象应用程序。使用的技术是 XAML、WCF、LINQ 和 C#。

XAML 只会在 Windows Phone 中用于与用户交互。

用户将请求一个星座的预测。WCF 代理将组织请求参数,并通过互联网向发布在 Web 服务器上的 WCF 服务发出请求。

Web 服务器将接收请求参数,组织调用 RSS 星象,传递星座参数。

RSS 将返回 XML 响应,WCF 服务将使用 LINQ 从 XML 中仅提取 `Item` 标签中的预测,并通过代理的 `Completed` 事件返回预测。

预测响应将写入 Windows Phone 屏幕。

Zodiac_Phone/Horoscope.png

Using the Code

启动一个 Windows Phone 应用程序项目。选择模板:Visual C#、Silverlight for Windows Phone。选择 Windows Phone Application。

创建一个标题面板,显示应用程序的标题和简短说明。

Zodiac_Phone/3_Title.png

`TextBlock` 在您的屏幕上显示一个带有 `Text` 属性中预定义文本的标签。

标题面板的代码

<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 
     <TextBlock x:Name="ApplicationTitle" Text="The future in your hand" 
		Style="{StaticResource PhoneTextNormalStyle}"/> 
     <TextBlock x:Name="PageTitle" Text="Zodiac Phone" Margin="9,-7,0,0" 
		Style="{StaticResource PhoneTextTitle1Style}"/> 
</StackPanel> 

插入 `ContentPanel`,其中包含此应用程序的所有控件(星座按钮和预测面板)。

插入 12 张代表十二星座的图片。确定图片的位置、图像源和大小以获得良好的外观。将 `MouseLeftButtonDown` 设置为等于所有图片的点击事件,并为每张图片确定 `Tag` 属性中的 `Code` 和 `Name` 参数。

每张图片都有一个按钮功能,点击(`MouseLeftButtonDown`)时将调用 WCF 代理并传递 `Tag` 属性中的星座代码。

Zodiac_Phone/4_Content.png

图片的 UI 代码

<Image Name="iAries" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="10,24,0,0" Stretch="Fill" VerticalAlignment="Top" 
Source="/ZodiacPhone;component/img/aries.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="1|Aries" />
<Image Name="iTaurus" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="165,24,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/touro.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="2|Taurus"/>
<Image Name="iGemini" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="322,24,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/gemeos.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="3|Gemini"/>
<Image Name="iCancer" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="10,172,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/cancer.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="4|Cancer"/>
<Image Name="iLeo" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="165,172,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/leao.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="5|Leo"/>
<Image Name="iVirgo" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="322,172,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/virgem.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="6|Virgo"/>
<Image Name="iLibra" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="10,330,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/libra.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="7|Libra"/>
<Image Name="iScorpio" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="165,330,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/escorpiao.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="8|Scorpio"/>
<Image Name="iSagitarius" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="322,330,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/sagitario.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="9|Sagittarius"/>
<Image Name="iCapricorn" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="10,481,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/capricornio.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="10|Capricorn"/>
<Image Name="iAquarius" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="165,481,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/aquario.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="11|Aquarius"/>
<Image Name="iPisces" Cursor="Hand" Height="128" Width="128" 
HorizontalAlignment="Left" Margin="322,481,0,0" Stretch="Fill" 
VerticalAlignment="Top" Source="/ZodiacPhone;component/img/peixes.png" 
MouseLeftButtonDown="callPrevision_MouseLeftButtonDown" Tag="12|Pisces"/>

预测网格包含显示星座名称、预测文本和返回按钮的控件。

一个 `TextBlock` 将显示星座名称作为预测屏幕的标题。第二个 `TextBlock` 将显示预测文本。该屏幕仅在代理的 `Completed` 事件触发时打开。

一个带有返回功能的按钮将显示在预测下方。

预测网格的代码

<Grid x:Name="TextGrid" Visibility="Collapsed" Background="#FF144B0D" Opacity="0.97">
     <TextBlock Name="txtPrevisionTitle" Width="452" FontSize="20" Opacity="1">
     </TextBlock>
     <TextBlock Name="txtPrevision" Width="400" Height="500" TextWrapping="Wrap" 
	FontSize="24" />
     <Button Name="btnHome" VerticalAlignment="Bottom" Width="90" 
	Height="90" Cursor="Hand" BorderBrush="#FF70A1E2" Click="btnHome_Click">
          <Button.Background>
               <ImageBrush ImageSource="/ZodiacPhone;component/img/back_button.png" 
		Stretch="None" />
          </Button.Background>
     </Button>
</Grid>

现在创建 WCF 项目。我将其分开是因为我使用的是 Express 版本。如果不是 Express 版本,您可以在同一个解决方案中创建一个新的 WCF 项目。

选择 WCF Service Application。输入一个名称,例如 `WcfService`,选择位置,然后单击 Ok。

Zodiac_Phone/6_Choose_WCF_Template.png

WCF 需要与接口协同工作,因为 WCF 方法可以被许多不同的应用程序远程调用,所有应用程序都需要遵守一个契约,以便正确调用 WCF。因此,WCF 服务实现这一点的一种方式是通过接口。

在新 WCF 项目中会创建一个默认接口,名为 `IService1`。您可以修改此默认接口以拥有正确的契约。在本文中,我对其进行了修改,以拥有一个 `GetPrevision` 方法的契约。

清除模板打开的所有示例代码。将接口从 `IService1` 重命名为 `IZodiacPhone`。

Zodiac_Phone/7_Clear_Interface.png

创建 `GetPrevision` 接口方法,并带有 `ServiceContract`,供 WCF 中的主类使用。

Zodiac_Phone/8_WCF_Interface.png

WCF 服务接口的代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Web;
using System.Text;
namespace WcfService
{
     [ServiceContract]
     public interface IZodiacPhone
     {
          // TODO: Add your service operations here
          [OperationContract]
          string GetPrevision(int value);
     }
}

主类默认名为 `Service1`。在本文中,我对该类进行了修改以实现 `GetPrevision` 方法。

该类需要使用该接口,因为该类及其方法将被远程调用,并且需要提供一个契约供应用程序遵守。

打开主类 `Service1`。将类重命名为 `ZodiacPhone`,更改使用的接口为 `IZodiacPhone`,并清除示例代码。

Zodiac_Phone/9_Clear_WCF.png

现在 WCF 中的主类将处理接收到的信息,调用 RSS,提取预测并返回结果。

继续,在范围内引用 `System.XML.Linq`,创建管理星座调用的 `GetPrevision` 方法,打开正确的 RSS 地址并捕获星座描述。

我使用 XMLDoc 打开 RSS 并使用 LINQ 提取 `Item` 标签中 `Description` 标签的内容。

Zodiac_Phone/10_WCF_GetPrevision.png

WCF 代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Web;
using System.Text;
using System.Xml.Linq;
namespace WcfService
{
    // NOTE: You can use the "Rename" command on the "Refactor" menu 
    // to change the class name "Service1" in code, svc and config file together.
    public class ZodiacPhone : IZodiacPhone
    {
        public string GetPrevision(int p_nSign) 
        { 
            try 
            { 
                string sReturn = "";
                switch (p_nSign) 
                { 
                    case 1:                        
                        sReturn = "Aries"; 
                        break; 
                    case 2:                        
                        sReturn = "Taurus"; 
                        break; 
                    case 3:                        
                        sReturn = "Gemini"; 
                        break; 
                    case 4:                        
                        sReturn = "Cancer"; 
                        break; 
                    case 5:                        
                        sReturn = "Leo"; 
                        break; 
                    case 6:                        
                        sReturn = "Virgo"; 
                        break; 
                    case 7:                        
                        sReturn = "Libra"; 
                        break; 
                    case 8:                        
                        sReturn = "Scorpio"; 
                        break; 
                    case 9:                        
                        sReturn = "Sagittarius"; 
                        break; 
                    case 10:                        
                        sReturn = "Capricorn"; 
                        break; 
                    case 11:                        
                        sReturn = "Aquarius"; 
                        break; 
                    case 12:                        
                        sReturn = "Pisces"; 
                        break; 
                    default:                        
                        sReturn = "service off..."; 
                        break; 
                }
                //XDocument xml = XDocument.Load
		(@"http://www.horoscopofree.com/pt/misc/partnership/Horoscopo.xml?
		HFPTS=526bf73c3babbce8ed5371f7633e3a5e"); 
                XDocument xml = XDocument.Load(@"http://www.findyourfate.com/rss/
		dailyhoroscope-feed.asp?sign=" + sReturn); 
                var Horoscope = from rss in xml.Descendants("item") 
                                //where (rss.Element("title").Value.Contains("sReturn")) 
                                select new 
                                { 
                                    Description = (string)rss.Element("description").Value 
                                }; 
                foreach (var dados in Horoscope) 
                { 
                    sReturn = dados.Description; 
                } 
                return sReturn; 
            } 
            catch (Exception ex) 
            { 
                throw ex; 
            } 
        }
    }
}

将 WCF 服务发布到 Web 服务器。在我的示例中,我只运行 WCF 项目并使用本地地址。

返回 Windows Phone XAML 项目,在解决方案资源管理器中,右键单击“服务引用”,然后选择“添加服务引用”。

输入已发布的 WCF 服务地址,然后单击“转到”。

输入一个命名空间,例如 `ZodiacPhoneService`,然后单击“确定”。

Zodiac_Phone/11_Reference_to_WCF.png

打开 XAML Windows Phone 项目的 C# 代码。

通过代理变量调用 WCF 服务。实现前端的方法(调用预测、显示、隐藏和更新)。

前端的方法是

  • `callPrevision`:通过代理调用远程方法。
  • `closePrevision`:清除并隐藏预测屏幕中的所有控件。
  • `callPrevision_MouseLeftButtonDown`:当任何图片被点击时触发。在此事件中,我提取参数来调用 `callPrevision` 方法。
  • `proxy_GetPrevisionCompleted`:当代理收到上次调用的结果时触发。当此方法触发时,我打开预测屏幕并显示预测文本。
  • `btnHome_Click`:当 Home 按钮被点击时触发。调用 `closePrevision` 方法,使应用程序返回到初始状态。

Zodiac_Phone/12_XAML_Code.png

前端 C# 代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
namespace ZodiacPhone
{
    public partial class MainPage : PhoneApplicationPage
    {
        ZodiacPhoneService.ZodiacPhoneClient proxy = 
			new ZodiacPhoneService.ZodiacPhoneClient();
        // Constructor
        public MainPage()
        {
            InitializeComponent();
        }
        private void callPrevision(int sign, string signName)
        {
            proxy.GetPrevisionCompleted += new EventHandler
	<ZodiacPhoneService.GetPrevisionCompletedEventArgs>(proxy_GetPrevisionCompleted);
            proxy.GetPrevisionAsync(sign);
            txtPrevisionTitle.Text = signName;
        }
        private void closePrevision()
        {
            TextGrid.Visibility = System.Windows.Visibility.Collapsed;
            txtPrevisionTitle.Text = "";
            txtPrevision.Text = "";
        }
        private void callPrevision_MouseLeftButtonDown
			(object sender, MouseButtonEventArgs e)
        {
            string[] response = ((Image)sender).Tag.ToString().Split('|');
            int sign = Convert.ToInt16(response[0]);
            string signName = response[1];
            callPrevision(sign, signName);
        }
        void proxy_GetPrevisionCompleted
	(object sender, ZodiacPhoneService.GetPrevisionCompletedEventArgs e)
        {
            string resultado = e.Result;
            TextGrid.Visibility = System.Windows.Visibility.Visible;
            txtPrevision.Text = resultado;
        }
        private void btnHome_Click(object sender, RoutedEventArgs e)
        {
            closePrevision();
        }
    }
}

关注点

在 Windows Phone 上开发非常好。这个平台很强大,拥有许多工具可以创建功能强大的应用程序。使用 XAML、WCF 和框架 4.0 的可能性为 Windows Phone 开辟了广阔的未来。

© . All rights reserved.