开发者

Border between cells in a WPF UniformGrid

I'm new to WPF, and trying to add a 1 pixel border or space between elements in a UniformGrid. How can I do this? I tried adding a Margin to each child element, but that creates a two pixel border between cells in the middle. I could add a margin to top 开发者_StackOverflowand left, but that would make the bottom and right cells have no outside margin.

I tried googling, probably not using the right terms.


You said you tried setting Margin to 1, which gives you a total of 2 pixels around each element.

So cut it in half; set your items' margins to 0.5 instead. You'll also want to add a Margin of 0.5 to the UniformGrid itself, so everything ends up lining up on pixel boundaries.

(The leftmost column of items will have the UniformGrid's 0.5-pixel left margin, plus the item's 0.5-pixel margin, for a total of 1 pixel. Then between that first column and the next column, you'll have the first column's 0.5-pixel right margin, plus the next column's 0.5-pixel left margin, so once again you've got 1 pixel total between columns. It works out nicely.)


Option 1: Grid panel with ShowGridLines property, but there're just dashed lines.

Option 2: DataGrid with GridLinesVisibility=DataGridGridLinesVisibility.All. Here you could specify different line brushes with VerticalGridLinesBrush and HorizontalGridLinesBrush

Option 3: Own panel

I believe that there're more options, but I know just those I listed.


Here's the markup only solution, you can create a DP - Border width and bind to it, just give us a shout if you a need help on:

<Window x:Class="Margins.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:s="clr-namespace:System;assembly=mscorlib"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Border Background="Green" Padding="0,0,10,0" HorizontalAlignment="Center" VerticalAlignment="Center">
            <StackPanel Orientation="Horizontal">
                <Rectangle Fill="White" Width="100" Height="100" Margin="10,10,0,10"/>
                <Rectangle Fill="White" Width="100" Height="100" Margin="10,10,0,10" />
                <Rectangle Fill="White" Width="100" Height="100" Margin="10,10,0,10" />
                <Rectangle Fill="White" Width="100" Height="100" Margin="10,10,0,10" />
            </StackPanel>
        </Border>
    </Grid>
</Window>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