入门
关于 ComponentOne Studio WPF Edition安装，授权，技术支持，命名空间和控制工程的创建，请参阅 Getting Started with WPF Edition。
关于 ComponentOne Studio Silverlight Edition安装，授权，技术支持，命名空间和控制工程的创建，请参阅 Getting Started with Silverlight Edition。

快速入门

快速入门可以帮助您顺利运行WPF及Sliverlight版Tiles，在快速入门中您需要在Visual Studio中创建一个新的工程，添加WPF及Silverlight版Tiles控件到您的应用程序中并个性化设置控件的外观和活动。
您可以在您的应用程序中包含C1Tile和C1SlideTile控件，获取更多的信息，请参阅C1Tile和C1SlideTile。
第一步：建立瓷贴应用程序
第二步：添加Tiles到应用程序第三步：运行Tiles应用程序主要特性
WPF及Sliverlight版Tile包含以下特有功能： 创建翻转及滑动瓷贴
通过C1FlipTile(仅适用仅适用Silverlight)和C1SlideTile控制，您可以利用滑动或者翻转动画（仅适用Silverlight）创建瓷贴并以此来选择需要的内容，以此简化您的模板设计并提供内容控制，这些更新和动画均可以自动处理。
熟悉的Windows 8 实时瓷贴特性
WPF及及Sliverlight版瓷贴控件的设计灵感来源于Windows Stroe及Windows Phone apps中广泛使用的Modern-UI 风格，每个瓷贴控件体现了同Windows8及Windows Phones apps开始界面一样的实时交互风格，这就意味着只需要动动手指选择瓷贴，您的app就可以提供给用户熟悉的界面风格。
实时更新
C1Tiles可以提供翻转，滑动及显示"实时"更新的内容，您可以通过使用C1TileService静态类和
UpdateInterval属性轻松的控制更新时间的间隔。
多样的容器嵌入
C1Tiles可以在任何的ItemsControl容器中嵌入，如C1TileListBox，标准WrapPanel及ListBox控件。因此您可以在数据邦定的相关场景中使用C1Tiles，每个容器可以采取不同的方法来组织多个C1Tiles以帮助您设计出丰富多样的界面。
提供不同的尺寸
瓷贴的大小可以不同，不同类型和大小的瓷贴可以组合创构造出个性化的界面呈现，满足您的应用程序个性化需求。

第一步：建立瓷贴应用程序

这一步中您可以在Visual Studio中使用WPF及及Silverlight版版Tiles创建一个应用，在应用中添加一个包含C1Tiles控件的C1TileListBox，具体参阅以下步骤：

1. 在Visual Studio中，选择文件|新建|项目。
2. 新建项目对话框中，在左侧控制板中的语言下选择Windows，再从模板列表中选择WPF和和Silverlight应用。通过输入名称并点击确认完成项目创建，MainPage.xaml页面会被打开。
3. 在解决方案管理器窗口中右键点击项目,选择添加引用添加引用。
4. 在引用管理对话框中，定位并选择C1.WPF.dll或C1.Silverlight，C1.WPF.Tile.dll或C1.Silverlight.Tile.dll，点击确定添加引用到您的项目中。
5. 添加XAML命名空间到Window（WPF）或UserControl（Silverlight），通过以下的标记： xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml"

这是统一的命名空间，可以帮助您应用大多数的ComponentOne WPF和和Silverlight控件，而不用添加多用命名空间。Window或UserControl标记现在可以简化如下:

1. 在<Window>标签与<Grid>标签之间添加下列标记:

   WPF XAML

   <Window.Resources> <Style x:Key="listBoxItemStyle" TargetType="ListBoxItem"> <Setter Property="c1:C1TileService.PointerDownAnimation" Value="True"/> <Setter Property="Padding" Value="5" /> </Style> <Style TargetType="c1:C1Tile" x:Key="baseTileStyle"> <Setter Property="Background" Value="#FFC410" /> <Setter Property="Foreground" Value="White"/> <Setter Property="FontSize" Value="80"/> <Setter Property="HeaderForeground" Value="White"/> <Setter Property="HeaderFontSize" Value="12"/> <Setter Property="BorderThickness" Value="0" /> <Setter Property="Width" Value="280" /> <Setter Property="Height" Value="200" /> </Style> <Style TargetType="c1:C1Tile" BasedOn="{StaticResource baseTileStyle}"> </Style> <Style TargetType="c1:C1SlideTile" BasedOn="{StaticResource baseTileStyle}"> </Style> </Window.Resources>

   Silverlight XAML

   <UserControl.Resources> <Style x:Key="listBoxItemStyle" TargetType="c1:C1ListBoxItem"> <Setter Property="c1:C1TileService.PointerDownAnimation" Value="True"/>

   </Style> <Style TargetType="c1:C1Tile" x:Key="baseTileStyle"> <Setter Property="Background" Value="#FFC410" /> <Setter Property="Foreground" Value="White"/> <Setter Property="FontSize" Value="80"/> <Setter Property="HeaderForeground" Value="White"/> <Setter Property="HeaderFontSize" Value="12"/> <Setter Property="BorderThickness" Value="0" /> <Setter Property="Width" Value="280" /> <Setter Property="Height" Value="200" /> </Style> <Style TargetType="c1:C1Tile" BasedOn="{StaticResource baseTileStyle}"> </Style> <Style TargetType="c1:C1SlideTile" BasedOn="{StaticResource baseTileStyle}"> </Style> <Style TargetType="c1:C1FlipTile" BasedOn="{StaticResource baseTileStyle}"> </Style> </UserControl.Resources>

   将以上标签添加到程序的外观风格中。

