原文:WPF仿酷狗页面

版权声明:本文为博主原创文章,如需转载请标明转载地址 http://blog.csdn.net/u013981858 https://blog.csdn.net/u013981858/article/details/49131047

跟第一个一样真的做的不好刚开始学,很多都不懂,用懂的东西做的以后会慢慢完善!废话不多说,放图

下面放代码:

资源词典Button.xmal

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="ListLeftButton1" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01226[46x62x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01227[46x62x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01228[46x62x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="ListLeftButton2" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01209[46x62x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01210[46x62x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01211[46x62x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="ListLeftButton3" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01229[46x62x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01230[46x62x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01231[46x62x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="ListLeftButton4" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01215[46x62x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01216[46x62x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01217[46x62x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="ListLeftButton5" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01212[46x62x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01213[46x62x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01214[46x62x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="ListLeftButton6" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01412[46x62x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01413[46x62x4BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01414[46x62x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="LittleButton1" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/skin_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/skin_hot.png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/skin_down.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="LittleButton2" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/play_game_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/play_game_hot.png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/play_game_down.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="LittleButton3" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00567[26x28x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin\00568[26x28x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin\00568[26x28x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="LittleButton4" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/min_normal.bmp"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin\min_hot.bmp"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin\min_down.bmp"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="LittleButton5" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/menu_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin\menu_hot.png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin\menu_down.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="CloseButton" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/close_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/close_hot.png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/close_down.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="TopButton1" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/Lyric_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/Lyric_hot.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/Lyric_down.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="TopButton2" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/pre_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/pre_hot.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/pre_down.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="TopButton3" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/next_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/next_hot.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/next_down.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="TopButton4" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/play_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/play_hot.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/pause_normal.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton1" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00120[34x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00121[34x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00122[34x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton2" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00124[34x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00125[34x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00126[34x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton3" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00977[80x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00978[80x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00979[80x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton4" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01081[80x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01082[80x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01083[80x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton5" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00711[80x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00712[80x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00713[80x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="RightButton6" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00386[80x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00387[80x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00388[80x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton7" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01845[80x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01846[80x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01847[80x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="RightButton8" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/00165[80x50x8BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00166[80x50x8BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/00167[80x50x8BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="ListButton" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/01944[26x22x2BPP].png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01946[26x22x2BPP].png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/01945[26x22x2BPP].png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>

资源词典MySlider.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<LinearGradientBrush x:Key="SliderThumb" StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="0" Color="#FFD9D3E8"/>
<!--<GradientStop Offset="1" Color="#dfdfdf"/>-->
</LinearGradientBrush> <!--Slider模板-->
<Style x:Key="Slider_RepeatButton" TargetType="RepeatButton">
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RepeatButton">
<Border>
<Border.Background>
<ImageBrush ImageSource="skin\SliderForeVolume.png"/>
</Border.Background>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="Slider_RepeatButton1" TargetType="RepeatButton">
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RepeatButton">
<Border Background="Transparent" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="Slider_Thumb" TargetType="Thumb">
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Thumb">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Border>
<Border.Background>
<ImageBrush ImageSource="skin\SliderForeVolume.png"/>
</Border.Background>
</Border>
<Ellipse Fill="{StaticResource SliderThumb}" Width="15" Height="15"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style x:Key="Slider_CustomStyle" TargetType="Slider">
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Slider">
<Grid>
<!--<Grid.Effect>
<DropShadowEffect BlurRadius="10" ShadowDepth="1" />
</Grid.Effect>-->
<Border Grid.Column="1">
<Border.Background>
<ImageBrush ImageSource="skin\SliderBackVolume.png"/>
</Border.Background>
<Track Grid.Column="1" Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Style="{StaticResource Slider_RepeatButton}"
Command="Slider.DecreaseLarge"/>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Style="{StaticResource Slider_RepeatButton1}"
Command="Slider.IncreaseLarge"/>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource Slider_Thumb}"/>
</Track.Thumb>
</Track>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> </ResourceDictionary>

词典调用App.xaml

<Application x:Class="WpfApplication6.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Button.xaml"></ResourceDictionary>
<ResourceDictionary Source="MySlider.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>

自定义控件SearchBox.xaml

<UserControl x:Class="WpfApplication6.SearchBox"
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"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
<Style x:Key="SearchBoxButton" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle">
<Rectangle.Fill>
<ImageBrush ImageSource="skin/Search_normal.png"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsFocused" Value="True"/>
<Trigger Property="IsDefaulted" Value="True"/>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/Search_hot.png"/>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle">
<Setter.Value>
<ImageBrush ImageSource="skin/Search_down.png"></ImageBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsEnabled" Value="False"/>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="SearchBox" TargetType="{x:Type TextBox}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid Height="27">
<Border
Width="220" Height="27" HorizontalAlignment="Right"
Background="White" Opacity="0.3" CornerRadius="5" BorderThickness="1" BorderBrush="Black" VerticalAlignment="Center">
<TextBox FontFamily="宋体" Background="{x:Null}" BorderThickness="0" FontSize="14" Width="210" Height="18" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="0,4,0,0"></TextBox>
</Border>
<Button Height="Auto" Width="30" Style="{StaticResource SearchBoxButton}" HorizontalAlignment="Right" Margin="0,0,0,1" ></Button>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<StackPanel>
<TextBox Style="{StaticResource SearchBox}"/>
</StackPanel>
</UserControl>

MainWindow.xmal

<Window x:Class="WpfApplication6.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:loc="clr-namespace:WpfApplication6"
Title="MainWindow" Height="660" Width="1000" AllowsTransparency="True" WindowStyle="None" MouseDown="Window_MouseDown">
<DockPanel>
<DockPanel.Background>
<ImageBrush ImageSource="pack://siteoforigin:,,,/back.png"/>
</DockPanel.Background>
<Grid DockPanel.Dock="Top" Height="120">
<TextBlock FontSize="12" Foreground="White" Margin="15,10,936,86">酷酷音乐</TextBlock>
<StackPanel Margin="15,34,650,0" Orientation="Vertical">
<Slider Style="{StaticResource Slider_CustomStyle}" Height="20" Margin="15,5"/>
<StackPanel Height="45">
<Button Height="30" Width="30" Style="{StaticResource TopButton1}" Margin="5,20,300,-8"/> <StackPanel Margin="90,-45,95,0" Orientation="Horizontal">
<Button Height="40" Width="40" Style="{StaticResource TopButton2}" Margin="0,0,10,0"/>
<Button Height="50" Width="50" Style="{StaticResource TopButton4}" Margin="0,0,10,0"/>
<Button Height="40" Width="40" Style="{StaticResource TopButton3}" Margin="0,0,0,0"/>
</StackPanel> </StackPanel>
</StackPanel>
<StackPanel Margin="350,0,0,66" Orientation="Horizontal" VerticalAlignment="Center">
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" Height="25" Margin="40,14,0,15">
<TextBlock FontSize="12" Foreground="White" VerticalAlignment="Center" Text="登陆 "></TextBlock>
<TextBlock Foreground="White" Width="3" VerticalAlignment="Center" Text="|"></TextBlock>
<TextBlock FontSize="12" Foreground="White" VerticalAlignment="Center" Text=" 注册"></TextBlock>
</StackPanel>
<StackPanel Margin="5" VerticalAlignment="Center">
<Image Width="29" Height="29" Source="skin/00259[29x29x8BPP].png" />
</StackPanel>
<loc:SearchBox Height="29" Margin="20,0,0,0"></loc:SearchBox>
<StackPanel VerticalAlignment="Center" Margin="60,0,0,0" Orientation="Horizontal">
<Button Width="52" Height="18" Style="{StaticResource LittleButton2}" Margin="3,0"></Button>
<Button Width="26" Height="28" Style="{StaticResource LittleButton3}" Margin="3,0"></Button>
<Button Width="23" Height="18" Style="{StaticResource LittleButton1}" Margin="3,0"></Button>
<Button Width="21" Height="19" Style="{StaticResource LittleButton4}" Margin="20,0,5,0"></Button>
<Button Width="23" Height="23" Style="{StaticResource CloseButton}" Click="Button_Click"></Button>
</StackPanel>
</StackPanel>
<StackPanel Height="60" Width="600" Margin="380,59,0,1" Orientation="Horizontal">
<Button Width="34" Height="50" Style="{StaticResource RightButton1}" Margin="0,0,15,0"></Button>
<Button Width="34" Height="50" Style="{StaticResource RightButton2}"></Button>
<Button Width="80" Height="55" Style="{StaticResource RightButton3}"></Button>
<Button Width="80" Height="55" Style="{StaticResource RightButton4}"></Button>
<Button Width="80" Height="55" Style="{StaticResource RightButton5}"></Button>
<Button Width="80" Height="55" Style="{StaticResource RightButton6}"></Button>
<Button Width="80" Height="55" Style="{StaticResource RightButton7}"></Button>
<Button Width="80" Height="55" Style="{StaticResource RightButton8}"></Button>
</StackPanel>
</Grid>
<StackPanel DockPanel.Dock="Left" Width="50">
<Button Style="{StaticResource ListLeftButton1}" Width="46" Height="62"/>
<Button Style="{StaticResource ListLeftButton2}" Width="46" Height="62"/>
<Button Style="{StaticResource ListLeftButton3}" Width="46" Height="62"/>
<Button Style="{StaticResource ListLeftButton4}" Width="46" Height="62"/>
<Button Style="{StaticResource ListLeftButton5}" Width="46" Height="62"/>
<Button Style="{StaticResource ListLeftButton6}" Width="46" Height="62"/>
</StackPanel>
<StackPanel DockPanel.Dock="Left" Width="300" Margin="0,0,0,33">
<StackPanel.Background>
<SolidColorBrush Color="White" Opacity="0.4"/>
</StackPanel.Background>
<StackPanel Height="26" Background="White" Opacity="0.4" Orientation="Horizontal">
<Image Source="skin\ListDown.png" Height="26" Width="26" Margin="10,0,0,0"></Image>
<Button Height="26" Width="22" Style="{StaticResource ListButton}" Margin="220,0,0,0"></Button>
</StackPanel> </StackPanel>
<Grid DockPanel.Dock="Right" Width="650" Height="507" VerticalAlignment="Top" Background="White"></Grid>
</DockPanel>
</Window>

图片资源有需要的可以Q我499952350,今天到这里!

WPF仿酷狗页面的更多相关文章

  1. 仿酷狗音乐播放器开发日志二十四 选项设置窗体的实现(附328行xml布局源码)

    转载请说明原出处,谢谢~~ 花了两天时间把仿酷狗的选项设置窗体做出来了,当然了只是做了外观.现在开学了,写代码的时间减少,所以整个仿酷狗的工程开发速度减慢了.今天把仿酷狗的选项设置窗体的布局代码分享出 ...

  2. Redrain仿酷狗音乐播放器开发完毕,发布测试程序

    转载请说明原出处,谢谢~~ 从暑假到现在中秋刚过,我用duilib开发仿酷狗播放器大概经历了50天.做仿酷狗的意图只是看原酷狗的界面比较漂亮,想做个完整一些的工程来练习一下duilib.今天把写好的程 ...

  3. 仿酷狗音乐播放器开发日志二十七 用ole为窗体增加文件拖动功能(附源码)

    转载请说明原出处,谢谢~~ 中秋到了,出去玩了几天.今天把仿酷狗程序做了收尾,已经开发完成了,下一篇博客把完结的情况说一下.在这篇博客里说一下使用OLE为窗体增加文件拖拽的功能.使用播放器,我更喜欢直 ...

  4. 仿酷狗音乐播放器开发日志二十六 duilib在标题栏弹出菜单的方法

    转载请说明原出处,谢谢~~ 上篇日志说明了怎么让自定义控件响应右键消息.之后我给主窗体的标题栏增加右键响应,观察原酷狗后可以发现,在整个标题栏都是可以响应右键并弹出菜单的.应该的效果如下: 本以为像上 ...

  5. 仿酷狗音乐播放器开发日志二十五 duilib右键事件的不足的bug修复

    转载请说明原出处,谢谢~~ 虽然仿酷狗的各个菜单早就写好了,但是一直没有附加到程序里.今天把菜单和播放列表控件关联时发现了问题. 和播放列表相关的菜单有三个,分别是每个音乐项目控件相关的菜单.分组的菜 ...

  6. 仿酷狗音乐播放器开发日志二十三 修复Option控件显示状态不全的bug(附源码)

    转载请说明原出处,谢谢~~ 整个仿酷狗工程的开发将近尾声,现在还差选项设置窗体的部分,显然在设置窗体里用的最多的就是OptionUI控件,我在写好大致的布局后去测试效果,发现Option控件的显示效果 ...

  7. 仿酷狗音乐播放器开发日志十九——CTreeNodeUI的bug修复二(附源码)

    转载请说明原出处,谢谢 今天本来打算把仿酷狗播放列表的子控件拖动插入功能做一下,但是仔细使用播放列表控件时发现了几个逻辑错误,由于我的播放 列表控件是基于CTreeViewUI和CTreeNodeUI ...

  8. Android耳机线控具体解释,蓝牙耳机button监听(仿酷狗线控效果)

    转载请注明出处:http://blog.csdn.net/fengyuzhengfan/article/details/46461253 当耳机的媒体按键被单击后.Android系统会发出一个广播.该 ...

  9. 仿酷狗音乐播放器开发日志十一——CTreeNodeUI的bug修复

    由于做播放列表控件,我的CMusicLength控件继承了CTreeVieWUI控件,在向分组控件中添加播放项目时,发现代码无法正常工作,调用CTreeNodeUI控件的Add方法后无反应,导致我的播 ...

随机推荐

  1. ssh配置解释

    http://vbird.dic.ksu.edu.tw/linux_server/0310telnetssh_2.php /etc/ssh/sshd_config Port 29922 #Addres ...

  2. 关于VisualStudio2010发布项目问题

    VisualStudio2010速度还是很给力的,VS2015打开机器就双100%了:VS2010机器上跑起来还是很好用的. 今天编译一个MVC3.0项目,发布时候出现诡异现象:Content文件夹里 ...

  3. MySQL免安装版中 my-default.ini 的配置

    拷贝一份  “my-default.ini”  文件 重命名为 “my.ini” 这样根目录下就有两个.ini文件了 一个是my-default.ini 一个是my.ini 接下来我们只需修改my.i ...

  4. Sundy_Android开发深入浅出和高级开发视频教程

    Sundy_Android开发深入浅出和高级开发视频教程 放于播音员的网盘中又名:android零基础到高级软件开发工程师培训课程全集(400多讲) 1.课程介绍 2.java重点难点 3.版本控制- ...

  5. 西门子 SINAMICS S120 Web server 用户名和默认密码

    sinamics web server可以通过浏览器查看驱动器故障等信息,是一个比较方便的辅助工具. 1. 一般用户 SINAMICS 密码 无 2. 管理员 Administrator 密码 Adm ...

  6. Hybris开发环境的license计算实现

    每隔30天,必须重新执行一次initialize命令把本地所有数据全部清掉然后重新build,需要花费一些时间. 显示在console里的license信息通过license.jsp展示: 剩余的li ...

  7. Uva 10820 交表

    题目链接:https://uva.onlinejudge.org/external/108/10820.pdf 题意: 对于两个整数 x,y,输出一个函数f(x,y),有个选手想交表,但是,表太大,需 ...

  8. JAVA_Converter_字符串类型转Date类型

    我们知道数据库中的时间一般为Date类型,而前台传递过来的为字符串,BeanUtils在封装数据的时候,没有将类型转换,导致报异常... 我们只需要在封装数据之前,使用自定义转换器即可: 代码如下: ...

  9. JQuery基础原理 与实例 验证表单 省市联动 文本框判空 单选 复选 判空 下拉判空 确认密码判等

    JQuery 基础原理 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  10. vue项目不能同时被localhost和ip地址同时访问的方法

    方法1.将index.js中的host的值改为‘0.0.0.0’ 方法2.修改package.json中script下dev的值,在后面加入--host 0.0.0.0 也可以解决