wpf+.net 4.5 surface2.0 = 异步多点触控 时间轴 part5

可使用多种方式将事件（UserControl 或Window或其他UIElement）内容呈现 以下是2个例子：

视频方式：

 

<UserControl xmlns:s="http://schemas.microsoft.com/surface/2008"  x:Class="Transvalue.Timeline.EventVideoControlItem"             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"                 xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"             mc:Ignorable="d"             Width="600" Height="600">    <i:Interaction.Behaviors>        <ei:TranslateZoomRotateBehavior/>    </i:Interaction.Behaviors>    <Grid Width="600" Height="600">        <Grid.Background>            <ImageBrush ImageSource="../Images/dyck.png"/>        </Grid.Background>        <Grid.RowDefinitions>            <RowDefinition Height="83*"/>            <RowDefinition Height="343*"/>            <RowDefinition Height="174*"/>        </Grid.RowDefinitions>        <TextBlock x:Name="tbTitle" HorizontalAlignment="Left"                            Margin="218,46,0,0" TextWrapping="Wrap"                            Text="" VerticalAlignment="Top"                           Height="32" Width="190"                            FontFamily="/Transvalue.Timeline;component/Fonts/#Segoe UI Light"                            FontSize="22" Foreground="White"/>        <TextBlock x:Name="tbContent" HorizontalAlignment="Left"                            Margin="108,0,0,0" TextWrapping="Wrap"                            Text="" VerticalAlignment="Top"                    Height="97" Width="376" FontFamily="/Transvalue.Timeline;component/Fonts/#Segoe UI Light" Foreground="White" FontSize="20" Grid.Row="2"/>        <MediaElement HorizontalAlignment="Left" Height="303" Margin="69,19,0,0"                       VerticalAlignment="Top" Width="451"                       Name="mediaContainer" LoadedBehavior="Manual" Grid.Row="1" ScrubbingEnabled="True" Stretch="Fill"/>    </Grid></UserControl>

 

 

using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using System.Windows;using System.Windows.Controls;using System.Windows.Data;using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Imaging;using System.Windows.Navigation;using System.Windows.Shapes;using Microsoft.Surface.Presentation.Controls;namespace Transvalue.Timeline{    /// <summary>    /// EventVideoControlItem.xaml 的交互逻辑    /// </summary>    public partial class EventVideoControlItem : UserControl    {        public EventVideoControlItem()        {            InitializeComponent();            this.DataContextChanged += ((sender, e) =>              {                  if (null != this.DataContext)                  {                      Console.WriteLine("开始赋值");                      TimelineEventItem item = this.DataContext as TimelineEventItem;                      tbContent.Text = item.Content;                      tbContent.ToolTip = item.Title;                      mediaContainer.Source = new Uri(item.MedieUrl);                      mediaContainer.MediaEnded += ((s, args) =>                        {                            Console.WriteLine("播完了");                            mediaContainer.Play();                        });                      mediaContainer.Play();                  }              });        }    }}

 

 

 

翻页书方式(书控件另行制作，会放到项目源码里到我的资源）：

<Custom:SurfaceWindow    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"     xmlns:Custom="http://schemas.microsoft.com/surface/2008"     xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"    xmlns:BookControl="clr-namespace:TransvalueSystem.Control.BookControl"     x:Class="Transvalue.Timeline.EventControlBookItem"     WindowStyle="None" Topmost="True"             mc:Ignorable="d" WindowState="Normal"    AllowsTransparency="True" Background="Transparent" WindowStartupLocation="CenterScreen"                 Height="600" Width="600">    <Window.Resources>        <ControlTemplate x:Key="ButtonControlTemplate" TargetType="{x:Type Button}">            <Grid Margin="0,0,0,0" Name="content" TouchDown="Button_TouchDown" TouchEnter="Button_TouchDown">                <Grid.Background>                    <ImageBrush ImageSource="../Images/gbdy.png" Stretch="None"/>                </Grid.Background>            </Grid>        </ControlTemplate>    </Window.Resources>    <i:Interaction.Behaviors>        <ei:FluidMoveBehavior />    </i:Interaction.Behaviors>    <Grid Margin="0,10,-6,-39">        <Grid.Background>            <ImageBrush ImageSource="../Images/dyck.png"/>        </Grid.Background>        <Grid.RowDefinitions>            <RowDefinition Height="0.138*"/>            <RowDefinition Height="0.572*"/>            <RowDefinition Height="0.29*"/>        </Grid.RowDefinitions>        <TextBlock x:Name="tbTitle" HorizontalAlignment="Left"                            Margin="218,46,0,0" TextWrapping="Wrap"                            Text="" VerticalAlignment="Top"                           Height="32" Width="190"                            FontFamily="/Transvalue.Timeline;component/Fonts/#Segoe UI Light"                            FontSize="22" Foreground="White"/>        <TextBlock x:Name="tbContent" HorizontalAlignment="Left"                            Margin="108,4,0,0" TextWrapping="Wrap"                            Text="" VerticalAlignment="Top"                    Height="81" Width="372" FontFamily="/Transvalue.Timeline;component/Fonts/#Segoe UI Light"                   Foreground="White" FontSize="20" Grid.Row="2"/>        <BookControl:BookViewer HorizontalAlignment="Left" Margin="58,10,0,7"                                 Grid.Row="1" Width="483" x:Name="imgContainer"                              />        <Button Content="Button" HorizontalAlignment="Left" Margin="531,46,0,0" VerticalAlignment="Top" Width="43" Height="37"                 Template="{DynamicResource ButtonControlTemplate}"                 RenderTransformOrigin="0.279,0.459" TouchDown="Button_TouchDown" TouchEnter="Button_TouchDown" Click="Button_Click"/>    </Grid></Custom:SurfaceWindow>

 

using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using System.Windows;using System.Windows.Controls;using System.Windows.Data;using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Imaging;using System.Windows.Navigation;using System.Windows.Shapes;using Microsoft.Surface.Presentation.Controls;namespace Transvalue.Timeline{    /// <summary>    /// EventControl.xaml 的交互逻辑    /// </summary>    public partial class EventControlBookItem : SurfaceWindow    {        public EventControlBookItem()        {            InitializeComponent();            this.DataContextChanged += ((sender, e) =>            {                if (null != this.DataContext)                {                    TimelineEventItem item = this.DataContext as TimelineEventItem;                    tbContent.Text = item.Content;                    tbContent.ToolTip = item.Title;                    imgContainer.BookPath = item.ImgUrl;                }            });        }        private void Button_TouchDown(object sender, TouchEventArgs e)        {            this.Close();        }        private void Button_Click(object sender, RoutedEventArgs e)        {            this.Close();        }    }}