.netMaui資料系結到外殼彈出項IsVisible屬性

所以我有一個彈出選單，我需要讓彈出專案在某些條件下消失。為了幫助我發展我的想法和理解，我有一個包含 6 個專案的浮出控制元件，其中一個標題為藍牙。我在第一個彈出頁面中創建了一個名為 ShowParameters 的按鈕。我可以使視圖模型中的屬性為真或假。這似乎作業正常。我已將藍牙彈出項的 IsVisible 屬性系結到此 ShowParameters 屬性。這不會在單擊按鈕時更新 IsVisible 屬性。似乎 PropertyChanged?.Invoke 未鏈接到 Flyout 項或 Flyout 項未鏈接到屬性，盡管我可以使其在 xaml 本身中出現或消失。很明顯，作為一個菜鳥，我做了一些非常愚蠢的事情。

AppShell.xaml

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="TSDZ2Monitor.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:sys="clr-namespace:System;assembly=netstandard"
  
    xmlns:local="clr-namespace:TSDZ2Monitor"

    xmlns:pages="clr-namespace:TSDZ2Monitor.Pages"
  
    Shell.FlyoutBehavior="Flyout"
    FlyoutHeaderBehavior="Default"
    FlyoutVerticalScrollMode="Auto"
    FlyoutBackgroundColor="{StaticResource FlyoutBackgroundColor}">

  <Shell.BindingContext>
    <local:ShowParametersViewModel/>
  </Shell.BindingContext>

  <Shell.FlyoutHeaderTemplate>
    <DataTemplate>
      <Grid BackgroundColor="{StaticResource FlyoutBackgroundColor}"
            HeightRequest="200">
        <Image 
               HeightRequest="200"
               Source="bicycle.svg"
               Margin="10, 10, 10, 10"
               Opacity="0.6" />
        <Label Text="TSDZ2 Monitor"
               TextColor="White"
               FontAttributes="Bold" />
      </Grid>
    </DataTemplate>
  </Shell.FlyoutHeaderTemplate>

  <Shell.FlyoutFooterTemplate>
    <DataTemplate>
      <StackLayout>
        <Label Text="TSDZ2"
               TextColor="GhostWhite"
               FontAttributes="Bold"
               HorizontalOptions="Center" />
        <Label Text="{Binding Source={x:Static sys:DateTime.Now}, StringFormat='{0:MMMM dd, yyyy}'}"
               TextColor="GhostWhite"
               HorizontalOptions="Center" />
      </StackLayout>
    </DataTemplate>
  </Shell.FlyoutFooterTemplate>


  <Shell.ItemTemplate>
    <DataTemplate>
      <Grid ColumnDefinitions="0.2*, 0.8*">
        <Image Grid.Column="0" 
               Source="{Binding FlyoutIcon}"
               Margin="0, 20, 0, 10"
               VerticalOptions="Center"
               HeightRequest="30" />
        <Label Grid.Column="1"
               Text="{Binding Title}"
               TextColor="Yellow"
               FontSize="20"
               FontAttributes="Bold"
               VerticalTextAlignment="Center" />
      </Grid>
    </DataTemplate>
  </Shell.ItemTemplate>


  <ShellContent 
    Title="Display"
    Icon="speedometer.svg"
    ContentTemplate="{DataTemplate pages:DisplayPage}" />
  
  <ShellContent 
    Title="Bluetooth"
    Icon="bluetooth.svg"
    IsVisible="{Binding ShowParameters}"
    ContentTemplate="{DataTemplate pages:BluetoothPage}" />



  <ShellContent 
    Title="About"
    Icon="about.svg"
    ContentTemplate="{DataTemplate pages:AboutPage}" />

</Shell>

檔案夾頁面中的 DisplayPage.xaml

<?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:local="clr-namespace:TSDZ2Monitor"
             
             x:Class="TSDZ2Monitor.Pages.DisplayPage"
             Title="Display Page">

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

  <StackLayout>
    <Label Text="Main Display"
           VerticalOptions="Center" 
           HorizontalOptions="Center" />
    
    <Button Text="Show parameters" 
            FontSize="20"
            Command="{Binding ShowParametersCommand}"/>
  </StackLayout>
</ContentPage>

我的 ShowParametersViewModel.cs（在 ViewModels 檔案夾中）

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;

namespace TSDZ2Monitor
{
  //public class ShowParametersViewModel : BindableObject
  public class ShowParametersViewModel : INotifyPropertyChanged
  {
    public event PropertyChangedEventHandler PropertyChanged;

    bool showParameters = true;
    public bool ShowParameters
    {
      get { return showParameters; }
      set
      {
        if (value == showParameters) return;
        showParameters = value;
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("ShowParameters"));
      }
    }

    public ICommand ShowParametersCommand => new Command(ChangeShowParameters);

    public void ChangeShowParameters()
    {
      Console.WriteLine($"Before {ShowParameters}");
      ShowParameters = !ShowParameters;
      Console.WriteLine($"After {ShowParameters}");
     }
  }
}

如果我將 AppShell.xaml 中的 Shell.BindingContext 更改為

  <Shell.BindingContext>
    <local:ShowParametersViewModel  ShowParameters="false"/>
  </Shell.BindingContext>

它使藍牙彈出選單項消失，反之亦然

現在你可能想查看 repo https://github.com/gfmoore/TSDZ2Monitor但這很可能會改變。

uj5u.com熱心網友回復：

問題發生是因為您在頁面之間操作不同的資料（視圖模型），但我們需要共享資料。

以下兩部分代碼完全相同。

<Shell.BindingContext>
    <local:ShowParametersViewModel />
</Shell.BindingContext>

public AppShell()
{
    InitializeComponent();
    BindingContext = new ShowParametersViewModel();
}

實際上，它創建了一個new instanceviewmodel 類，并將其設定為 BindingContext，與 DisplayPage 中的方式相同。

所以有兩種不同的視圖模型，你只需改變 A ，但 B 永遠不會改變。

解決方案

在代碼后面而不是在 xaml(DisplayPage) 中初始化ShowParametersViewModel，以便它們共享相同的 viewmodel 。

public DisplayPage ()
{
    InitializeComponent();
    this.BindingContext = AppShell.Current.BindingContext;
}

標籤：。网 壳 数据绑定 毛伊岛

上一篇：linuxtouch相對時間給出錯誤結果

下一篇：運行docker容器的Shell腳本