彩票走势图

　　Syncfusion公司在Essential Studio Enterprise Edition 2011 v3版本中发布了一套针对于Windows Phone 7（WP7）的UI控件。过去也曾使用过Syncfusion公司的控件产品，觉得还不错，因此，我决定再次亲自体验一下本次版本中针对于WP7的UI控件。本文将通过代码实例来展示如何运用User Interface Edition for Windows Phone控件在程序中创建图表。

　　在使用前，肯定要下载Essential Studio User Interface Edition for Windows Phone 7 撒！这里说明一下，User Interface Edition for Windows Phone 7 包含在Essential Studio Enterprise Edition中的，只需要下载Essential Studio Enterprise Edition即可！

　　一旦安装了该控件包，您需要启动Syncfusion仪表板，并用它来安装二进制文件。Syncfusion这样做就是为了让在管理不同版本的控件包时更加轻松。

　　一旦安装了Essential Studio Enterprise Edition控件包，接下来启动Visual Studio，然后便可以开启一个新的Windows Phone程序或者打开一个已有的程序。来到添加引用的对话框，选择组件，选择扩展，然后添加你的程序中需要用到的Syncfusion库。在本文中，我们将使用Syncfusion.Chart.Phone. 接下来，你需要添加引用到你的XAML中，使其在页面中可以。对于图表控件，下面的代码就是我添加到XAML文件顶部的 “phone:PhoneApplicationPage”标签的代码：

　　xmlns:chart="clr-namespace:Syncfusion.Phone.Chart;assembly=
Syncfusion.Chart.Phone"

　　这样做是为了将Syncfusion图表控件公开到页面，方便我们可以使用。现在，我们可以开始放置部分图表在页面上。我们马上将开始一个“图表”对象，然后将 “ChartArea”装进“图表”对象中。ChartArea中可包含图例和图表数据等。因为我们使用图表命名控件导入了控件， XAML中的所有图表标签都以“chart”开始。一旦我们填写了标签，你就可以发现可视化设计器中的图表以及初具规模了。我们将添加一个空的图例和两个轴。你最多可以添加两种轴类型， PrimaryAxis (x-axis)和SecondaryAxis (y-axis).对于每个轴，你可以将“IsAutoSetRange”设置为“True”，然后通过控件指出使用范围。

　　你需要在控件中导入一些数据。你可以通过后台代码来设置数据上下文，从而实现手动执行此操作。根据我的经验，这并不是最好的方法，因为它是很难跟踪到屏幕上的数据进入到控件中了。您需要追踪实际调用来设置数据上下文。所以，我们将在XAML中来完成它。要做到这一点，首先要在ChartArea中创建一个ChartSeries对象。这使我们能够控制制成什么样的图，其在屏幕上的标签和外观，以及数据从何而来。

 Code sample A: The Chart control itself

<chart:ChartArea Header="Sample Chart" GridBackground="AliceBlue">

<chart:ChartArea.Legends>

<chart:ChartLegend></chart:ChartLegend>

</chart:ChartArea.Legends>

<chart:ChartArea.PrimaryAxis>

<chart:ChartAxis Name="Xaxis" Header="Week"
 IsAutoSetRange="True"></chart:ChartAxis>

</chart:ChartArea.PrimaryAxis>

<chart:ChartArea.SecondaryAxis>

<chart:ChartAxis Name="Yaxis" Header="Sales"
 IsAutoSetRange="True"></chart:ChartAxis>

</chart:ChartArea.SecondaryAxis>

<chart:ChartSeries Name="WeeklySales"
 Label="Weekly Sales" Type="Line" Stroke="Blue" StrokeThickness="2" 
BindingPathX="WeekNumber" BindingPathsY="Sales"
 DataSource="{StaticResource dataSet}"></chart:ChartSeries>

</chart:ChartArea>

</chart:Chart>

Code sample B: The data binding classes

public class SalesData

{

public int WeekNumber { get; set; }

public double Sales { get; set; }

}

public class WeeklySalesData : ObservableCollection<SalesData>

{

}

Code sample C: The data resource in the XAML

<UserControl.Resources>

<localItems:WeeklySalesData x:Key="dataSet">

<localItems:SalesData WeekNumber="1" Sales="890.45" />

<localItems:SalesData WeekNumber="2" Sales="912.12" />

<localItems:SalesData WeekNumber="3" Sales="1234.87" />

<localItems:SalesData WeekNumber="4" Sales="908.34" />

<localItems:SalesData WeekNumber="5" Sales="762.78" />

<localItems:SalesData WeekNumber="6" Sales="671.23" />

<localItems:SalesData WeekNumber="7" Sales="908.99" />

<localItems:SalesData WeekNumber="8" Sales="1342.11" />

<localItems:SalesData WeekNumber="9" Sales="1276.21" />

<localItems:SalesData WeekNumber="10" Sales="1098.07" />

</localItems:WeeklySalesData>

</UserControl.Resources>

Figure D: What the layout looks like in Visual Studio 

Figure E: Screenshot of the running application

下载《Essential Studio Enterprise Edition》