Silverlight MediaElement視頻刻度問題

Question

我使用VSTS2008 + C＃創建基於ASP.Net Web應用程序的Silverlight應用程序。我只添加一行到默認的page.xaml來承載本地視頻，

這裏是XAML的內容，我希望它根據與網頁顯示區域相關的視頻寬高比進行縮放，所以我選擇Stretch =「Uniform」。

我做的另一個修改是默認自動生成aspx測試頁，明確指定寬度和高度（120 * 120）。我的問題是我發現只有部分視頻可以顯示。我的視頻原始大小爲1024 * 768，我認爲如果使用Uniform Stretch，無論Silverlight控件分配的網頁大小是多少，視頻都可以縮放並顯示所有內容。哪裏不對了？

順便說一句：我測試過，如果我使用的尺寸像512 * 384或256 * 192，所有視頻內容都可以顯示，它證明均勻拉伸不起作用？

代碼變化的aspx測試頁部分，

<asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SilverlightApplication1.xap" MinimumVersion="2.0.31005.0" Width="120" Height="120" /> 

這裏是page.xaml代碼，我只是增加了一個MediaElement的。

<UserControl x:Class="SilverlightApplication1.Page" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width="400" Height="300"> 
    <Grid x:Name="LayoutRoot" Background="White"> 
     <MediaElement Source="screen.wmv" Stretch="Uniform" /> 
    </Grid> 
</UserControl> 

EDIT 1：

我使用sl2viedoplayer（http://sl2videoplayer.codeplex.com/）時，即，僅視頻的一部分可以被顯示，即使我刪除用戶控件的大小達到了同樣的問題。任何想法有什麼不對？這裏是sl2videoplayer和相關的xaml文件的測試代碼的html部分。

<UserControl x:Class="VideoPlayer.Page" 
    xmlns="http://schemas.microsoft.com/client/2007" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:VideoPlayer="clr-namespace:VideoPlayer" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="610.369" d:DesignHeight="413"> 
    <UserControl.Resources> 
     <Storyboard x:Name="controlsIn"> 
      <DoubleAnimation BeginTime="00:00" Storyboard.TargetName="controlsContainer" From="0" To="1" Storyboard.TargetProperty="Opacity" /> 
      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="controlsContainer" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" BeginTime="00:00:00"> 
       <SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="-40"/> 
       <SplineDoubleKeyFrame KeyTime="00:00:00.7000000" Value="-35"/> 
      </DoubleAnimationUsingKeyFrames> 
     </Storyboard> 
     <Storyboard x:Name="controlsOut"> 
      <DoubleAnimation BeginTime="00:00" Storyboard.TargetName="controlsContainer" From="1" To="0" Storyboard.TargetProperty="Opacity" /> 
      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="controlsContainer" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" BeginTime="00:00:00"> 
       <SplineDoubleKeyFrame KeyTime="00:00:00" Value="-35"/> 
       <SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="0"/> 
      </DoubleAnimationUsingKeyFrames> 
     </Storyboard> 
    </UserControl.Resources> 
    <Grid x:Name="LayoutRoot"> 
     <Canvas x:Name="PlayIcon" Width="100" Height="100" Canvas.ZIndex="99" Cursor="Hand" MouseLeftButtonUp="PlayIcon_MouseLeftButtonUp"> 
      <Path Width="100" Height="100" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="#77000000" Data="F1 M 15,0L 85,0C 93.2843,0 100,6.71573 100,15L 100,85C 100,93.2843 93.2843,100 85,100L 15,100C 6.71573,100 0,93.2843 0,85L 0,15C 0,6.71573 6.71573,0 15,0 Z "/> 
      <Path Width="40.8182" Height="47.1328" Canvas.Left="34.6439" Canvas.Top="27.6003" Stretch="Fill" Fill="#FFFFFFFF" Data="F1 M 75.4621,51.1667L 34.6439,27.6003L 34.6439,74.7331L 75.4621,51.1667 Z "/> 
     </Canvas> 
     <Canvas x:Name="LargeSpinnerArea" Width="100" Height="100" Canvas.ZIndex="100" Visibility="Collapsed"> 
      <StackPanel Orientation="Vertical" HorizontalAlignment="Center"> 
       <VideoPlayer:spinner x:Name="BigBuffer" Width="100" Height="100" RenderTransformOrigin="0.5,0.5" > 
        <VideoPlayer:spinner.RenderTransform> 
         <TransformGroup> 
          <ScaleTransform ScaleX="4" ScaleY="4"/> 
          <SkewTransform/> 
          <RotateTransform/> 
          <TranslateTransform/> 
         </TransformGroup> 
        </VideoPlayer:spinner.RenderTransform> 
       </VideoPlayer:spinner> 
      </StackPanel> 
     </Canvas> 
     <Canvas x:Name="Thumbnail" Canvas.Top="0" Canvas.Left="0" Visibility="Collapsed" Canvas.ZIndex="98"> 
      <Image x:Name="ThumbnailImage" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stretch="UniformToFill" /> 
     </Canvas> 
     <StackPanel x:Name="LayoutRoot2" Margin="0" Background="#FF0D0A0A" Cursor="Hand" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
      <MediaElement HorizontalAlignment="Stretch" Margin="0,0,0,0" x:Name="mediaPlayer" Stretch="Uniform" VerticalAlignment="Stretch" AutoPlay="False"/> 
      <Grid Margin="-1,0,0,0" x:Name="controlsContainer" Height="35" RenderTransformOrigin="0.5,0.5"> 
       <Grid.RenderTransform> 
        <TransformGroup> 
         <ScaleTransform/> 
         <SkewTransform/> 
         <RotateTransform/> 
         <TranslateTransform Y="0"/> 
        </TransformGroup> 
       </Grid.RenderTransform> 
       <Rectangle Margin="0,0,0,0" Height="35" VerticalAlignment="Top" Fill="#97000000" Stroke="#00000000" RenderTransformOrigin="0.5,0.5"/> 
       <VideoPlayer:mediaControl Height="35" Margin="1,0,2,0" HorizontalAlignment="Stretch" VerticalAlignment="Top" x:Name="mediaControls" RenderTransformOrigin="0.5,0" Visibility="Visible"/> 
      </Grid> 
     </StackPanel> 
     </Grid> 
