CarouselView mit verschiedenen ContentViews Binding ViewModel

Question

Ich versuche meine CarouselPage in eine CarouselView zu konvertieren. In meiner CarouselPage habe ich einige ContentPages, die ich in ContentViews umgewandelt habe. Jetzt habe ich die ContentViews zum CarouselView hinzugefügt.

<forms:CarouselView ItemsSource="{Binding ContentViews}"> 
<forms:CarouselView.ItemTemplate> 
    <DataTemplate> 
    <ContentView Content="{Binding Content}" />/ 
    </DataTemplate> 
</forms:CarouselView.ItemTemplate> 
</forms:CarouselView> 

// Ansichtsmodell

private List<ContentView> _contentViews; 
public List<ContentView> ContentViews 
    { 
     get { return _contentViews; } 
     set { SetProperty(ref _contentViews, value); } 
    } 
public TestVM(){{ContentViews = new List<ContentView> { new Selector(), new TestView() };} 

Es funktioniert gut, aber i`m meine Datenbindung zu verlieren. Jetzt fragte ich mich, wie ich ein ViewModel an die Ansichten in der Karussellansicht binden könnte, oder ob ich sie an das "Parent" Viewmodel des Karussells binden könnte.

Answer 1

ich die Lösung gefunden: ich den Inhalt zum Inhalt der Ansichten eingestellt, aber die Bindung wurde außerhalb des Inhalts der Ansicht gesetzt. Jetzt habe ich die Bindung in den Inhalt der Ansicht, die schließlich funktioniert.

<ContentView.Content> 
    <StackLayout> 
     <StackLayout.BindingContext> 
      <viewModels:TestViewModel /> 
     </StackLayout.BindingContext> 
     <BoxView BackgroundColor="{Binding Colorback}"></BoxView> 
     <Label Text="Test" ></Label> 
    </StackLayout> 
</ContentView.Content> 

Answer 2

Sie waren großartig, außer dass Ihr Ansichtsmodell normalerweise Ihre Liste der Inhaltsansicht nicht enthalten sollte (per Definition sollte es in der Ansicht verwaltet werden).

Was ich tue, ist meine Inhalte Ansichten in meiner Content-Seite zu erstellen, wie das in Ihrem xaml.cs:

CarouselView.ItemSource = new List<View> 
{ 
    new ContentPage{ BindingContext = myCurrentViewModel}, 
    new ContentPage{ BindingContext = myCurrentViewModel}, 
... 
} 

Answer 3

In meinem ViewModel Ich habe meine ein ItemSource von Viewmodels auf diese Weise habe ich verschiedene Viewmodels zu jeder Ansicht im Karussell binden kann. Dann erstelle ich einen DataTemplateSelector, der das Matching von Views und ViewModels abwickelt.

Ansichtsmodell Code:

public class HomeViewModel 
{ 
    public HomeViewModel() 
    { 
     Views = new ObservableCollection<ViewModelBase> 
     { 
      new SomeViewModel1(), 
      new SomeViewModel2() 
      new SomeViewModel3(), 
      new SomeViewModel4() 
     }; 
    } 

    public ObservableCollection<ViewModelBase> Views { get; set; } 
} 

ViewModelBase:

public class ViewModelBase : INotifyPropertyChanged 
{ 
    public event PropertyChangedEventHandler PropertyChanged; 

    public void RaisePropertyChanged(string name) 
    { 
     PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name)); 
    } 
} 

HomeViewSelector:

public class HomeViewSelector : DataTemplateSelector 
{ 
    public DataTemplate ViewTemplate1 { get; set; } 
    public DataTemplate ViewTemplate2 { get; set; } 
    public DataTemplate ViewTemplate3 { get; set; } 
    public DataTemplate ViewTemplate4 { get; set; } 

    protected override DataTemplate OnSelectTemplate(object item, BindableObject container) 
    { 
     var tab = (ViewTab)item; 
     DataTemplate template = null; 

     switch (tab.SelectedTab) 
     { 
      case CarouselViewTabs.View1: 
       template = ViewTemplate1; 
       break; 
      case CarouselViewTabs.View2: 
       template = ViewTemplate2; 
       break; 
      case CarouselViewTabs.View3: 
       template = ViewTemplate3; 
       break; 
      case CarouselViewTabs.View4: 
       template = ViewTemplate4; 
       break; 
      default: 
       throw new NotSupportedException(); 
     } 

     return template; 
    } 
} 

Home.xaml:

<?xml version="1.0" encoding="utf-8" ?> 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
      xmlns:cv="clr-namespace:CarouselView.FormsPlugin.Abstractions;assembly=CarouselView.FormsPlugin.Abstractions" 
      xmlns:v="clr-namespace:Views" 
      xmlns:s="clr-namespace:Selectors" 
      x:Class="WeddingPhotos.Mobile.Views.HomePage"> 
    <ContentPage.Resources> 
     <ResourceDictionary> 
      <DataTemplate x:Key="ViewTemplate1"> 
       <v:SomeView1 BindingContext="{Binding BindingContext.ViewModel}" /> 
      </DataTemplate> 
      <DataTemplate x:Key="SomeView2"> 
       <v:SomeView2 BindingContext="{Binding BindingContext.ViewModel}" /> 
      </DataTemplate> 
      <DataTemplate x:Key="SomeView3">    
       <v:SomeView3 BindingContext="{Binding BindingContext.ViewModel}" /> 
      </DataTemplate> 
      <DataTemplate x:Key="SomeView4"> 
       <v:SomeView4 BindingContext="{Binding BindingContext.ViewModel}" /> 
      </DataTemplate> 
      <s:HomeViewSelector x:Key="HomeViewSelector" 
           SomeView1="{StaticResource ViewTemplate1}" 
           SomeView2="{StaticResource ViewTemplate2}" 
           SomeView3="{StaticResource ViewTemplate3}" 
           SomeView4="{StaticResource ViewTemplate4}"/> 
     </ResourceDictionary> 
    </ContentPage.Resources> 
    <ContentPage.Content> 
     <StackLayout>   
      <cv:CarouselViewControl ItemsSource="{Binding Tabs}" 
            ItemTemplate="{StaticResource HomeViewSelector}" /> 
     </StackLayout> 
    </ContentPage.Content> 
</ContentPage>