0

我有一个基本的 WPF 窗口，其标记如下：

<Window x:Class="Application.SomeWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="SomeWindow"
        Topmost="True" WindowStyle="None" Height="39" Width="400"
        ResizeMode="NoResize" ShowInTaskbar="False"
        WindowStartupLocation="Manual" Background="Transparent"
        Closing="Window_Closing" AllowsTransparency="True" Opacity="0">
   <Border Background="CornflowerBlue" BorderBrush="Black" BorderThickness="0,0,0,0" CornerRadius="5,5,5,5" Opacity="0.75">
      <Grid>
         <!-- Display bar -->
         <Image Grid.Row="1" Height="24" Margin="7,7,0,0" Name="img1" Stretch="Fill" VerticalAlignment="Top" Source="/Application;component/Images/dashboard/1.png" HorizontalAlignment="Left" Width="13" />
         <Image Height="24" Margin="19,7,47,0" Name="image21" Source="/Application;component/Images/dashboard/2.png" Stretch="Fill" VerticalAlignment="Top" Grid.Row="1" Grid.ColumnSpan="2" />
         <!-- Button 1 -->
         <Button Style="{DynamicResource NoChromeButton}" Height="27" Margin="0,5,25,0" Name="btn1" Click="btn1_Click" VerticalAlignment="Top" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Right" Width="23" ToolTip="1">
            <Image Height="26" HorizontalAlignment="Right"  Name="img1" Source="/Application;component/Images/dashboard/3.png" VerticalAlignment="Top" Width="22" Stretch="Fill" />
         </Button>
         <!-- Button 2 -->
         <Button Style="{DynamicResource NoChromeButton}" Height="27" Margin="0,5,5,0" Name="btn2" Click="btn2_Click" VerticalAlignment="Top" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Right" Width="23" ToolTip="2">
            <Image Height="26" HorizontalAlignment="Right"  Name="img2" Source="/Application;component/Images/dashboard/4.png" VerticalAlignment="Top" Width="22" Stretch="Fill" />
         </Button>
      </Grid>
   </Border>
</Window>

这是它现在的样子：

当前如何在视觉上呈现。

我真正想做的是让它最初看起来像这样：

在此处输入图像描述

然后，一旦发生鼠标悬停，将背景不透明度从 0 淡入，使其看起来像第一张图像。问题是，如果我将BorderorGrid Background颜色设置Transparent为目标是在鼠标悬停时淡入，那么 or 中的所有内容也会受到影响。BorderGrid

有没有办法分别管理窗口及其 UI 元素的不透明度？或者也许有一个完全不同的方法可以让这个背景在鼠标悬停时褪色？谢谢。

4

2 回答 2

0

试试这个技巧 - 绘制一个矩形或边框，其尺寸绑定到父级或 ElementName。它不会影响树的其余元素。为我工作。

<Grid x:Name="abc">
                <Border
                    Width="{Binding ActualWidth, ElementName=abc}"
                    Height="{Binding ActualHeight, ElementName=abc}"
                    Background="Blue"
                    Opacity="0.5"/>
                //buttons or inner grid
                  ...
</Grid>

如果您不想使用 ElementName，只需将 Width 和 Height 替换为

Width="{Binding ActualWidth, Source={RelativeSource Mode=FindAncestor, AncestorType=Grid}}"
Height="{Binding ActualHeight, Source={RelativeSource Mode=FindAncestor, AncestorType=Grid}}"
于 2013-10-21T17:30:08.847 回答
0

有两种选择。第一个是只移动网格内的外边框，作为第一个子项（并在其旁边放置其他控件，而不是在其中）。这样它会自行消失，但仍然落后于其他控件。当然，您要么必须设置ColumnSpan/ RowSpan，要么将整个东西包装在另一个Grid.

第二个选项是只淡化背景，而不是整个边框：

<Border ...>
    <Border.Background>
        <SolidColorBrush Color="CornflowerBlue" Opacity="0.5"/>
    </Border.Background>
    ...
于 2013-10-21T16:54:44.490 回答