Skip to content

Commit 3af623d

Browse files
wongjiahauwongjiahau
committed
Successfully injected XamlDisplayerPanel into Dialogs.xaml
1 parent faa3634 commit 3af623d

File tree

2 files changed

+92
-118
lines changed

2 files changed

+92
-118
lines changed

‎MainDemo.Wpf/Dialogs.xaml

Lines changed: 90 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
66
xmlns:system="clr-namespace:System;assembly=mscorlib"
77
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
8+
xmlns:codeDisplayer="clr-namespace:CodeDisplayer;assembly=CodeDisplayer"
89
mc:Ignorable="d"
910
d:DesignHeight="300" d:DesignWidth="300">
1011
<UserControl.Resources>
@@ -15,150 +16,121 @@
1516
</ResourceDictionary>
1617
</UserControl.Resources>
1718

18-
<Grid>
19-
<Grid.RowDefinitions>
20-
<RowDefinition Height="Auto" />
21-
<RowDefinition Height="*" />
22-
</Grid.RowDefinitions>
23-
<TextBlock TextWrapping="Wrap" Margin="32">Dialogs are supported via the DialogHost control which was designed to work with MVVM/binding, code-behind, routed commands, and a pure code-based API.</TextBlock>
24-
25-
<ScrollViewer HorizontalScrollBarVisibility="Auto" Grid.Row="1">
26-
<Grid VerticalAlignment="Top">
27-
<Grid.RowDefinitions>
28-
<RowDefinition Height="Auto" />
29-
<RowDefinition Height="*" />
30-
</Grid.RowDefinitions>
31-
<Grid.ColumnDefinitions>
32-
<ColumnDefinition Width="320" />
33-
<ColumnDefinition Width="320" />
34-
<ColumnDefinition Width="320" />
35-
<ColumnDefinition Width="320" />
36-
</Grid.ColumnDefinitions>
37-
38-
<!--#region SAMPLE 1-->
39-
<TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Top"
19+
<ScrollViewer HorizontalScrollBarVisibility="Auto" >
20+
<codeDisplayer:XamlDisplayerPanel x:Name="XamlDisplayerPanel">
21+
<TextBlock TextWrapping="Wrap" MaxWidth="300" Margin="32">Dialogs are supported via the DialogHost control which was designed to work with MVVM/binding, code-behind, routed commands, and a pure code-based API.</TextBlock>
22+
<TextBlock TextWrapping="Wrap" MaxWidth="300" HorizontalAlignment="Center" VerticalAlignment="Top"
4023
Margin="8 0 8 0"
4124
>SAMPLE 1: Localised dialog encapsulating specific content, launched from a routed command, response handled in code-behind.</TextBlock>
42-
<materialDesign:DialogHost DialogClosing="Sample1_DialogHost_OnDialogClosing"
43-
Grid.Column="0" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center">
44-
<materialDesign:DialogHost.DialogContent>
45-
<StackPanel Margin="16">
46-
<TextBlock>Add a new fruit.</TextBlock>
47-
<TextBox Margin="0 8 0 0" HorizontalAlignment="Stretch" x:Name="FruitTextBox" />
48-
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" >
49-
<Button Style="{StaticResource MaterialDesignFlatButton}"
25+
<materialDesign:DialogHost DialogClosing="Sample1_DialogHost_OnDialogClosing"
26+
HorizontalAlignment="Center" VerticalAlignment="Center">
27+
<materialDesign:DialogHost.DialogContent>
28+
<StackPanel Margin="16">
29+
<TextBlock>Add a new fruit.</TextBlock>
30+
<TextBox Margin="0 8 0 0" HorizontalAlignment="Stretch" x:Name="FruitTextBox" />
31+
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" >
32+
<Button Style="{StaticResource MaterialDesignFlatButton}"
5033
IsDefault="True"
5134
Margin="0 8 8 0"
5235
Command="materialDesign:DialogHost.CloseDialogCommand">
53-
<Button.CommandParameter>
54-
<system:Boolean>True</system:Boolean>
55-
</Button.CommandParameter>
56-
ACCEPT
57-
</Button>
58-
<Button Style="{StaticResource MaterialDesignFlatButton}"
36+
<Button.CommandParameter>
37+
<system:Boolean>True</system:Boolean>
38+
</Button.CommandParameter>
39+
ACCEPT
40+
</Button>
41+
<Button Style="{StaticResource MaterialDesignFlatButton}"
5942
IsCancel="True"
6043
Margin="0 8 8 0"
6144
Command="materialDesign:DialogHost.CloseDialogCommand">
62-
<Button.CommandParameter>
63-
<system:Boolean>False</system:Boolean>
64-
</Button.CommandParameter>
65-
CANCEL
66-
</Button>
67-
</StackPanel>
45+
<Button.CommandParameter>
46+
<system:Boolean>False</system:Boolean>
47+
</Button.CommandParameter>
48+
CANCEL
49+
</Button>
6850
</StackPanel>
69-
</materialDesign:DialogHost.DialogContent>
70-
<Border BorderThickness="1" BorderBrush="{DynamicResource PrimaryHueMidBrush}"
51+
</StackPanel>
52+
</materialDesign:DialogHost.DialogContent>
53+
<Border BorderThickness="1" BorderBrush="{DynamicResource PrimaryHueMidBrush}"
7154
MinWidth="256" MinHeight="256" ClipToBounds="True">
72-
<Grid>
73-
<Grid.RowDefinitions>
74-
<RowDefinition Height="*" />
75-
<RowDefinition Height="Auto" />
76-
</Grid.RowDefinitions>
77-
<ListBox x:Name="FruitListBox">
78-
<ListBoxItem>Apple</ListBoxItem>
79-
<ListBoxItem>Banana</ListBoxItem>
80-
<ListBoxItem>Pear</ListBoxItem>
81-
</ListBox>
82-
<materialDesign:ColorZone Mode="PrimaryMid" Grid.Row="1" Effect="{DynamicResource MaterialDesignShadowDepth5}">
83-
<TextBlock Margin="16">Fruit Bowl</TextBlock>
84-
</materialDesign:ColorZone>
85-
<Button Style="{StaticResource MaterialDesignFloatingActionMiniAccentButton}"
55+
<Grid>
56+
<Grid.RowDefinitions>
57+
<RowDefinition Height="*" />
58+
<RowDefinition Height="Auto" />
59+
</Grid.RowDefinitions>
60+
<ListBox x:Name="FruitListBox">
61+
<ListBoxItem>Apple</ListBoxItem>
62+
<ListBoxItem>Banana</ListBoxItem>
63+
<ListBoxItem>Pear</ListBoxItem>
64+
</ListBox>
65+
<materialDesign:ColorZone Mode="PrimaryMid" Grid.Row="1" Effect="{DynamicResource MaterialDesignShadowDepth5}">
66+
<TextBlock Margin="16">Fruit Bowl</TextBlock>
67+
</materialDesign:ColorZone>
68+
<Button Style="{StaticResource MaterialDesignFloatingActionMiniAccentButton}"
8669
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
8770
VerticalAlignment="Bottom" HorizontalAlignment="Right"
8871
Grid.Row="0" Margin="0 0 28 -20">
89-
<Viewbox Width="22" Height="22">
90-
<Canvas Width="24" Height="24">
91-
<Path Data="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button}, Path=Foreground}" />
92-
</Canvas>
93-
</Viewbox>
94-
</Button>
95-
</Grid>
96-
</Border>
97-
</materialDesign:DialogHost>
98-
<!--#endregion -->
99-
100-
<!--#region SAMPLE 2-->
101-
<TextBlock Grid.Column="1" Grid.Row="0" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8 0 8 0">SAMPLE 2: Top level dialog, using OpenDialog, passing content via the Parameter. You can pass a view model, provided a corresponding DataTemplate can be found in the scope of the root DialogHost.</TextBlock>
102-
<StackPanel Grid.Column="1" Grid.Row="1" VerticalAlignment="Center">
103-
<!--the request to open the dialog will bubble up to the top-most DialogHost, but we can used the attached property based event to handle the response -->
104-
<Button Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
72+
<Viewbox Width="22" Height="22">
73+
<Canvas Width="24" Height="24">
74+
<Path Data="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button}, Path=Foreground}" />
75+
</Canvas>
76+
</Viewbox>
77+
</Button>
78+
</Grid>
79+
</Border>
80+
</materialDesign:DialogHost>
81+
<TextBlock MaxWidth="300" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8 0 8 0">SAMPLE 2: Top level dialog, using OpenDialog, passing content via the Parameter. You can pass a view model, provided a corresponding DataTemplate can be found in the scope of the root DialogHost.</TextBlock>
82+
<StackPanel VerticalAlignment="Center">
83+
<!--the request to open the dialog will bubble up to the top-most DialogHost, but we can used the attached property based event to handle the response -->
84+
<Button Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
10585
materialDesign:DialogHost.DialogClosingAttached="Sample2_DialogHost_OnDialogClosing"
10686
Width="128">
107-
<Button.CommandParameter>
108-
<StackPanel Margin="16">
109-
<ProgressBar Style="{DynamicResource MaterialDesignCircularProgressBar}" HorizontalAlignment="Center" Margin="16" IsIndeterminate="True" Value="0" />
110-
<Button Style="{StaticResource MaterialDesignFlatButton}" IsCancel="True"
87+
<Button.CommandParameter>
88+
<StackPanel Margin="16">
89+
<ProgressBar Style="{DynamicResource MaterialDesignCircularProgressBar}" HorizontalAlignment="Center" Margin="16" IsIndeterminate="True" Value="0" />
90+
<Button Style="{StaticResource MaterialDesignFlatButton}" IsCancel="True"
11191
Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}"
11292
CommandParameter="Sample2Cancel"
11393
HorizontalAlignment="Center">CANCEL</Button>
114-
</StackPanel>
115-
</Button.CommandParameter>
116-
PASS VIEW
117-
</Button>
118-
<Button Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
94+
</StackPanel>
95+
</Button.CommandParameter>
96+
PASS VIEW
97+
</Button>
98+
<Button Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
11999
Width="128" Margin="0 32 0 0">
120-
<Button.CommandParameter>
121-
<!-- the simplest view model of all, a DateTime. the view can be found in the resources of MainWindow.xaml -->
122-
<system:DateTime>1966-JUL-30</system:DateTime>
123-
</Button.CommandParameter>
124-
PASS MODEL
125-
</Button>
126-
</StackPanel>
127-
<!--#endregion-->
128-
129-
<!--#region SAMPLE 3-->
130-
<TextBlock Grid.Column="2" Grid.Row="0" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8 0 8 0">SAMPLE 3: Open and listen to the dialog entirely from code in a view model.</TextBlock>
131-
<!-- Executes a command on DialogsViewModel.cs, which will launch the dialog from code -->
132-
<StackPanel Grid.Column="2" Grid.Row="1" >
133-
<Button Command="{Binding RunDialogCommand}"
100+
<Button.CommandParameter>
101+
<!-- the simplest view model of all, a DateTime. the view can be found in the resources of MainWindow.xaml -->
102+
<system:DateTime>1966-JUL-30</system:DateTime>
103+
</Button.CommandParameter>
104+
PASS MODEL
105+
</Button>
106+
</StackPanel>
107+
<TextBlock MaxWidth="300" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8 0 8 0">SAMPLE 3: Open and listen to the dialog entirely from code in a view model.</TextBlock>
108+
<StackPanel >
109+
<!-- Executes a command on DialogsViewModel.cs, which will launch the dialog from code -->
110+
<Button Command="{Binding RunDialogCommand}"
134111
Width="128">
135-
RUN CODE
136-
</Button>
137-
<Button Command="{Binding RunExtendedDialogCommand}"
112+
RUN CODE
113+
</Button>
114+
<Button Command="{Binding RunExtendedDialogCommand}"
138115
Width="128" Margin="0 32 0 0">
139-
EXTENDED
140-
</Button>
141-
</StackPanel>
142-
<!--#endregion-->
143-
144-
145-
<!--#region SAMPLE 4-->
146-
<TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Top"
147-
Grid.Column="3" Margin="8 0 8 0"
116+
EXTENDED
117+
</Button>
118+
</StackPanel>
119+
<TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Top"
120+
Margin="8 0 8 0" MaxWidth="300"
148121
>SAMPLE 4: Dialog managed from view model using IsOpen and custom commands (ignoring the provided routed commands).</TextBlock>
149-
<materialDesign:DialogHost Grid.Column="3" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center"
122+
<materialDesign:DialogHost HorizontalAlignment="Center" VerticalAlignment="Center"
150123
IsOpen="{Binding IsSample4DialogOpen}"
151124
DialogContent="{Binding Sample4Content}"
152125
CloseOnClickAway="True">
153-
<Border BorderThickness="1" BorderBrush="{DynamicResource PrimaryHueMidBrush}"
126+
<Border BorderThickness="1" BorderBrush="{DynamicResource PrimaryHueMidBrush}"
154127
MinWidth="256" MinHeight="256" ClipToBounds="True">
155-
<Button HorizontalAlignment="Center" VerticalAlignment="Center"
128+
<Button HorizontalAlignment="Center" VerticalAlignment="Center"
156129
Command="{Binding OpenSample4DialogCommand}"
157130
>RUN</Button>
158-
</Border>
159-
</materialDesign:DialogHost>
160-
<!--#endregion-->
161-
</Grid>
162-
</ScrollViewer>
163-
</Grid>
131+
</Border>
132+
</materialDesign:DialogHost>
133+
</codeDisplayer:XamlDisplayerPanel>
134+
</ScrollViewer>
164135
</UserControl>
136+

‎MainDemo.Wpf/Dialogs.xaml.cs

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
using System.Windows.Media.Imaging;
1313
using System.Windows.Navigation;
1414
using System.Windows.Shapes;
15+
using MaterialDesignDemo.Helper;
1516
using MaterialDesignThemes.Wpf;
1617

1718
namespace MaterialDesignColors.WpfExample
@@ -24,6 +25,7 @@ public partial class Dialogs : UserControl
2425
public Dialogs()
2526
{
2627
InitializeComponent();
28+
XamlDisplayerPanel.Initialize(new SourceRouter(this.GetType().Name).GetSource());
2729
}
2830

2931
private void Sample1_DialogHost_OnDialogClosing(object sender, DialogClosingEventArgs eventArgs)

0 commit comments

Comments
 (0)