唉。。。先吐槽一下,公司做自己的播放器 ,目的是解決快播升級帶來的“合法性”(如果你不懂。。。那。。。那當我沒說)。因為公司內部本身就沒有相關的技術人員,所以只能是自己邊摸索邊開發。
實現的是一款基於BT協議的P2P 播放器。內核是用vlc來實現。結果辛辛苦苦做了半天結果發現用wpf不能滿足公司一些需求。TMD,我又不得不吐槽了。事先不制定開發需求文檔,就只曉得給壓力 T.T ,為難我們碼農。所以擱淺,專用winform去開發,主要2個原因:1,界面美觀時發現渲染視頻的時候會有問題,這個問題等會會講。2,(主要原因)如果wpf這個程序開發完成是不能內嵌到網頁的。因為后續還要要開發IE ActiveX 插件。然后總監就說:那就不用wpf了,轉用winform。 我只能呵呵!呵呵呵呵!
wpf我一竅不通,之前完全沒接觸過。做出這個效果已是我最大能力了。(專業人員請用看小白的態度)

ok,這里說下第一個問題,在渲染視頻的時候會發現只有聲音,沒有畫面,在我找了2天問題之后發現是因為界面用了AllowsTransparency="True" WindowStyle="None" 這段屬性的修改。如果修改一下AllowsTransparency="False" WindowStyle="XXX"(除了不是None之外的都可以)。則就變成這樣了。
仔細看,會多了個邊框。只有這樣,畫面才能出來。 這里可能只有自己重繪這個界面元素。希望有人能指教一下。
這里我會將這個界面的項目打包上傳,點擊這里下載。(有點大,含有vlc的dll文件)因為去掉了WindowStyle,鼠標在邊框進行縮放效果和最大化處理以及多顯示器上的兼容都要自己來實現。項目都會有,我其他文章也有對這些技術點進行部分的講解,這個就自己去看啦。連接就不打了。
<!--音量滾珠-->
<Style TargetType="Thumb" >
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Thumb">
<Grid>
<vsm:VisualStateManager.VisualStateGroups>
<vsm:VisualStateGroup x:Name="CommonStates">
<vsm:VisualStateGroup.Transitions>
<vsm:VisualTransition GeneratedDuration="0:0:0.1" To="MouseOver"/>
<vsm:VisualTransition GeneratedDuration="0:0:0.1" To="Pressed"/>
</vsm:VisualStateGroup.Transitions>
<vsm:VisualState x:Name="Normal"/>
<vsm:VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Down" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" BeginTime="00:00:00" Duration="00:00:00.0010000">
<SplineColorKeyFrame KeyTime="00:00:00" Value="#004486B6"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Down" Storyboard.TargetProperty="(UIElement.Opacity)" BeginTime="00:00:00" Duration="00:00:00.0010000">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</vsm:VisualState>
<vsm:VisualState x:Name="Pressed">
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Down" Storyboard.TargetProperty="(UIElement.Opacity)" BeginTime="00:00:00" Duration="00:00:00.0010000">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</vsm:VisualState>
<vsm:VisualState x:Name="Disabled">
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Disabled" Storyboard.TargetProperty="(UIElement.Opacity)" BeginTime="00:00:00" Duration="00:00:00.0010000">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</vsm:VisualState>
</vsm:VisualStateGroup>
</vsm:VisualStateManager.VisualStateGroups>
<Ellipse x:Name="Down" Grid.Column="0" Width="15" Height="15" StrokeThickness="0.5" Opacity="0.1" Fill="#FF4486B6" Margin="0,0,0,0">
<Ellipse.Stroke>
<LinearGradientBrush EndPoint="0.507,-1.856" StartPoint="0.507,1.515">
<GradientStop Color="#FF4E5F70" Offset="0"/>
<GradientStop Color="#FFF6F7FA" Offset="1"/>
</LinearGradientBrush>
</Ellipse.Stroke>
</Ellipse>
<!--音量的滾珠-->
<Ellipse x:Name="VolBackground" Grid.Column="0" Width="12" Height="12" StrokeLineJoin="Round" StrokeThickness="1.6" Opacity="0.9" Stroke="#00232425">
<Ellipse.Fill>
<LinearGradientBrush EndPoint="0.5,0" StartPoint="0.5,1">
<GradientStop Color="#66B3FF" Offset="0.3"/>
<GradientStop Color="#FF6AC2F3" Offset="1"/>
</LinearGradientBrush>
</Ellipse.Fill>
</Ellipse>
<Path x:Name="WhiteBubble" Grid.Column="0" Width="6" Height="2" Stretch="Fill" StrokeLineJoin="Round" StrokeThickness="1.8" Data="M4.2160064,2.8920099 C4.2160064,1.7874404 5.1114369,1.7153466 6.2160064,1.7153466 L22.679308,1.7153466 C23.783877,1.7153466 24.679308,1.7874404 24.679308,2.8920099 24.679308,2.8920099 4.2160064,2.8920099 4.2160064,2.8920099 z" Margin="0,0,0,7.5" VerticalAlignment="Stretch" Opacity="0.5">
<Path.Stroke>
<!--滾珠亮點色-->
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFFFFFFF" Offset="0.5"/>
<GradientStop Color="#FFCDCDCD" Offset="1"/>
</LinearGradientBrush>
</Path.Stroke>
</Path>
<Ellipse x:Name="DisabledOverlay" Width="11" Height="10.5" StrokeLineJoin="Round" StrokeThickness="0.5" Opacity="0" Stroke="#B2FFFFFF" Margin="1.5,233.25,1.5,233.25" Fill="#B2FFFFFF"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsFocused" Value="True"/>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Cursor" TargetName="VolBackground" Value="Hand"></Setter>
<Setter Property="Stroke" TargetName="VolBackground" >
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,0" StartPoint="0.5,1">
<GradientStop Color="#2894FF" Offset="0.3"/>
<GradientStop Color="#66B3FF" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="Stroke" TargetName="WhiteBubble">
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FCFCFC" Offset="0.6"/>
<GradientStop Color="#FFECEC" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsEnabled" Value="False"/>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
這個是要利用到WPFToolkit.dll的引用才可以。像這些界面控件的美化一般是用Blend工具來做的。我都是代碼Copy一些,然后修改一些。 ^.^ 親,代碼要會抄哦。當然了,前提你得懂。這樣也是一種學習
好了,今天就到這里。各位五一快樂!
