none
WPF 控件玻璃效果 RRS feed

答案

  • Hi,

    你可以自定义控件的模版, 比如Button:

    GlassButton.xaml:

    <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <Style x:Key="GlassButton" TargetType="{x:Type Button}">
            <Setter Property="FontSize" Value="42" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border x:Name="ButtonBorder" 
                                CornerRadius="25,25,25,25" 
                                BorderThickness="4,4,4,4" 
                                Background="#AA000000"  
                                BorderBrush="#99FFFFFF"
                                RenderTransformOrigin="0.5,0.5">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*"/>
                                    <RowDefinition Height="1.7*"/>
                                </Grid.RowDefinitions>
                                <Border Grid.Row="0" CornerRadius="23,23,0,0">
                                    <Border.Background>
                                        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                            <GradientStop Color="#08FFFFFF" Offset="0"/>
                                            <GradientStop Color="#88FFFFFF" Offset="1"/>
                                        </LinearGradientBrush>
                                    </Border.Background>
                                </Border>
                                <ContentPresenter x:Name="ButtonContentPresenter"
                                    VerticalAlignment="Center"  
                                    Grid.RowSpan="2" 
                                    HorizontalAlignment="Center"/>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="RenderTransform" TargetName="ButtonBorder">
                                    <Setter.Value>
                                        <TransformGroup>
                                            <ScaleTransform ScaleX="0.9" ScaleY="0.9"/>
                                        </TransformGroup>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>

    在App.xaml中添加资源:

    <Application.Resources>
            <ResourceDictionary Source="GlassButton.xaml"/>
        </Application.Resources>

    使用方法:

    <Button Style="{DynamicResource GlassButton}" 
                    Height="91.456"
                    VerticalAlignment="Center" 
                    HorizontalAlignment="Center" 
                    Width="207.764">Button</Button>

    截图:


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年1月6日 6:50
    版主

全部回复

  • Hi,

    你可以自定义控件的模版, 比如Button:

    GlassButton.xaml:

    <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <Style x:Key="GlassButton" TargetType="{x:Type Button}">
            <Setter Property="FontSize" Value="42" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border x:Name="ButtonBorder" 
                                CornerRadius="25,25,25,25" 
                                BorderThickness="4,4,4,4" 
                                Background="#AA000000"  
                                BorderBrush="#99FFFFFF"
                                RenderTransformOrigin="0.5,0.5">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*"/>
                                    <RowDefinition Height="1.7*"/>
                                </Grid.RowDefinitions>
                                <Border Grid.Row="0" CornerRadius="23,23,0,0">
                                    <Border.Background>
                                        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                            <GradientStop Color="#08FFFFFF" Offset="0"/>
                                            <GradientStop Color="#88FFFFFF" Offset="1"/>
                                        </LinearGradientBrush>
                                    </Border.Background>
                                </Border>
                                <ContentPresenter x:Name="ButtonContentPresenter"
                                    VerticalAlignment="Center"  
                                    Grid.RowSpan="2" 
                                    HorizontalAlignment="Center"/>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="RenderTransform" TargetName="ButtonBorder">
                                    <Setter.Value>
                                        <TransformGroup>
                                            <ScaleTransform ScaleX="0.9" ScaleY="0.9"/>
                                        </TransformGroup>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>

    在App.xaml中添加资源:

    <Application.Resources>
            <ResourceDictionary Source="GlassButton.xaml"/>
        </Application.Resources>

    使用方法:

    <Button Style="{DynamicResource GlassButton}" 
                    Height="91.456"
                    VerticalAlignment="Center" 
                    HorizontalAlignment="Center" 
                    Width="207.764">Button</Button>

    截图:


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    2014年1月6日 6:50
    版主
  • 参考这篇文章

    http://wpftutorial.net/ExtendGlass.html

    可以将窗口玻璃化。

    如果只是想半透明,可以将窗体的背景颜色设置一定的透明度,并且允许透明AllowsTransparency="True"。

    2014年1月6日 7:46