隐藏的 Stacklayout 以 xamarin 形式占用空间答案

【问题标题】：Hidden Stacklayout taking up space in xamarin forms隐藏的 Stacklayout 以 xamarin 形式占用空间
【发布时间】：2017-08-11 10:11:12
【问题描述】：

我正在使用 Xamrin 在 Xaml 中创建一个表单，其中包含我隐藏堆栈布局的绝对布局。但是在隐藏的堆栈布局下方还有一个堆栈布局，但隐藏的堆栈布局正在占用空间。

我想要做什么。当我隐藏一个堆栈布局时，另一个堆栈布局应该代替隐藏的 staklayout。

【问题讨论】：

请分享您的代码。您想要的行为应该是 xamarin 表单的默认行为。环境或代码有问题...（抱歉英语不好）

标签： xaml xamarin.forms

【解决方案1】：

感谢您的帮助和支持。

我已经解决了这个问题：

我点击了这个链接 https://forums.xamarin.com/discussion/83632/hiding-and-showing-stacklayout 在这个链接中他们说使用网格并使行高自动，它会自动调整布局的额外空间。

<Grid VerticalOptions="Fill">    
    <Grid.RowDefinitions>
        <RowDefinition Height="100"/>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <StackLayout Grid.Row="1" Spacing="20">
        <StackLayout Margin="10,0">  
            <Label Text="lable 1" VerticalOptions="Center" FontSize="Small" />
            <Label Text="lable 2" VerticalOptions="Center" FontSize="Small" />
        </StackLayout>
        <StackLayout IsVisible="{Binding IsStudent}" Margin="10,0">  
            <Label Text="lable3" VerticalOptions="Center" FontSize="Small" />
            <Label Text="lable 4" VerticalOptions="Center" FontSize="Small" />
            <Label Text="lable 5" VerticalOptions="Center" FontSize="Small" />
            <Label Text="lable 6" VerticalOptions="Center" FontSize="Small" />
        </StackLayout>
    </StackLayout>
    <StackLayout Grid.Row="2" Spacing="20" >
        <local:Button
            x:Name="btnSave"
            Text="Submit"
            VerticalOptions="End"
            HorizontalOptions="FillAndExpand"
            IsVisible="{Binding IsBusy, Converter={x:Static local:InverseBoolConverter.Instance}}"
            AutomationId="saveButton" /> 
    </StackLayout>
</Grid>

【讨论】：

【解决方案2】：

不需要网格。设置 IsVisible 和 HeightRequest 属性。

 MyStackLayout.IsVisible = false;
 MyStackLayout.HeightRequest = 0; // trigger recalc of space layout.

heightrequest 的变化会触发所需的重新计算。

【讨论】：

【解决方案3】：

我也研究过为什么那些隐藏的控件会占用空间，嗯……它们占用了空间，仅此而已。您可以简单地添加和删除标签。像这样的：

public class MyStack : StackLayout
{
    Label
        _label1 = new Label(),
        _label2 = new Label(),
        _label3 = new Label();

    public void ShowLabels()
    {
        Children.Add(_label1);
        Children.Add(_label2);
        Children.Add(_label3);
    }

    public void HideLabels()
    {
        Children.Remove(_label1);
        Children.Remove(_label2);
        Children.Remove(_label3);
    }
}

【讨论】：

如果仍然如此，那么它就是一个错误。 Doc 说：VisualElement.IsVisible - “将 IsVisible 设置为 false 将从可视树中删除元素。该元素将不再占用布局中的空间”。但是，如果在代码中更改 isVisible 时尝试获得 dynamic 重新布局，则可能必须执行其他操作来强制布局 - 如 phil soady 的回答。看起来仍然可疑地像一个错误。

【解决方案4】：

我的建议是将 StackLayout 放在内容的底部，以便将其他元素的原始高度保持在顶部。

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="CentroDono.Views.YOURVIEWPAGE"
              Title="YOURVIEWTITLE"
             x:Name="YOURPAGECONTENTNAME">
    <ContentPage.Content>
        <StackLayout>
        <!--VISIBLE CONTENT-->
            <Label Text="HELLO"/>
        </StackLayout>
        <StackLayout>
            <Label Text="FOOTER"/>
            <!--INVISIBLE CONTENT-->    
            <Label x:Name="_searchText"  Text="Result1" IsVisible="False"/>
            <Label x:Name="_searchText2"  Text="Result2" IsVisible="False"/>
            <Label x:Name="_searchText3"  Text="Result3" IsVisible="False"/>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

【讨论】：

需要解释。底部的不可见标签如何影响布局？
@ToolmakerSteve，它似乎不能作为 display: none 用于 css ......它总是使用空间，无论是否可见......
嗯。也许那是（或曾经是）一个错误。 VisualElement.IsVisible - “将 IsVisible 设置为 false 将从可视化树中删除该元素。该元素将不再占用布局中的空间”。
@ToolmakerSteve，那就更好了...感谢您的提示！