Question

我制作了一个C＃商店应用。现在我有堆叠面板，如果该堆叠面板内的文本块不包含数据，则会折叠。但现在我希望stackpanels自动从上到下填充。如果没有数据的堆栈面板折叠，折叠的堆栈面板下方的堆栈面板应该向上移动并再次从上到下填充（所以我不会得到任何空的空格）。

关于我的stackpanels的一段代码：

        <StackPanel x:Name="STACKActualStockDeliverTime" Orientation="Vertical" Margin="550,150,0,0">
            <Border>

                <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="HEADERActualStockDeliverTime" FontSize="24" Text="Voorraad en levertijd"></Run><LineBreak/>
                    <Run x:Name="TXTActualStock" FontSize="18" Text="Actuele voorraad: "></Run><LineBreak/>
                    <Run x:Name="TXTInPuraseOrder" FontSize="18" Text="Aantal in inkooporders: "></Run><LineBreak/>
                    <Run x:Name="TXTInSalesOrder" FontSize="18" Text="Aantal in verkooporders: "></Run><LineBreak/>
                    <Run x:Name="TXTDeliverTime" FontSize="18" Text="Levertijd: "></Run>
                </TextBlock>
            </Border>
            <StackPanel.Resources>
                <Style TargetType="Border">
                    <Setter Property="Background" Value="#88287d37" />
                    <Setter Property="Margin" Value="5" />
                    <Setter Property="Width" Value="400" />
                    <Setter Property="Height" Value="125" />
                </Style>
                <Style TargetType="TextBlock">
                    <Setter Property="Foreground" Value="White" />
                    <Setter Property="Margin" Value="5" />
                </Style>
            </StackPanel.Resources>
        </StackPanel>

        <StackPanel  x:Name="STACKActualStockDeliverTime2"  Orientation="Vertical" Margin="750,188,0,0">      
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="BINDActualStock" FontSize="18" Text="{Binding ActualStock}"/><LineBreak/>
                    <Run x:Name="BINDInPuraseOrder" FontSize="18" Text="4"/><LineBreak/>
                    <Run x:Name="BINDInSalesOrder" FontSize="18" Text="12"/><LineBreak/>
                    <Run x:Name="BINDDeliverTime" FontSize="18" Text="2 weken"/>
                </TextBlock>
            </Border>
        </StackPanel>
        <StackPanel x:Name="STACKPrices" Orientation="Vertical" Margin="550,295,0,0">
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="HEADERPrices" FontSize="24" Text="Prijzen"></Run><LineBreak/>
                    <Run x:Name="TXTPurasePrice" FontSize="18" Text="Inkoopprijs: "></Run><LineBreak/>
                    <Run x:Name="TXTSalesPrice" FontSize="18" Text="Verkoopprijs: "></Run><LineBreak/>
                    <Run x:Name="TXTMargin" FontSize="18" Text="Marge: "></Run>
                </TextBlock>
            </Border>
        </StackPanel>

        <StackPanel x:Name="STACKPrices2" Orientation="Vertical" Margin="750,335,0,0">
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="BINDPurchasePrice" FontSize="18" Text="{Binding PurchasePrice}"></Run><LineBreak/>
                    <Run x:Name="BINDUnitPriceEXCLVAT" FontSize="18" Text="{Binding UnitPriceExclVAT}"></Run><LineBreak/>
                    <Run x:Name="BINDMargin" FontSize="18" Text="{Binding Margin}"></Run>
                </TextBlock>
            </Border>
        </StackPanel>

        <StackPanel x:Name="STACKExtraInfo" Orientation="Vertical" Margin="550,420,0,0">
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="HEADERExtraInfo" FontSize="24" Text="Extra informatie"></Run><LineBreak/>
                    <Run x:Name="TXTStatus" FontSize="18" Text="Status: "></Run><LineBreak/>
                    <Run x:Name="TXTBlocked" FontSize="18" Text="Geblokkeerd: "></Run>
                </TextBlock>

            </Border>
        </StackPanel>
        <StackPanel x:Name="STACKExtraInfo2" Orientation="Vertical" Margin="750,460,0,0">
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                   <Run x:Name="BINDStatus" FontSize="18" Text="vrijgegeven"></Run><LineBreak/>
                   <Run x:Name="BINDBlocked" FontSize="18" Text="nee"></Run>
                </TextBlock>

            </Border>
        </StackPanel>

对不起那长段代码感到遗憾，但那会让我明白我在做什么？

希望你能给我一个提示如何解决我的问题。提前谢谢。

Answer 1

为什么不将所有stackpanel包装在一个包装器StackPanel中。

注意我已经从第一个边框移除了高度，因为下面的面板无法使用此设置高度向上移动。

