WPF仿酷狗页面

于 2015-10-14 21:13:21 发布
阅读量2.4k 收藏 7
点赞数 5
分类专栏： WFP 文章标签： WPF C#
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：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，今天到这里！

CFirst
关注
  • 5
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值