如何使用materialDesign:Transitioner同时使用DialogHost和WPF中的MaterialDesignInXamlToolkit库显示向导样式?

问题描述 投票:2回答:1

我想显示一个使用materialDesign:Transitioner的向导,以及一个DialogHost来显示带有WPF中的MaterialDesignInXamlToolkit库的对话框?

确实,我想使用WizardmaterialDesign:Transitioner制作为居中的materialDesign:DialogHost,但是materialDesign:DialogHost无法堆叠以显示多个对话框:一个用于materialDesign:Transitioner,一个用于DialogBox。 。

下面是示例代码:

<materialDesign:DialogHost x:Name="RootDialogHost" Identifier="RootDialog" SnackbarMessageQueue="{Binding ElementName=MainSnackbar, Path=MessageQueue}" IsOpen="{Binding GlobalDataVM.IsMessageDialogOpen}" DialogContent="{Binding GlobalDataVM.MessageDialogContent}" CloseOnClickAway="False" DialogClosing="DialogHost_OnDialogClosing">
<materialDesign:DrawerHost Margin="64" HorizontalAlignment="Center" VerticalAlignment="Center" BorderThickness="2" BorderBrush="{DynamicResource MaterialDesignDivider}">

    <materialDesign:DrawerHost.LeftDrawerContent>

        <!-- The Wizard -->
        <!-- the transitioner will manage your transitions. notice how SelectedIndex is set to zero: the first slide (instead of the default of -1) -->
        <materialDesign:Transitioner Grid.Row="1" SelectedIndex="0" AutoApplyTransitionOrigins="True">

            <!-- you can use a slide for each page, let's add a touch of fade for our first page  -->
            <materialDesign:TransitionerSlide OpeningEffect="{materialDesign:TransitionEffect FadeIn}">

            <!-- you can use a slide for each page, let's add a touch of fade for our first page  -->
            <materialDesign:TransitionerSlide OpeningEffect="{materialDesign:TransitionEffect FadeIn}">
                <local:Slide1_Intro />
            </materialDesign:TransitionerSlide>

            <!-- but you can use bare xaml too -->
            <local:Slide2_Intro />

            <!-- you can control (and create your own) wipes -->
            <materialDesign:TransitionerSlide>
                <materialDesign:TransitionerSlide.BackwardWipe>
                    <materialDesign:CircleWipe />
                </materialDesign:TransitionerSlide.BackwardWipe>
                <materialDesign:TransitionerSlide.ForwardWipe>
                    <materialDesign:SlideWipe Direction="Right" />
                </materialDesign:TransitionerSlide.ForwardWipe>
                <local:Slide3_Intro />
            </materialDesign:TransitionerSlide>

            <!-- now we are going to slide this in by combining some extra effects.  the inner content slides in, so we'll set the outer background and clip, to keep things nice -->
            <materialDesign:TransitionerSlide Background="{DynamicResource MaterialDesignDarkBackground}"
                                              Foreground="{DynamicResource MaterialDesignDarkForeground}"
                                              ClipToBounds="True">
                <materialDesign:TransitionerSlide.OpeningEffects>
                    <materialDesign:TransitionEffect Kind="SlideInFromLeft" Duration="0:0:0.8" />
                    <materialDesign:TransitionEffect Kind="SlideInFromBottom" Duration="0:0:0.8" OffsetTime="0:0:0.15" />
                </materialDesign:TransitionerSlide.OpeningEffects>

                <local:Slide4_CombineTransitions />

            </materialDesign:TransitionerSlide>

        </materialDesign:Transitioner>

    </materialDesign:DrawerHost.LeftDrawerContent>

</materialDesign:DrawerHost>
</materialDesign:DialogHost>    

那么有可能以另一种方式来做吗?

问候

c# wpf material-design centering wizard
1个回答
2
投票

materialDesign:DialogHost不能堆叠多个对话框,但是可以嵌套多个materialDesign:DialogHost:一个用于承载向导的对话框,另一个用于在向导上的对话框。

喜欢这个:

<materialDesign:DialogHost x:Name="RootDialogHost" Identifier="RootDialog" SnackbarMessageQueue="{Binding ElementName=MainSnackbar, Path=MessageQueue}" IsOpen="{Binding GlobalDataVM.IsMessageDialogOpen}" DialogContent="{Binding GlobalDataVM.MessageDialogContent}" CloseOnClickAway="False" DialogClosing="DialogHost_OnDialogClosing">

    <!-- The Wizard -->
    <materialDesign:Transitioner Grid.Row="1" SelectedIndex="0" AutoApplyTransitionOrigins="True">

        <materialDesign:DialogHost x:Name="WizardDialogHost" Identifier="WizardDialog" SnackbarMessageQueue="{Binding ElementName=MainSnackbar, Path=MessageQueue}" IsOpen="{Binding GlobalDataVM.IsWizardMessageDialogOpen}" DialogContent="{Binding GlobalDataVM.WizardMessageDialogContent}" CloseOnClickAway="False" DialogClosing="DialogHost_WizardOnDialogClosing">

        // ...

        </materialDesign:DialogHost> 

    </materialDesign:Transitioner>

</materialDesign:DialogHost> 

希望它会有所帮助。

© www.soinside.com 2019 - 2024. All rights reserved.