主页 / coding / 问题 / 77933786
Accepted
jstuardo
Asked: 2024-02-04 05:21:30 +0800 CST

.NET MAUI：如何根据模型中的对象控制 IsVisible 属性

  • 772

我有一个模型，它有一个名为 的可观察属性visitor（这是一个具有名为 的 bool 属性的对象valid）。

该visitor属性将null在执行开始时，但根据某些条件，该属性visitor将被实例化，并且该valid属性将被分配true或false。

在相应的 XAML 文件中，我有以下 2 种布局：

<StackLayout 
    x:Name="AllowedMessage"
    Orientation="Horizontal"
    HorizontalOptions="FillAndExpand"
    VerticalOptions="End"
    IsVisible="{Binding Visitor.valid}">
    ....
</StackLayout>
<StackLayout 
    x:Name="DeniedMessage"
    Orientation="Horizontal"
    HorizontalOptions="FillAndExpand"
    VerticalOptions="End"
    IsVisible="{Binding Visitor.valid, Converter={StaticResource InvertedBoolConverter}}">
    ...
</StackLayout>

请参阅IsVisible两种布局的属性。

第一个有IsVisible="{Binding Visitor.valid}"，第二个有IsVisible="{Binding Visitor.valid, Converter={StaticResource InvertedBoolConverter}}"

根据visitor属性，行为应该是这样的：

  • 在应用程序启动时，两个布局都应该隐藏（visitor属性是null）
  • 当在某个时刻visitor被实例化并且valid属性为true. 在这种情况下，应显示第一个布局。
  • 最后，当visitor实例化并且valid属性为时false，应该显示第二个布局。

我怎样才能做到这一点？

xaml

1 个回答

  1. Best Answer

    由于 bool 类型的默认值为false，所以最初显示第二个布局，隐藏第一个布局。

    经过我这边的测试，如果visitor属性是null，第一个和第二个布局首先都会可见。

    为了实现您的需求，您可以尝试为两种布局定义两个不同的变量。

    您可以按照以下步骤操作：

    1.添加两个变量Valid和Valid2，并INotifyPropertyChanged 为此模型实现接口Visitor。

    public class Visitor : INotifyPropertyChanged
{
    private bool _valid=false;
    public bool Valid
    {
        get { return _valid; }
        set {
            SetProperty(ref _valid, value);

            updateValue(_valid);
        }
    }

    private bool _valid2 = false;
    public bool Valid2
    {
        get { return _valid2; }
        set { SetProperty(ref _valid2, value); }
    }


    void updateValue(bool value) {
        Valid2 =!value;
    }

    bool SetProperty<T>(ref T storage, T value, [CallerMemberName] string propertyName = null)
            {
                if (Object.Equals(storage, value))
                    return false;
                storage = value;
                OnPropertyChanged(propertyName);
                return true;
            }
            protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
            {
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
            }
            public event PropertyChangedEventHandler PropertyChanged;
}

    2.创建视图模型MyViewModel.cs

    public class MyViewModel: INotifyPropertyChanged
{
    private Visitor _visitor;
    public Visitor Visitor
    {
        get { return _visitor; }
        set
        {
            SetProperty(ref _visitor, value);
        }
    }
    public ICommand TestCommand { get; set; }

    public MyViewModel() {
        TestCommand = new Command(TestMethod);

        // initialize Visitor and the inner properties `Valid` and `Valid2`
        Visitor = new Visitor();
        Visitor.Valid = false;
        Visitor.Valid2 = false;
    }

    private void TestMethod()
    {
        Console.WriteLine("Hello!");
        // change the value of Valid and Valid2
        Visitor.Valid = !Visitor.Valid;
        Visitor.Valid2 = !Visitor.Valid;
    }

    bool SetProperty<T>(ref T storage, T value, [CallerMemberName] string propertyName = null)
    {
        if (Object.Equals(storage, value))
            return false;
        storage = value;
        OnPropertyChanged(propertyName);
        return true;
    }
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
    public event PropertyChangedEventHandler PropertyChanged;
}

    3.使用示例：

    <?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             xmlns:local="clr-namespace:MauiApp1"
             x:Class="MauiApp1.MainPage">
    <!--<ContentPage.Resources>
        <ResourceDictionary>
            <toolkit:InvertedBoolConverter x:Key="InvertedBoolConverter" />
        </ResourceDictionary>
    </ContentPage.Resources>-->

    <ContentPage.BindingContext>
        <local:MyViewModel></local:MyViewModel>
    </ContentPage.BindingContext>

    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">

            <StackLayout  
                HeightRequest="200" BackgroundColor="Yellow"
                x:Name="AllowedMessage"
                Orientation="Horizontal"
               HorizontalOptions="FillAndExpand"
               VerticalOptions="End"
               IsVisible="{Binding Visitor.Valid}">
            </StackLayout>
            <StackLayout
                HeightRequest="200" BackgroundColor="Green"
                x:Name="DeniedMessage"
                Orientation="Horizontal"
                HorizontalOptions="FillAndExpand"
                VerticalOptions="End"
                IsVisible="{Binding Visitor.Valid2}">
            </StackLayout>
            <Button  Text="test" Command="{ Binding TestCommand}" Margin="10"/>

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>
    • 1

相关问题