WPF的Popup背景色为透明时变成黑色问题

在WPF中,当Popup的背景色设为透明时,可能会遇到实际显示为黑色的问题。解决此问题的方法是将Popup的AllowsTransparency属性设置为True。

解决方案:

将Popup的AllowsTransparency设置为True即可解决

    <!-- QujiaoComboxItemStyle:下拉控件选中样式 -->
    <Style TargetType="{x:Type ComboBoxItem}" x:Key="QujiaoComboBoxItemStyle">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                    <Border x:Name="Bd">
                        <ContentPresenter/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="true">
                            <Setter Property="Background" TargetName="Bd" Value="#4e97ff"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Background" TargetName="Bd" Value="#4e97ff"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <!-- QujiaoComboxStyle:下拉控件样式 -->
    <Style TargetType="{x:Type ComboBox}" x:Key="QujiaoComboBoxStyle">
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
        <Setter Property="Foreground" Value="White"></Setter>
        <Setter Property="Background" Value="White"></Setter>
        <Setter Property="ItemContainerStyle" Value="{StaticResource QujiaoComboBoxItemStyle}"></Setter>
        <Setter Property="Margin" Value="2,5,2,5"></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBox}">
                    <Border BorderBrush="#2de4b9" BorderThickness="1" CornerRadius="5" Background="White" >
                        <Grid>
                            <!-- 下拉控件 -->
                            <ToggleButton ClickMode="Press" Focusable="False"
                                          IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}">
                                <ToggleButton.Template>
                                    <ControlTemplate  TargetType="{x:Type ToggleButton}">
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="8*"/>
                                                <ColumnDefinition Width="2*"/>
                                            </Grid.ColumnDefinitions>
                                            <Border Grid.Column="0" CornerRadius="4,0,0,4" Width="Auto" Height="Auto">
                                                <Border.Background>
                                                    <SolidColorBrush Color="White" />
                                                </Border.Background>
                                            </Border>
                                            <!--下拉箭头-->
                                            <Border Grid.Column="1" CornerRadius="0,4,4,0" Width="Auto" Height="Auto">
                                                <Border.Background>
                                                    <SolidColorBrush Color="#2de4b9" />
                                                </Border.Background>
                                                <Path Data="M 0,0 L 3.5,4 7,0 z" Fill="White" 
                                                      Width="Auto"
                                                      HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                            </Border>
                                        </Grid>
                                    </ControlTemplate>
                                </ToggleButton.Template>
                            </ToggleButton>
                            <!-- 选项内容 -->
                            <ContentPresenter Margin="0,0,15,0" IsHitTestVisible="False" 
                                              HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                                              Content="{TemplateBinding SelectionBoxItem}" 
                                              ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
                                              ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"/>
                            <!-- 
                            下拉显示面板HorizontalOffset:设置下拉面板的相对位置
                            注意!Popup的Grid要设置Margin才看得到阴影
                            -->
                            <Popup HorizontalOffset="-85" VerticalOffset="5"
                                   Width="Auto"  AllowsTransparency="True"
                                   IsOpen="{TemplateBinding IsDropDownOpen}" 
                                   Focusable="False"  PopupAnimation="Slide" >
                                <Grid SnapsToDevicePixels="True" 
                                      HorizontalAlignment="Stretch" 
                                      Margin="20,0,20,20">
                                    <Border  CornerRadius="5" BorderThickness="1" Background="White" HorizontalAlignment="Stretch" >
                                        <Border.Effect>
                                            <DropShadowEffect Color="Black" BlurRadius="10" ShadowDepth="0" Opacity="0.4" Direction="0"></DropShadowEffect>
                                        </Border.Effect>
                                        <ScrollViewer SnapsToDevicePixels="True" HorizontalAlignment="Stretch" >
                                            <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" HorizontalAlignment="Stretch" />
                                        </ScrollViewer>
                                    </Border>
                                </Grid>
                            </Popup>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

 

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值