Question

我希望实现这样的目标，其中有可见的边界（“市场摘要”左侧）垂直。

我有一个网格，两列（左侧部分=图片，名称，电子邮件，列表框），右侧是其他所有内容。我试图通过使用Panel.Zindex将左侧列中找到的StackPanel带到前面来显示该边框但是没有做任何事情。

    <StackPanel Panel.ZIndex="1"  Grid.Column="0">

        <materialDesign:ColorZone  Height="100"  Mode="PrimaryMid">
            <Border  Padding="8">
                <StackPanel>
                    <Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Width="48" Height="48" RenderTransformOrigin="-0.014,0.003" Margin="0,0,104,0">
                        <Ellipse.Fill>
                            <ImageBrush ImageSource="RandomPic.jpg" />
                        </Ellipse.Fill>
                    </Ellipse>

                    <TextBlock Text="UsernameX" ></TextBlock>
                    <TextBlock Text="EmailY" ></TextBlock>
                </StackPanel>
            </Border>

        </materialDesign:ColorZone>


        <ListBox  Background="#FAFAFA"  x:Name="DemoItemsListBox">
            <ListBox.Items>
                <TextBlock> What's going on</TextBlock>
                <TextBlock>What's going on</TextBlock>
                <TextBlock>What's going on</TextBlock>
                <TextBlock>What's going on</TextBlock>
            </ListBox.Items>

        </ListBox>

    </StackPanel>


    <StackPanel  Panel.ZIndex="0"   Grid.Column="1">

        <materialDesign:ColorZone Panel.ZIndex="0"    Height="60" Mode="PrimaryMid" />
        <!--
        <dragablz:TabablzControl BorderBrush="#4CAF50" BorderThickness="0" Height="56" >

            <TabItem  Header="                 Ordre de mission                " IsSelected="True">
                <TextBlock><Run Text="Hello World"/></TextBlock>
            </TabItem>
            <TabItem Header="Tab No. 2">
                <TextBlock><Run Text="We Have Tearable Tabs!"/></TextBlock>
            </TabItem>


       </dragablz:TabablzControl>
-->

 <ContentControl></ContentControl>

    </StackPanel>

mask

Answer 1

WPF StackPanel没有边框，所以把它带到前面不会出现。

您必须在同一网格列中或在其旁边添加自己的内容，方法是插入一个精简列并在其中放置一个Border或Separator控件。如果将它放在同一列中，您可能需要调整StackPanel的边距，使其不会遮挡边框。

即

<Border Grid.Column="0" BorderThickness="0,0,1,0" BorderBrush="Gray"/>
<StackPanel Grid.Column="0" Margin="0,0,2,0">

    <materialDesign:ColorZone  Height="100"  Mode="PrimaryMid">
        <Border  Padding="8">
            <StackPanel>
                <Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Width="48" Height="48" RenderTransformOrigin="-0.014,0.003" Margin="0,0,104,0">
                    <Ellipse.Fill>
                        <ImageBrush ImageSource="RandomPic.jpg" />
                    </Ellipse.Fill>
                </Ellipse>

                <TextBlock Text="UsernameX" ></TextBlock>
                <TextBlock Text="EmailY" ></TextBlock>
            </StackPanel>
        </Border>

    </materialDesign:ColorZone>


    <ListBox  Background="#FAFAFA"  x:Name="DemoItemsListBox">
        <ListBox.Items>
            <TextBlock> What's going on</TextBlock>
            <TextBlock>What's going on</TextBlock>
            <TextBlock>What's going on</TextBlock>
            <TextBlock>What's going on</TextBlock>
        </ListBox.Items>

    </ListBox>

</StackPanel>

StackPanel ZIndex不工作

1 个答案: