Xamarin表单状态容器视图不遵守布局选项

时间:2018-11-11 16:33:30

标签: c# xaml xamarin xamarin.forms

我正在使用一个基本的状态管理系统(在下面的代码中找到)

https://github.com/xDelivered-Patrick/Xamarin.Forms.Essentials/blob/master/Essentials/Controls/State/StateContainer.cs

实施时,我的XAML视图如下所示。

问题是StackLayout CenterAndExpand无法正常工作。渲染时,所有视图都只在顶部缩小。

如果我将特定部分从StateContainer中拉出并消除其用法,则它将正确呈现。在View的内容中呈现StateContainer的方式是否有问题?

编辑:这是一个最小的示例:https://github.com/aherrick/StateManagementDemo

XAML:

<ContentPage.Content>

    <StackLayout x:Name="layoutWrap" VerticalOptions="FillAndExpand"
                  HorizontalOptions="FillAndExpand">

        <controls:StateContainer State="{Binding State}">
            <controls:StateCondition Is="Loading">

                <StackLayout Orientation="Vertical" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand">

                    <ActivityIndicator  x:Name="loadingIndicator"
                                    IsVisible="{Binding IsBusy}"
                                    IsRunning="{Binding IsBusy}"
                  VerticalOptions="FillAndExpand"
                  HorizontalOptions="FillAndExpand" />
                </StackLayout>
            </controls:StateCondition>

            <controls:StateCondition Is="Loaded">
                <!-- actual content here -->
            </controls:StateCondition>
            <controls:StateCondition Is="Error">

                <StackLayout Orientation="Vertical" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand">

                    <Label FontAttributes="Bold" Text="Oops! There was a problem."  VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand" />
                    <Button Text="Tap to Retry" Command="{Binding LoadVenuesCommand}" CommandParameter="true"   HorizontalOptions="CenterAndExpand" TextColor="White" Padding="15"  BackgroundColor="#26265E" />
                </StackLayout>
            </controls:StateCondition>
        </controls:StateContainer>
    </StackLayout>
</ContentPage.Content>

C#

[ContentProperty("Content")]
[Preserve(AllMembers = true)]
public class StateCondition : View
{
    public object Is { get; set; }
    public object IsNot { get; set; }
    public View Content { get; set; }
}

[ContentProperty("Conditions")]
[Preserve(AllMembers = true)]
public class StateContainer : ContentView
{
    public List<StateCondition> Conditions { get; set; } = new List<StateCondition>();

    // https://forums.xamarin.com/discussion/102024/change-bindableproperty-create-to-bindableproperty-create
    //public static readonly BindableProperty StateProperty = BindableProperty.Create(nameof(State), typeof(object), typeof(StateContainer), propertyChanged: StateChanged);

    public static readonly BindableProperty StateProperty = BindableProperty.Create<StateContainer, object>(x => x.State, null, propertyChanged: StateChanged);

    public static void Init()
    {
    }

    private static void StateChanged(BindableObject bindable, object oldValue, object newValue)
    {
        var parent = bindable as StateContainer;
        parent?.ChooseStateProperty(newValue);
    }

    public object State
    {
        get { return GetValue(StateProperty); }
        set { SetValue(StateProperty, value); }
    }

    private void ChooseStateProperty(object newValue)
    {
        foreach (StateCondition stateCondition in Conditions)
        {
            if (stateCondition.Is != null)
            {
                if (stateCondition.Is.ToString().Equals(newValue.ToString()))
                {
                    Content = stateCondition.Content;
                }
            }
            else if (stateCondition.IsNot != null)
            {
                if (!stateCondition.IsNot.ToString().Equals(newValue.ToString()))
                {
                    Content = stateCondition.Content;
                }
            }
        }
    }
}

1 个答案:

答案 0 :(得分:5)

解决方案很简单,但并不明显。也将HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand"添加到<local:StateContainer>对象。如果所有Xamarin形式LayoutOptions以... AndExpand结尾,则其包含的父级可以允许扩展。这就是为什么当您从<local:StateContainer>中删除元素并将其直接放入已经声明StackLayout从而可以“允许扩展”的FillAndExpand中时起作用的原因。