CODEWITHSUNDEEP
xamlmvvmuwpdynamic-usercontrolsxtype
Unfolded
Unfolded

Reputation: 39

UWP MVVM XAML Dynamic UserControl Manager

I need help with a change of perspective.

I got stuck trying to approach UWP in a way I used to do in WPF regarding a MVVM pattern for managing UserControls dynamically.

I naturally tried to perform the same pattern in UWP but got stuck on various things like UWP not supporting 'x:Type' ...

Situation is; time to rethink this approach and look for a new direction. Seems I'm forced to abandon to use implicit binding in a similar fashion to the WPF pattern, using the Content property of a ContentPresenter and a VM property 'of type Object', which maintain a selected ViewModel. It was a simple and clean approach for matching up the correct View automagically with the VM set in ActiveViewModel.

the below was such a simple way of managing many views all over the place, odd MS not fixing this? But, back to the big Q: what now in UWP!?

<ContentPresenter Content="{Binding ActiveViewModel}">
    <ContentPresenter.Resources>
        <DataTemplate DataType="{x:Type local:OneViewModel}">
            <local:OneView />
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:TwoViewModel}">
            <local:TwoView />
        </DataTemplate>
    </ContentPresenter.Resources>
</ContentPresenter>

What Shall I do instead of this!? Anyone found a new efficient way of doing it? I got stuck in my stubborn mind and need someone to kick my butt so I go forward. Getting to old to change, but due to this profession it seems I constantly have to. :)

Upvotes: 3

Views: 459

Answers (1)

Andr&#233; B
Andr&#233; B

Reputation: 1709

Looking at the DataTemplate documentation, there's a paragraph explaining the situation which you are trying to figure out.

For advanced data binding scenarios, you might want to have properties of the data determine which template should produce their UI representations. For this scenario, you can use a DataTemplateSelector and set properties such as ItemTemplateSelector to assign it to a data view. A DataTemplateSelector is a logic class you write yourself, which has a method that returns exactly one DataTemplate to the binding engine based on your own logic interacting with your data. For more info, see Data binding in depth.

Here, you have an example on how you can select distinct DataTemplate for items in a control such as a ListView based on defined conditions.

Your situation is a bit different from the one described above, but the solution should be within what is explained above.

  • Create a class which derives from DataTemplateSelector, and override the SelectTemplateCore methods exposed by it, where you define the logic of what DataTemplate should be selected for the specific presented object.
  • This Derived class should expose properties of type DataTemplate, which identify each single DataTemplate template object, you pretend to be able to choose from.
  • Just as in the example, you are probably better of by defining the DataTemplate resources on an higher level object, such as the Page itself.
  • Instantiate your DataTemplateSelector Derived class in XAML as a resource and set each of the properties exposed above of type DataTemplate to the analogous DataTemplate static resource.
  • Utilize the ContentTemplateSelector dependency property, by setting it your custom DataTemplateSelector.

With this logic, it should be possible to have your ContentPresenter decide correctly between which DataTemplate it should choose from, based on your required UI logic.

Upvotes: 1

Related Questions