我已删除Orientation="Vertical"，因为StackPanel默认具有此设置

此外，我已经删除了你的边距，所以你可能不得不再次使用它们，但是由于设备的屏幕尺寸不同，以这种方式使用边距放置项目不是一个好主意

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*"/>
        <ColumnDefinition Width="1*"/>
    </Grid.ColumnDefinitions>
    <StackPanel Grid.Column="1">
        <StackPanel x:Name="STACKActualStockDeliverTime">
            <Border>

                <TextBlock OpticalMarginAlignment="None">
                <Run x:Name="HEADERActualStockDeliverTime" FontSize="24" Text="Voorraad en levertijd"></Run><LineBreak/>
                <Run x:Name="TXTActualStock" FontSize="18" Text="Actuele voorraad: "></Run><LineBreak/>
                <Run x:Name="TXTInPuraseOrder" FontSize="18" Text="Aantal in inkooporders: "></Run><LineBreak/>
                <Run x:Name="TXTInSalesOrder" FontSize="18" Text="Aantal in verkooporders: "></Run><LineBreak/>
                <Run x:Name="TXTDeliverTime" FontSize="18" Text="Levertijd: "></Run>
                </TextBlock>
            </Border>
            <StackPanel.Resources>
                <Style TargetType="Border">
                    <Setter Property="Background" Value="#88287d37" />
                    <Setter Property="Margin" Value="5" />
                    <Setter Property="Width" Value="400" />
                </Style>
                <Style TargetType="TextBlock">
                    <Setter Property="Foreground" Value="White" />
                    <Setter Property="Margin" Value="5" />
                </Style>
            </StackPanel.Resources>
        </StackPanel>

        <StackPanel  x:Name="STACKActualStockDeliverTime2" >
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                <Run x:Name="BINDActualStock" FontSize="18" Text="{Binding ActualStock}"/><LineBreak/>
                <Run x:Name="BINDInPuraseOrder" FontSize="18" Text="4"/><LineBreak/>
                <Run x:Name="BINDInSalesOrder" FontSize="18" Text="12"/><LineBreak/>
                <Run x:Name="BINDDeliverTime" FontSize="18" Text="2 weken"/>
                </TextBlock>
            </Border>
        </StackPanel>

        <StackPanel x:Name="STACKExtraInfo2" Margin="0,20,0,0">
            <Border>
                <TextBlock OpticalMarginAlignment="None">
                   <Run x:Name="BINDStatus" FontSize="18" Text="vrijgegeven"></Run><LineBreak/>
                   <Run x:Name="BINDBlocked" FontSize="18" Text="nee"></Run>
                </TextBlock>

            </Border>
        </StackPanel>
    </StackPanel>
    <StackPanel HorizontalAlignment="Right">
        <StackPanel x:Name="STACKPrices">
                <Border>
                    <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="HEADERPrices" FontSize="24" Text="Prijzen"></Run><LineBreak/>
                    <Run x:Name="TXTPurasePrice" FontSize="18" Text="Inkoopprijs: "></Run><LineBreak/>
                    <Run x:Name="TXTSalesPrice" FontSize="18" Text="Verkoopprijs: "></Run><LineBreak/>
                    <Run x:Name="TXTMargin" FontSize="18" Text="Marge: "></Run>
                    </TextBlock>
                </Border>
            </StackPanel>

            <StackPanel x:Name="STACKPrices2">
                <Border>
                    <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="BINDPurchasePrice" FontSize="18" Text="{Binding PurchasePrice}"></Run><LineBreak/>
                    <Run x:Name="BINDUnitPriceEXCLVAT" FontSize="18" Text="{Binding UnitPriceExclVAT}"></Run><LineBreak/>
                    <Run x:Name="BINDMargin" FontSize="18" Text="{Binding Margin}"></Run>
                    </TextBlock>
                </Border>
            </StackPanel>

            <StackPanel x:Name="STACKExtraInfo" >
                <Border>
                    <TextBlock OpticalMarginAlignment="None">
                    <Run x:Name="HEADERExtraInfo" FontSize="24" Text="Extra informatie"></Run><LineBreak/>
                    <Run x:Name="TXTStatus" FontSize="18" Text="Status: "></Run><LineBreak/>
                    <Run x:Name="TXTBlocked" FontSize="18" Text="Geblokkeerd: "></Run>
                    </TextBlock>

                </Border>
            </StackPanel>

    </StackPanel>
</Grid>

编辑添加了一个2列网格来帮助定位项目。两列都是Width="1*"，这意味着每列将占用可用屏幕的50％。在StackPanels上使用较小的边距进行调整。希望它有所帮助

即使禁用了堆栈面板，也可以从上到下填充带有堆叠面板的页面

1 个答案: