Transitioning from View to View in WPF

2019-06-13 20:24发布

问题:

I've been researching MVVM and WPF for a few weeks now, as I'm putting together a UI for an Application that another developer is doing the backend for. I don't have tons of GUI experience, so I'm just trying to figure it out as I go along.

I'm starting to understand the concept of keeping the backend code separate from the UI, but I can only find simple, one Window examples of MVVM online.

The application I'm designing is a Kiosk that moves step-by-step through a series of screens based on user input and scans. What is a good way to separate and design these transitions?

For example, I have a welcome screen that waits for the user to scan their ID. Once it gets their ID, it shows a new Window, or View, or whatever you want to call it, asking the user to confirm the scanned information and push the continue button.

Then it moves to a new screen where the user makes selections and so on until, and after a couple more "screens", the result is printed and it resets for the next user.

Are there any good implementation examples of this on the web?

EDIT: The application is full screen. My first instinct was to just design each screen as a separate window and Show() them one after the other, but this seems sloppy and I'm guessing it's not the best way.

Another thing I tried was to make each individual view a UserControl and load them in one main panel, one after the other based on the step. Once again, not sure this is the best method.

回答1:

Add a Content Control in your MainView like below,

<ContentControl Content="{Binding CurrentView}"/>

Create DataTemplates for your different Views like below,

<DataTemplate x:Key="Viewer"  DataType="{x:Type VM:TiffImageViewerViewModel}">//ViewModel Name
        <view:TiffViewer/>//View Name
</DataTemplate>

MainViewModel

public object CurrentView { get; set; }

private TiffImageViewerViewModel _TiffImageViewerViewModel;
    public TiffImageViewerViewModel TiffImageViewerViewModel
    {
        get
        {
            return _TiffImageViewerViewModel;
        }
        set
        {
            _TiffImageViewerViewModel = value;
        }
    }

Create the object and assign it to CurrentView. This link gives more clarity



标签: c# wpf mvvm