</UserControl> 



html code, 



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<!-- saved from url=(0014)about:internet --> 
<head> 
    <title>Silverlight Project Test Page </title> 

    <style type="text/css"> 
    html, body { 
    height: 100%; 
    overflow: auto; 
    } 
    body { 
    padding: 0; 
    margin: 0; 
    } 
    #silverlightControlHost { 
    height: 100%; 
    } 
    </style> 

    <script type="text/javascript"> 
     function onSilverlightError(sender, args) { 

      var appSource = ""; 
      if (sender != null && sender != 0) { 
       appSource = sender.getHost().Source; 
      } 
      var errorType = args.ErrorType; 
      var iErrorCode = args.ErrorCode; 

      var errMsg = "Unhandled Error in Silverlight 2 Application " + appSource + "\n" ; 

      errMsg += "Code: "+ iErrorCode + " \n"; 
      errMsg += "Category: " + errorType + "  \n"; 
      errMsg += "Message: " + args.ErrorMessage + "  \n"; 

      if (errorType == "ParserError") 
      { 
       errMsg += "File: " + args.xamlFile + "  \n"; 
       errMsg += "Line: " + args.lineNumber + "  \n"; 
       errMsg += "Position: " + args.charPosition + "  \n"; 
      } 
      else if (errorType == "RuntimeError") 
      {   
       if (args.lineNumber != 0) 
       { 
        errMsg += "Line: " + args.lineNumber + "  \n"; 
        errMsg += "Position: " + args.charPosition + "  \n"; 
       } 
       errMsg += "MethodName: " + args.methodName + "  \n"; 
      } 

      throw new Error(errMsg); 
     } 
    </script> 
</head> 

<body> 
    <!-- Runtime errors from Silverlight will be displayed here. 
This will contain debugging information and should be removed or hidden when debugging is completed --> 
<div id='errorLocation' style="font-size: small;color: Gray;"></div> 

    <div id="silverlightControlHost"> 
    <object data="data:application/x-silverlight," type="application/x-silverlight-2" width="500" height="240"> 
    <param name="source" value="ClientBin/VideoPlayer.xap"/> 
    <param name="onerror" value="onSilverlightError" /> 
    <param name="background" value="white" /> 
    <param name="initParams" value="cc=true,markers=true,markerpath=markers_movie21.xml,m=http://www.sonypictures.com/movies/21/video/trailer/21_trailer_high.asx" /> 
    <a href="http://go.microsoft.com/fwlink/?LinkID=115261" style="text-decoration: none;"> 
     <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/> 
    </a> 
    </object> 
    <iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe> 
    </div> 
</body> 
</html> 

Answer 1

的問題是，你的元素有WIDTH =「120」 HEIGHT =「120」 和你的Silverlight控件具有400×300 固定的大小。如果你把width和height屬性了用戶控件的它應該像你期望的那樣工作。