CODEWITHSUNDEEP
c#wpfuser-interface
T2o
T2o

Reputation: 925

Dynamic content in a window C#/WPF

I need to make an app which will have only a window, and you will change the window's content on clicking on a button.

I don't know how to do that. I think of use User Controls, but I don't think it's the best way. Perhaps with tab, but it won't respect the UI I want to have. So how is the best way to archieve that ? Dynamic content on a WPF window (of course, I will need to pass data and variables through the differents view)

Here's a "example" of the UI I want to do. Excuse if it's not good, I do that as fast as possible :)

UI Example

Upvotes: 1

Views: 592

Answers (2)

Sinatr
Sinatr

Reputation: 21999

MVVM wise you will need different view for each page (and some base class for each view). So UserControl is the way to go.

However, it is possible to use TabControl for multiple pages with collapsed headers:

    <TabControl>
        <TabItem Visibility="Collapsed">
            <Label Content="First page"/>
        </TabItem>
        <TabItem Visibility="Collapsed">
            <Label Content="Second page"/>
        </TabItem>
    </TabControl>

To edit specific page you select corresponding item in designer and then you can see its content.

For buttons you will need a special area (because buttons are common between pages). So that your window will contain grid like

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Image Grid.Row="0" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Source="logo.png"/>
    <TabControl Grid.Row="1" SelectedIndex="{Binding Page}">
        ... tab items
    </TabControl>
    <StackPanel Grid.Row="2" Orientation="Horizontal" FlowDirection="RightToLeft">
        <Button Command="{Binding CommandFinish}" Content="Finish"/>
        <Button Command="{Binding CommandNext}" Content="Next"/>
        <Button Command="{Binding CommandPrevious}" Content="Previous"/>
        ... and so on, from right to left
    </StackPanel>
</Grid>

And to utilize MVVM at least a bit, you could have page numbers, so that your ViewModel knows about how many pages have to be total and what each page can do (to control button visibility and navigation).

Upvotes: 2

Stefan Over
Stefan Over

Reputation: 6046

The image you provide looks like a typical wizard. The Extended WPF Toolkit already ships with a Wizard. And it's completely free. I'd recommend you to at least take a look at it. It allows you to apply any kind of content to any page. Also the behavior of the wizard itself can be modified.

Upvotes: 0

Related Questions