将数据从 CollectionView 传递到详细信息页面 Shell Navigation

时间:2021-06-15 05:13:13

标签: xamarin.forms uicollectionview detailsview

我有一个带有名称列表和标签视图配置文件的 CollectionView。当我单击查看个人资料时,我想导航到详细信息页面。但是,我对 shell 导航以及如何将数据从一个页面传递到另一个页面感到困惑。

以及 CollectionView。这是我第一次使用它。我点击 viewprofile 并导航到详细信息页面,但是我传递的数据没有传递。 PetName 没有出现,因为我猜没有价值。我正在使用命令调用导航。

当我点击查看个人资料然后将其传递时,我想我不确定如何获取 Petsname

MyIDPageViewModel:

 class MyIDPageViewModel : INotifyPropertyChanged
 {
     FirebaseHelper firebaseHelper = new FirebaseHelper();
     public Command NavToDetailCommand { get; set; }

     public ObservableCollection<PetProfile> source;
     public ObservableCollection<PetProfile> PetInfo { get; private set; }
     public ObservableCollection<PetProfile> EmptyPetInfo
     {
         get => source;
         private set
         {
             if (value != source)
             {
                 source = value;
                 OnPropertyChanged(nameof(EmptyPetInfo));
             }
         }
     }

     public MyIDPageViewModel()
     {
         source = new ObservableCollection<PetProfile>();           
         CreatePetProfileCollection();
         NavToDetailCommand = new Command<PetProfile>(OnNav);
     }

     private async void OnNav(PetProfile PetDetailsPage)
     {           

         if (PetDetailsPage == null)
             return;

         await Shell.Current.GoToAsync($"//MyIDPage/PetDetailsPage?PetName={PetDetailsPage.PetName}");
     }

     public async void CreatePetProfileCollection()
     {
         var petProfiles = await firebaseHelper.GetAllUserPetInfos();
         if (petProfiles != null)
         {
             EmptyPetInfo = new ObservableCollection<PetProfile>();
             foreach (var groupitems in petProfiles)
             {
                 EmptyPetInfo.Add(new PetProfile() { PetName = groupitems.PetName, UserEmail = groupitems.UserEmail, Breed = groupitems.Breed, DOB = groupitems.DOB, Gender = groupitems.Gender, Weight = groupitems.Weight, CareInformation = groupitems.CareInformation });
             }
         }
     }

        
     public async void Refresh()
     {
         EmptyPetInfo.Clear();
         var petProfiles = await firebaseHelper.GetAllUserPetInfos();
         if (petProfiles != null)
         {
             EmptyPetInfo = new ObservableCollection<PetProfile>();
             foreach (var groupitems in petProfiles)
             {
                 EmptyPetInfo.Add(new PetProfile() { PetName = groupitems.PetName, UserEmail = groupitems.UserEmail, Breed = groupitems.Breed, DOB = groupitems.DOB, Gender = groupitems.Gender, Weight = groupitems.Weight, CareInformation = groupitems.CareInformation });
             }
         }
     }

     #region INotifyPropertyChanged
     public event PropertyChangedEventHandler PropertyChanged;
     void OnPropertyChanged([CallerMemberName] string propertyName = null)
     {
         PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
     }
     #endregion

我的收藏视图:

<CollectionView  ItemsSource="{Binding EmptyPetInfo}" SelectedItem="{Binding SelectedPet, Mode=OneWay}" SelectionChanged="OnCollectionViewSelectionChanged">
             <CollectionView.ItemTemplate>
                 <DataTemplate>
                     <Grid Padding="10">
                         <Grid.RowDefinitions>
                             <RowDefinition Height="Auto" />
                         </Grid.RowDefinitions>
                         <Grid.ColumnDefinitions>
                             <ColumnDefinition Width="Auto" />
                             <ColumnDefinition Width="Auto" />
                             <ColumnDefinition Width="Auto" />
                         </Grid.ColumnDefinitions>
                         <Label Grid.Column="0"
                                Grid.Row="0"
                                Text="Image Goes Here"
                                FontAttributes="Bold" />
                         <Label Grid.Column="1"
                                Grid.Row="0"
                                Text="{Binding PetName}"
                                FontAttributes="Bold"
                                x:Name="labelpetname"/>
                         <Label  Grid.Row="0"
                                 Grid.Column="2"
                                 Text="View Profile"
                                 FontAttributes="Italic"
                                 VerticalOptions="End"                                
                                 >
                             <Label.GestureRecognizers>
                                 <TapGestureRecognizer Command="{Binding NavToDetailCommand, Source={
                                 RelativeSource AncestorType={x:Type local:MyIDPageViewModel}
                             }}"
                             CommandParameter="{Binding .}">
                                 </TapGestureRecognizer>
                             </Label.GestureRecognizers>
                         </Label>
                     </Grid>
                 </DataTemplate>
             </CollectionView.ItemTemplate>
         </CollectionView>

宠物详情页面:

public partial class PetDetailsPage : ContentPage
{
    FirebaseHelper firebaseHelper = new FirebaseHelper();
    private string _PetName;
    public string PetName
    {
        get => _PetName;
        set
        {
            if (value != _PetName)
            {
                _PetName = value;
            }
        }
    }

    public PetDetailsPage()
    {
        InitializeComponent();
        RetrivePetInfo();

    }

    private async void RetrivePetInfo()
    {
        var pet = await firebaseHelper.GetPet(_PetName);
        if (pet != null)
        {
            petname.Text = pet.PetName;
        }

    }

    private void Button_Clicked(object sender, EventArgs e)
    {

    }
}

用于从 firebase 检索 PetInfo 的代码:

public async Task<PetProfile> GetPet(string petname)

{ var useremail = Preferences.Get("UserSignInEmail", "");

     var PetProfiles = await GetAllPetInfos();
     await firebase
       .Child("PetProfiles")
       .OnceAsync<PetProfile>();
     return PetProfiles.Where(a => a.UserEmail == useremail && a.PetName == petname).FirstOrDefault();
 }

1 个答案:

答案 0 :(得分:0)

  1. 正如 Cfun 在评论中提到的,在类上方添加一个 QueryProperty 属性。
  [QueryProperty(nameof(PetName), "PetName")]
  public partial class PetDetailsPage : ContentPage{}
  1. set 属性 PetName 的方法在类构造函数之后调用,因此 _PetName 方法中的 RetrivePetInfo 为空,作为解决方法,您可以调用 {{1} } 直接在 RetrivePetInfo 方法中,而不是在构造函数中。
set