原文:Material design part 2 - build dialog
With the latest version 2.6 of MaterialDesignInXamlToolkit I decided to make a series of posts on MaterialDesignXamlToolkit. In this first post we will look at how to change the themes in our #WPF application with PowerShell. Thank to Kevin Bost @kitokeboo. In this new Part we focused on Dialog in MaterielDesignXamlToolkit.
1.Dialogs
The Material Design In XAML Toolkit’s dialogs implementation is designed to:
- Provide correct styling
- Allow any dialog to be constructed
- Compatible with code-behind
- Compatible with MVVM
- Compatible with pure XAML
- Work in applications with multiple windows
Dialogs are asynchronous so at some point you will have to deal with that in your code.
2.Ok but with which Control ?
The DialogHost control. It’s a content control, meaning the underlying content over which the popup dialog will be displayed can be targeted; to a specific area of your app, or the entire Window content.
<materialDesign:DialogHost>
<materialDesign:DialogHost.DialogContent>
<dialogContent />
</materialDesign:DialogHost.DialogContent> <mainContent /> </materialDesign:DialogHost> It’s also possible to use DialogHost.DialogContentTemplate in order to define Style, Font etc…
When the dialog is open, the underlying content will be disabled.
3 How to show and close Dialog
3.1 Open with XAML
There is a RoutedCommand can pe implemented in your Button via the CommandParameter with the this code :
<Button Command="{x:Static md:DialogHost.OpenDialogCommand}" />
3.2 Open with Property IsOpen
Now The Controls <materialDesign:DialogHost/> have a Property IsOpen wich accept value : True or False
My XAML Code :
<materialDesign:DialogHost Name="Dialog1">
<materialDesign:DialogHost.DialogContent> <StackPanel Margin="15"> <TextBlock Margin="10" Text="My First dialog" /> <CheckBox Name="Check_Me" Content="Check me"/> <Button Margin="10" Name="Close_ME" Content="Close" /> </StackPanel> </materialDesign:DialogHost.DialogContent> <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center"> <Button Name="Show" Content="Show Dialog" Margin="0,0,0,10"/> </StackPanel> </materialDesign:DialogHost> My PS1 Code :
$Show = $Form.findname("Show") $Dialog = $Form.findname("Dialog1") $Check_ME = $Form.findname("Check_Me") $Close = $Form.findname("Close_ME") $Show.add_Click({ $Dialog.IsOpen = $True }) $Close.add_Click({ $Dialog.IsOpen = $False })3.1 One example with a CheckBox
In this example the first Dialog here the code :
My XAML Code :
<materialDesign:DialogHost Name="Dialog1">
<materialDesign:DialogHost.DialogContent> <StackPanel Margin="15"> <TextBlock Margin="10" Text="My First dialog" /> <CheckBox Name="Check_Me" Content="Check me"/> <Button Margin="10" Name="Close_ME" Content="Close" /> </StackPanel> </materialDesign:DialogHost.DialogContent> <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center"> <Button Name="Show" Content="Show Dialog" Margin="0,0,0,10"/> </StackPanel> </materialDesign:DialogHost> My PS1 Code :
[System.Reflection.Assembly]::LoadWithPartialName('presentationframework') |Out-Null [System.Reflection.Assembly]::LoadFrom("assembly\System.Windows.Interactivity.dll") | Out-Null [System.Reflection.Assembly]::LoadFrom("assembly\MaterialDesignThemes.Wpf.dll") | Out-Null [System.Reflection.Assembly]::LoadFrom("assembly\MaterialDesignColors.dll") | Out-Null [System.Reflection.Assembly]::LoadWithPartialName("System.Windows.Forms") | Out-Null function LoadXml ($global:filename) { $XamlLoader=(New-Object System.Xml.XmlDocument) $XamlLoader.Load($filename) return $XamlLoader } $XamlMainWindow=LoadXml("MonInterface.xaml") $Reader=(New-Object System.Xml.XmlNodeReader $XamlMainWindow) $Form=[Windows.Markup.XamlReader]::Load($Reader) $Show = $Form.findname("Show") $Dialog = $Form.findname("Dialog1") $Check_ME = $Form.findname("Check_Me") $Close = $Form.findname("Close_ME") $Show.add_Click({ $Dialog.IsOpen = $True }) $Close.add_Click({ if ($Check_ME.IsChecked -eq $true) { [System.Windows.Forms.MessageBox]::Show("You close the Dialog with the CheckBox Checked") $Check_ME.IsChecked = $False } else { [System.Windows.Forms.MessageBox]::Show("You close the Dialog without the CheckBox Checked") } $Dialog.IsOpen =