How can I make a rounded corner grid?
I tried and it sets a new border above the grid 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">
<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>
As it is not entirely clear what you are trying to do, I guess you want a window with rounded corners and transparent background. Your solution is correct, you just have to set the Window
background transparency and a background for the 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>
A better solution is how the border and grid orders are defined in the XAML. For instance, this scheme works to mask the square grid corners underneath the rounded border and while the main grid is transparent:
<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>
精彩评论