2. 将光标放置于<Grid>与</Grid>标签之间，导航到Toolbox并双击ListBox控件添加到页面中。

3. 更新ListBox标记，显示如下：

   XAML

   <ListBox ItemContainerStyle="{StaticResource listBoxItemStyle}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" > <ListBox.ItemsPanel> <ItemsPanelTemplate> <c1:C1WrapPanel/> </ItemsPanelTemplate> </ListBox.ItemsPanel> <ListBox.Items> </ListBox.Items> </ListBox>

   本步中您可以创建一个WPF应用程序，在下一步您需要添加WPF及及Silverlight控件到应用中。

   第二步：添加Tiles到应用程序

   在上一步中您创建了一个WPF应用，在这一步您将添加WPF和和Silverlight控件。
   完成以下步骤：
4. 将光标放置于<ListBox.Items></ListBox.Items>之间，导航到工具箱并双击C1Tile控件将它添加到页面中。

5. 更新C1Tile标记，显示如下：

   XAML

   <c1:C1Tile Content="1" Header="C1Tile" HeaderPadding="12" Padding="0" HeaderBackground="#22000000" HorizontalHeaderAlignment="Stretch" />

   此处标签添加了标题和内容文本，间距，标题背景颜色和标题对齐。

6. 在C1Tile下面添加以下标记：

   XAML

   <c1:C1SlideTile Content="2" HeaderPadding="12" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Padding="0" Header="C1SlideTile"> <c1:C1Tile.ContentTemplate> <DataTemplate> <Border Background="#FFBC1C48" > <TextBlock Text="{Binding}" VerticalAlignment="Center" HorizontalAlignment="Center" /> </Border> </DataTemplate> </c1:C1Tile.ContentTemplate> <c1:C1Tile.BackContentTemplate> <DataTemplate> <Border Background="#FF028541" > <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center"> <TextBlock Text="{Binding}" Foreground="White" HorizontalAlignment="Center"/> <TextBlock Text="Back Content Template" Margin="0 -10 0 0" FontSize="12" Foreground="White" HorizontalAlignment="Center"/> </StackPanel> </Border> </DataTemplate> </c1:C1Tile.BackContentTemplate> </c1:C1SlideTile>

   注意此处标记添加了带有ContentTemplate和和BackContentTemplate的C1SlideTile控件，ContentTemplate决定了初始内容和控件的外观，BackContentTemplate决定了控件改变时控件的内容和外观。（在C1SlideTile情况下，它从一个模板滑向另一个模板）。

7. 在C1SlideTile下面添加以下标记：

   XAML

   <c1:C1SlideTile Content="3" BackContent="Back Content 3" FontSize="36" Header="C1SlideTile" HeaderPadding="12" Padding="0"/> <c1:C1SlideTile Content="4" Header="C1SlideTile, SlideDirection = Right" HeaderPadding="12" Padding="0" SlideDirection="Right" HorizontalHeaderAlignment="Right"/> <c1:C1SlideTile Content="5" Header="C1SlideTile" />

   此标记添加了额外的C1Slide控件。
   在此步中您添加WPF及及Silverlight版版Tiles控件到您的应用中。在下一步中，您将运行应用程序并看到它的实时呈现。
   第三步：运行Tiles应用程序在上一步中，您创建了一个WPF应用并添加和定制了WPF及及Silverlight版版Tile控件，接下来您将运行您的应用程序。

8. 选择调试|启动调试来运行您的应用程序，运行结果会与以下情形相似：

注意在上图显示的红色的C1SlideTile采用的是ContentTemplate,当瓷贴转变为BackContentTempate时，它会变为绿色。

1. 观察每个控件的行为，C1SlideTiles在内容选择时会出现滑动效果。
2. 观察到一些C1SlideTile控件的滑动会有不同的方向，您可以通过更改SlildeDirection属性来设置方向。

恭喜您！您已经完成了C1Tiles控件的快速入门，在接下来的文档中，您将了解更多如何使用WPF及及Silverlight版版
Tiles控件的相关信息。