2

私の無知を許してください-私はWPFに非常に慣れていません。

私は自分のアプリケーションに、「内側の」丸みを帯びた角の外観を与えるマイナーな視覚効果を実装しようとしています。問題のウィンドウには、ウィンドウの下部にあるStatusBarを含むいくつかのUIElementをカプセル化する暗い境界線があります。このステータスバーの背景は、ウィンドウの境界線と一致する暗い背景になっています。ステータスバーの上にはコンテンツビューがあり、現在はグリッドです。背景は半透明です（これは制約のようなものだと思います。コンテンツビューから下のデスクトップに表示されます）。コンテンツビュー（下の図では透明な内側の領域で表されています）に丸みを帯びた角の外観を持たせたいのですが、自分で幻想を作成する必要があると思います。

（私はポスターではなく、潜んでいるため、画像を投稿できません。ここで図面を見つけてください）

私の最初のアプローチは、StatusBarのすぐ上に長方形（境界線と同じ暗い色で塗りつぶされている）を追加し、角が丸い境界線をOpacityMaskに割り当てることでした（Chris Cavanagh **によって提案されたソリューションと同様）。悲しいことに、生成される効果は、私が達成しようとしている効果とは正反対です。

Clipプロパティはこの種の状況で役立つ可能性があることは理解していますが、どのような種類のジオメトリを使用しても、それが存在する領域に動的にサイズ変更されないため、不十分であることがわかります。

編集：私のXAMLを含む：

<Grid Background="{StaticResource ClientBg}" Tag="{Binding OverlayVisible}" Style="{StaticResource mainGridStyle}">

        <DockPanel LastChildFill="True">

            <!-- Translates to a StackPanel with a Menu and a Button -->
            <local:FileMenuView DockPanel.Dock="Top" />

            <!-- Translates to a StatusBar -->
            <local:StatusView DockPanel.Dock="Bottom" />

            <!-- Translates to a Grid -->
            <local:ContentView />

        </DockPanel>

    </Grid>

どんなポインタでも大歓迎です-必要に応じて、より詳細な情報を提供する準備ができています。

****http://www.dotnetkicks.com/wpf/WPF_easy_rounded_corners_for_anything

4

1 に答える 1

1

編集：今、私はあなたが意味するものを手に入れました。実際、Path+OpacityMaskアプローチを使用できます。不透明度マスクとして使用するには、「反転」パスを描画する必要があります。しかし、私はあなたのためのより簡単でより速い解決策を持っています:)。Border + CornerRadiusを使用して、隙間をしっかりとしたパスで埋めます。Kaxamlで次のコードを試して、これがあなたが探していたものであるかどうかを知らせてください。

<Window
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   Width="240"
   Height="320"
   AllowsTransparency="True"
   Background="Transparent"
   WindowStyle="None">
   <Grid>
      <Grid.RowDefinitions>
         <RowDefinition Height="24"/>
         <RowDefinition Height="*"/>
         <RowDefinition Height="24"/>
      </Grid.RowDefinitions>
      <Border Background="Black"/>
      <Border Grid.Row="1" BorderBrush="Black" BorderThickness="5">
         <Grid>
            <Border Background="White" CornerRadius="0, 0, 5, 5" Opacity="0.7"/>
            <Path
               Width="15"
               Height="15"
               HorizontalAlignment="Left"
               VerticalAlignment="Bottom"
               Data="M10,10 L5,10 L5,5 C4.999,8.343 6.656,10 10,10 z"
               Fill="Black"
               Stretch="Fill"/>
            <Path
               Width="15"
               Height="15"
               HorizontalAlignment="Right"
               VerticalAlignment="Bottom"
               Data="M10,10 L5,10 L5,5 C4.999,8.343 6.656,10 10,10 z"
               Fill="Black"
               Stretch="Fill">
               <Path.RenderTransform>
                  <TransformGroup>
                     <ScaleTransform ScaleX="-1"/>
                     <TranslateTransform X="15"/>
                  </TransformGroup>
               </Path.RenderTransform>
            </Path>
         </Grid>
      </Border>
      <Border Grid.Row="2" Background="Black"/>
   </Grid>
</Window>

PS：レンダリング変換を回避することでこのソリューションを単純化できますが、アイデアは得られました。

于 2009-10-22T19:33:09.657 に答える