web-dev-qa-db-ja.com

丸みを帯びたコーナーグリッドを作成するにはどうすればよいですか?

試したところ、グリッドの境界線の上に新しい境界線が設定されました。

<Window x:Class="Class.Window"
        xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
        Title="Window1" Width="379" Loaded="Window_Loaded"
        AllowsTransparency="True"
        ResizeMode="NoResize" ShowInTaskbar="False" Topmost="True" WindowStyle="None" Height="110">    
    <Border BorderBrush="Black" BorderThickness="1,1,1,1" CornerRadius="30,30,30,30">
        <Grid>
            <TextBlock Height="23" HorizontalAlignment="Left" Margin="62,12,0,0" Name="textBlock_From" Text="" VerticalAlignment="Top" Width="283" />
            <TextBlock Height="23" HorizontalAlignment="Left" Margin="62,38,0,0" Name="textBlock_Subject" Text="" VerticalAlignment="Top" Width="283" 
                       MouseLeftButtonDown="textBlock_Subject_MouseLeftButtonDown" MouseEnter="textBlock_Subject_MouseEnter" MouseLeave="textBlock_Subject_MouseLeave" />
        </Grid>
    </Border>
</Window>
15
Alex Kapustian

何をしようとしているのかが完全には明確ではないので、角が丸く、背景が透明なウィンドウが必要だと思います。解決策は正しいです。Windowの背景の透明度とBorderの背景を設定するだけです。

<Window x:Class="Class.Window"
    xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
    Title="Window1" Width="379" Loaded="Window_Loaded"
    AllowsTransparency="True"
    ResizeMode="NoResize" ShowInTaskbar="False" Topmost="True" WindowStyle="None" Height="110" Background="Transparent">    
    <Border Background="White" BorderBrush="Black" BorderThickness="1,1,1,1" CornerRadius="30,30,30,30">
        <Grid>
            <TextBlock Height="23" HorizontalAlignment="Left" Margin="62,12,0,0" Name="textBlock_From" Text="" VerticalAlignment="Top" Width="283" />
            <TextBlock Height="23" HorizontalAlignment="Left" Margin="62,38,0,0" Name="textBlock_Subject" Text="" VerticalAlignment="Top" Width="283" 
                   MouseLeftButtonDown="textBlock_Subject_MouseLeftButtonDown" MouseEnter="textBlock_Subject_MouseEnter" MouseLeave="textBlock_Subject_MouseLeave" />
        </Grid>
    </Border>
</Window>
30
Gimno

より良い解決策は、XAMLで境界線とグリッドの順序を定義する方法です。たとえば、このスキームは、丸みを帯びた境界の下で、メイングリッドが透明である間、正方形のグリッドコーナーをマスクするように機能します。

<Window x:Class="Class.Window"
    xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
    Title="Window1" Width="379" Loaded="Window_Loaded"
    AllowsTransparency="True"
    ResizeMode="NoResize" ShowInTaskbar="False" Topmost="True" WindowStyle="None" 
    Height="110" Background="Transparent">    

    <Grid Background="Transparent">
        <Grid Background="White" Margin="4">
            <!-- ...place functional control elements here... -->
        </Grid>

        <Border CornerRadius="12,12,12,12" BorderThickness="6" Padding="4">
            <!-- ...set your desired border brush color here... -->
        </Border>
    </Grid>
</Window>
1
MrEman