sourcechord/FluentWPF

AcrylicWindow appears to ignore borderless properties

nathan-alden-hp opened this issue · 5 comments

I have these properties defined in my <Window> element: WindowStyle="None" ResizeMode="NoResize" SizeToContent="WidthAndHeight" Topmost="True". I get a borderless, non-resizable window, as I expect. However, when I switch to <fw:AcrylicWindow>, the window border reappears and the size is incorrect (I think the title length is expanding the horizontal size).

Before:

image

After (window title redacted):

image

The actual effect I am trying to achieve is a borderless window that appears as a circle with my logo in the middle. The circle should have the acrylic brush applied to it to show the contents behind the window. I have not been able to figure out how to accomplish this with FluentWPF.

image

XAML for the last screenshot:

<Window x:Class="..."
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:root="clr-namespace:..."
        mc:Ignorable="d"
        d:DataContext="{d:DesignInstance root:RootViewModel, IsDesignTimeCreatable=True}"
        WindowStyle="None" ResizeMode="NoResize" SizeToContent="WidthAndHeight" Topmost="True" Background="Transparent" AllowsTransparency="True">
  <Window.Resources>
    <ResourceDictionary>
      <Style TargetType="{x:Type Grid}">
        <Setter Property="Opacity" Value="0.8" />
        <Style.Triggers>
          <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Opacity" Value="1" />
          </Trigger>
        </Style.Triggers>
      </Style>
    </ResourceDictionary>
  </Window.Resources>
  <Grid>
    <Ellipse Fill="Gray" />
    <Image Margin="10" Width="64" Height="64" Source="../../Resources/Images/beehive.png" RenderOptions.BitmapScalingMode="Fant" IsHitTestVisible="False" />
  </Grid>
</Window>

try adding properties: fw:AcrylicWindowStyle="None"

That worked partially, but not completely. Unfortunately, it appears the AcrylicWindow class can't emulate what I did with Window to create the appearance of a round window:

ResizeMode="NoResize" SizeToContent="WidthAndHeight" AcrylicWindowStyle="None" AllowsTransparency="True" Background="Transparent" WindowStyle="None" BorderThickness="0"

image
Here's what I used to use to achieve the round window look:

ResizeMode="NoResize" SizeToContent="WidthAndHeight" AllowsTransparency="True" Background="Transparent" WindowStyle="None" BorderThickness="0"

image

I also tried the CreateEllipticRgn and SetWindowRgn trick but the region I set wasn't honored.

Hi @nathan-alden-hp
Sorry for responding so late.

Rounded window is not supported. see also #111.
FluentWPF uses SetWindowCompositionAttribute method, that applies acrylic effect to whole window region.
Currently there is no way to clip acrylic effect for rounded corner.

Rounded window is not supported in FluentWPF. But, the reported issue about size of window is unexpected behavior.

the window border reappears and the size is incorrect (I think the title length is expanding the horizontal size).

So that, only the issue about window size is fixed in FluentWPF 0.10.2.