Question

我有这个扩展器控件，里面有WrapPanel：

<Expander Background="Black">
                <Expander.Header>
                    <BulletDecorator>
                        <BulletDecorator.Bullet>
                            <Image Source="../Images/Button/customiseButton_Transparent.png" Width="64" Height="64" HorizontalAlignment="Left" VerticalAlignment="Top" />
                        </BulletDecorator.Bullet>
                        <TextBlock Margin="10,0,0,0" Text="Customize" VerticalAlignment="Center" HorizontalAlignment="Stretch" Foreground="White" />
                    </BulletDecorator>
                </Expander.Header>
                <WrapPanel>
                    <StackPanel Orientation="Horizontal">
                        <Image  Source="Images/Button.png" />
                        <Label  Content="Phone" Foreground="Snow" VerticalAlignment="Center"/>
                    </StackPanel>
                    <StackPanel Orientation="Horizontal">
                        <Image  Source="Images/Button.png" />
                        <Label  Content="Colour" Foreground="Snow" VerticalAlignment="Center"/>
                    </StackPanel>
                </WrapPanel>
            </Expander>

我需要在两个堆叠面板之间显示一个白色分隔符。

我已尝试添加<Seperator/>标记，但无效

Answer 1

使用此标记：

<Separator Style="{StaticResource {x:Static ToolBar.SeparatorStyleKey}}" />

Answer 2

Separator只不过是一个Border元素，所以这应该可以正常工作：

<WrapPanel>
    <StackPanel Orientation="Horizontal">
        <Image  Source="Images/Button.png" />
        <Label  Content="Phone" Foreground="Snow" VerticalAlignment="Center"/>
    </StackPanel>
    <Border Width="2" Background="Red" />
    <StackPanel Orientation="Horizontal">
        <Image  Source="Images/Button.png" />
        <Label  Content="Colour" Foreground="Snow" VerticalAlignment="Center"/>
    </StackPanel>
</WrapPanel>

只需根据您的要求更改Width的{{1}}和Background属性。

除非您修改Border，否则实际的Separator元素在Windows 10上的Height总是为1。

Wrap Panel Items分隔符WPF

2 个答案: