Рендеринг "за окном" хромированных блоков управления

У меня есть стиль, который удаляет обычный хром окна и заменяет его на стекло с аэроэффектом (код внизу).

Если вы посмотрите на указанную линию, я использую черный ящик, чтобы затемнить стекло, но остаюсь полупрозрачным (в примере, который я использовал для этого, использовался белый ящик для аналогичной цели). У меня проблема в том, что черный ящик появляется над блоками управления. Скриншоты окна с черным ящиком и без него...

(Блокнот включен для справки). Я хотел бы сделать окно темнее, но это сделало бы элементы управления непригодными для использования с моим текущим подходом. Также обратите внимание, как красное свечение зависло над X снаружи моей формы светло, а внутри нее темно.

Итак, мой конкретный вопрос... Как я могу заставить блоки управления отображаться поверх "фонового" слоя?

В целом, кажется, что должен быть лучший способ сделать это? Мне не нравится пытаться слишком много подражать, потому что слишком много крайних случаев.

То, чего я пытаюсь добиться, это окно (*, если оно работает сейчас):

  • Темный (не очень работает)
  • Обычные 3 кнопки управления (вероятно, работают, если не для вышеупомянутых)
  • Изменение размера *
  • Возможность перетаскивания с использованием области заголовка *
  • Полупрозрачный *
  • Нет "контрольной" границы между Chrome и моим окном *

Я упоминаю этот список только для того, чтобы вы знали, что мне нужно делать с любым решением. Я использую.Net 4.5, что означает System.Shell.ChromeWindow включен в фреймворк, но, похоже, немного отличается от старых версий, упомянутых в каждом уроке, который я могу найти.

Может кто-нибудь, пожалуйста, укажите мне в правильном направлении?

<Application.Resources>
    <BitmapImage x:Key="MainIcon"
                 UriSource="./Resources/MainIcon.png" />
    <Style x:Key="Chromeless"
           TargetType="{x:Type Window}">
        <Setter Property="WindowChrome.WindowChrome">
            <Setter.Value>
                <WindowChrome GlassFrameThickness="-1"
                              ResizeBorderThickness="4"
                              CaptionHeight="36" />
            </Setter.Value>
        </Setter>
        <!--pack://application:,,,/Resources/Search.png-->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Window}">
                    <Grid>
                        <!-- This is the ContentPresenter that displays the window content. -->
                        <Border Margin="0,40,0,25">
                            <ContentPresenter Content="{TemplateBinding Content}" />
                        </Border>

                        <!--This is the transparent white rectangle that goes behind the window content.-->
                        <!-- Window Border Content -->
<!-- HERE ---->             <Border Margin="0"
                                BorderBrush="Gray"
                                BorderThickness="0,1,0,1"
                                Grid.ZIndex="-1">
                            <Rectangle Fill="Black"
                                       Opacity="0.5" />
                        </Border>
                        <!-- System Button -->
                        <Button VerticalAlignment="Top"
                                HorizontalAlignment="Left"
                                Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}"
                                WindowChrome.IsHitTestVisibleInChrome="True"
                                Command="{x:Static SystemCommands.ShowSystemMenuCommand}"
                                CommandParameter="{Binding ElementName=LibraryWindow}"
                                BorderThickness="0">
                            <Image Source="{StaticResource MainIcon}"
                                   Width="64"
                                   Height="64"
                                   WindowChrome.IsHitTestVisibleInChrome="True"
                                   />

                        </Button>
                        <!-- Window Title -->
                        <TextBlock VerticalAlignment="Top"
                                   TextAlignment="Left"
                                   FontSize="15"
                                   Padding="40,8,0,0"
                                   Foreground="White"
                                   Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Title}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Application.Resources>

1 ответ

Решение

Из того, что я понял, вы пытаетесь затемнить всю область стекла, визуализируя большой черный прямоугольник поверх всего, но вы хотите, чтобы кнопки управления окном не были затронуты. К сожалению, этот подход не работает, потому что если вы используете пользовательский хром окна, то вы не сможете выборочно решить, что будет отображаться поверх или под стеклом; он всегда будет отображаться сверху. Единственный способ сделать это, насколько я знаю, это повторно реализовать кнопки, потому что они полупрозрачны, поэтому независимо от того, измените ли вы цвет аэростекла или просто используете прямоугольник, кнопки всегда будут пострадавшие. Это особенно очевидно в Windows 10; если вы измените цвет аэростекла, фон кнопок также изменится, но он также будет одинаковым в окнах 8, 7 и vista. Я предполагаю, что если вы используете Windows XP, то вы можете изменить цвет рамки окна, но в противном случае это невозможно с помощью кнопок по умолчанию.

Другие вопросы по тегам