Xamarin.Forms - 两个StackLayouts之间的额外空间

我有一个如下的Xamarin.Forms XAML设置，但不知道为什么两个StackLayout实例之间有额外的空间。我尝试将填充设置为0并将边距设置为0，但仍然存在空间，最后的StackLayout结束。Xamarin.Forms - 两个StackLayouts之间的额外空间

<StackLayout Spacing="0" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1" HeightRequest="500" Margin="0" Padding="0"> 
     <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" HeightRequest="20" Margin="0" Padding="0"> 
      <Label Text="MyTest" HorizontalOptions="Center"></Label> 
     </StackLayout> 
     <StackLayout VerticalOptions="CenterAndExpand" Padding="10,0,10,0" HeightRequest="500" Margin="0"> 
      <ListView x:Name ="listView" ItemsSource="{Binding MyBinding}"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
       <ViewCell> 
        <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="0.9*" /> 
         <ColumnDefinition Width="0.1*" /> 
        </Grid.ColumnDefinitions> 
        <Label Grid.Column="0" Text="{Binding MyName}" FontAttributes="Bold" VerticalTextAlignment="Center"/> 
        <Label Grid.Column="1" Text="{Binding MyValue}" FontAttributes="Bold" VerticalTextAlignment="Center"/> 
        </Grid> 
       </ViewCell> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
      </ListView> 
     </StackLayout> 
     </StackLayout>

来源

2017-03-14 user2650480

删除'Padding =“10,0,10,0”'它是在您的堆栈布局和最后添加填充。我会建议重新考虑一般的布局，尝试优化它，目前您有3个堆栈布局，也许一个网格可以更好地满足您的需求？ – EvZ

一张图片胜过千言万语，并会显示_where_您看到空间并使我们更容易提供解决方案。 – Krumelur

看来你没有设置任何VerticalOptions到第一StackLayout，这就是为什么它只是包装标签并留下一个空的空间和你一样CenterAndExpand其他StackLayout设置为VerticalOption。

为了解决这个问题，你有几种选择方案：

1：设置VerticalOption到FillAndExpand到StackLayout包含的ListView

<StackLayout VerticalOptions="FillAndExpand" Padding="10,0,10,0" HeightRequest="500" Margin="0"> 
     <ListView x:Name ="listView" ItemsSource="{Binding MyBinding}"> 
     <ListView.ItemTemplate> 
      <DataTemplate> 
      <ViewCell> 
       <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="0.9*" /> 
        <ColumnDefinition Width="0.1*" /> 
       </Grid.ColumnDefinitions> 
       <Label Grid.Column="0" Text="{Binding MyName}" FontAttributes="Bold" VerticalTextAlignment="Center"/> 
       <Label Grid.Column="1" Text="{Binding MyValue}" FontAttributes="Bold" VerticalTextAlignment="Center"/> 
       </Grid> 
      </ViewCell> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
     </ListView> 
    </StackLayout>

2：设置VerticalOption到EndAndExpand与标签上的第一StackLayout并将VerticalOption作为StartAndExpand添加到带有列表的第二个StackLayout。

<StackLayout Orientation="Horizontal" VerticalOptions="EndAndExpand" HorizontalOptions="FillAndExpand" HeightRequest="20" Margin="0" Padding="0"> 
     <Label Text="MyTest" HorizontalOptions="Center"></Label> 
    </StackLayout> 

    <StackLayout VerticalOptions="StartAndExpand" Padding="10,0,10,0" HeightRequest="500" Margin="0"> 
     <ListView x:Name ="listView" ItemsSource="{Binding MyBinding}"> 
     <ListView.ItemTemplate> 
      <DataTemplate> 
      <ViewCell> 
       <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="0.9*" /> 
        <ColumnDefinition Width="0.1*" /> 
       </Grid.ColumnDefinitions> 
       <Label Grid.Column="0" Text="{Binding MyName}" FontAttributes="Bold" VerticalTextAlignment="Center"/> 
       <Label Grid.Column="1" Text="{Binding MyValue}" FontAttributes="Bold" VerticalTextAlignment="Center"/> 
       </Grid> 
      </ViewCell> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
     </ListView> 
    </StackLayout>

测试两个，看看哪一个更适合您的设计需要为每一个将以不同的方式将UI控制器。

希望这helps.-

来源

2017-03-14 20:29:17 apineda

不错的指针，但它们都不能用列表视图堆叠在网格之上...对我来说没有运气 – makoshichi

你总是可以尝试加入负边距值。我有一个类似的问题，我可以通过在第二个布局中添加-5的边距来解决。

<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"> 
<StackLayout AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" > 
    <StackLayout x:Name="lOne" Orientation="Horizontal" VerticalOptions="Start" /> 
    <StackLayout x:Name="lTwo" Orientation="Horizontal" Margin="-5" HorizontalOptions="CenterAndExpand" VerticalOptions="Start" Padding="10"/> 
</StackLayout>

lTwo了，我能看到添加背景颜色时的空间。当我为此添加Margin =“ - 5”时，空间消失了。

来源

2018-02-16 05:14:11

您可以将父布局的间距设置为-6。间距是设备像素中的一个值，表示每个元素之间的空间量。默认值是6.0 ....

来源

2018-02-16 11:26:48

Xamarin.Forms - 两个StackLayouts之间的额外空间

回答

相关问题