Skip to content

Commit 241575f

Browse files
authored
Merge pull request #1116 from WilliamABradley/TextToolbar2
TextToolbar Control for Editing RichEditBox
2 parents c2c9a04 + 0d945a4 commit 241575f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+3799
-2
lines changed

Microsoft.Toolkit.Uwp.SampleApp/Microsoft.Toolkit.Uwp.SampleApp.csproj

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -303,6 +303,7 @@
303303
<Content Include="SamplePages\OneDrive Service\OneDriveLogo.png" />
304304
<Content Include="SamplePages\Saturation\SaturationBehavior.png" />
305305
<Content Include="SamplePages\OrbitView\OrbitView.png" />
306+
<Content Include="SamplePages\TextToolbar\TextToolbar.png" />
306307
<Content Include="SamplePages\TileControl\Animations.png" />
307308
<Content Include="SamplePages\TileControl\TileControl.png" />
308309
<Content Include="SamplePages\Offset\OffsetBehavior.png" />
@@ -421,6 +422,8 @@
421422
<Content Include="SamplePages\Carousel\CarouselCode.bind" />
422423
<Content Include="SamplePages\AlignmentGrid\AlignmentGridXaml.bind" />
423424
<Content Include="SamplePages\FocusTracker\FocusTrackerXaml.bind" />
425+
<Content Include="SamplePages\TextToolbar\TextToolbar.bind" />
426+
<Content Include="SamplePages\TextToolbar\TextToolbarCode.bind" />
424427
<Content Include="SamplePages\BluetoothLEHelper\BluetoothLEHelperCode.bind" />
425428
<Content Include="SamplePages\OrbitView\OrbitViewXaml.bind" />
426429
<Content Include="SamplePages\Menu\Menu.bind" />
@@ -459,6 +462,9 @@
459462
<DependentUpon>FocusTrackerPage.xaml</DependentUpon>
460463
</Compile>
461464
<Compile Include="SamplePages\BackgroundTaskHelper\TestBackgroundTask.cs" />
465+
<Compile Include="SamplePages\TextToolbar\TextToolbarPage.xaml.cs">
466+
<DependentUpon>TextToolbarPage.xaml</DependentUpon>
467+
</Compile>
462468
<Compile Include="SamplePages\OrbitView\OrbitViewPage.xaml.cs">
463469
<DependentUpon>OrbitViewPage.xaml</DependentUpon>
464470
</Compile>
@@ -705,6 +711,10 @@
705711
<Generator>MSBuild:Compile</Generator>
706712
<SubType>Designer</SubType>
707713
</Page>
714+
<Page Include="SamplePages\TextToolbar\TextToolbarPage.xaml">
715+
<Generator>MSBuild:Compile</Generator>
716+
<SubType>Designer</SubType>
717+
</Page>
708718
<Page Include="SamplePages\ListViewBase\ListViewBasePage.xaml">
709719
<SubType>Designer</SubType>
710720
<Generator>MSBuild:Compile</Generator>
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.TextToolbarPage"
2+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4+
xmlns:common="using:Microsoft.Toolkit.Uwp.SampleApp.Common"
5+
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
6+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
7+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
8+
mc:Ignorable="d">
9+
10+
<StackPanel x:Name="MainGrid"
11+
RequestedTheme="@[Theme:Enum:ElementTheme.Default]"
12+
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
13+
<controls:TextToolbar x:Name="Toolbar"
14+
Editor="{x:Bind EditZone}"
15+
IsEnabled="@[IsEnabled:Bool:True]"
16+
Format="@[Format:Enum:Format.RichText]"
17+
Background="#4C4F4F4F" />
18+
19+
<RichEditBox x:Name="EditZone"
20+
PlaceholderText="Enter Text Here"
21+
TextWrapping="Wrap"
22+
TextChanged="EditZone_TextChanged"
23+
VerticalContentAlignment="Stretch"
24+
Background="{x:Null}"
25+
BorderBrush="{x:Null}"
26+
MinHeight="300" />
27+
28+
<StackPanel x:Name="MD"
29+
Padding="10"
30+
Visibility="{Binding Format.Value, Mode=OneWay, Converter={StaticResource IsFormatMarkdown}}">
31+
<TextBlock Text="MarkDown Preview"
32+
Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
33+
Style="{StaticResource SubtitleTextBlockStyle}" />
34+
<controls:MarkdownTextBlock x:Name="Previewer"
35+
Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
36+
LinkClicked="Previewer_LinkClicked"
37+
Canvas.ZIndex="99" />
38+
</StackPanel>
39+
</StackPanel>
40+
</Page>
20 KB
Loading
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
private void Previewer_LinkClicked(object sender, LinkClickedEventArgs e)
2+
{
3+
try
4+
{
5+
var link = new Uri(e.Link);
6+
var linkOpen = Task.Run(() => Launcher.LaunchUriAsync(link));
7+
}
8+
catch
9+
{
10+
}
11+
}
12+
13+
private void EditZone_TextChanged(object sender, Windows.UI.Xaml.RoutedEventArgs e)
14+
{
15+
string text = Toolbar.Formatter?.Text;
16+
Previewer.Text = string.IsNullOrWhiteSpace(text) ? "Nothing to Preview" : text;
17+
}
18+
19+
private int DemoCounter { get; set; } = 0;
20+
21+
private void AddCustomButton()
22+
{
23+
string demoText = "Demo";
24+
demoText = DemoCounter > 0 ? demoText + DemoCounter : demoText;
25+
26+
int keycode = (int)VirtualKey.Number0 + DemoCounter;
27+
VirtualKey? shortcut = null;
28+
29+
if (keycode <= (int)VirtualKey.Number9)
30+
{
31+
shortcut = (VirtualKey)keycode;
32+
}
33+
34+
DemoCounter++;
35+
36+
var demoButton = new ToolbarButton
37+
{
38+
Icon = new SymbolIcon { Symbol = Symbol.ReportHacked },
39+
ToolTip = demoText,
40+
ShortcutKey = shortcut,
41+
Click = () =>
42+
{
43+
if (Toolbar.Formatter is MarkDownFormatter md)
44+
{
45+
md.SetSelection($"[{demoText}]", $"[/{demoText}]");
46+
}
47+
else
48+
{
49+
Toolbar.Formatter.Selected.Text = $"This was filled by {demoText} button ";
50+
}
51+
}
52+
};
53+
54+
Toolbar.CustomButtons.Add(demoButton);
55+
}
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.TextToolbarPage"
2+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4+
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
5+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
6+
xmlns:converters="using:Microsoft.Toolkit.Uwp.UI.Converters"
7+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
8+
mc:Ignorable="d">
9+
10+
<Page.Resources>
11+
<converters:ToolbarFormatActiveConverter x:Key="IsFormatMarkdown"
12+
Format="MarkDown" />
13+
</Page.Resources>
14+
15+
<Grid x:Name="MainGrid"
16+
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
17+
RequestedTheme="{Binding Theme.Value, Mode=TwoWay}">
18+
<Grid.RowDefinitions>
19+
<RowDefinition Height="Auto" />
20+
<RowDefinition />
21+
</Grid.RowDefinitions>
22+
<controls:TextToolbar x:Name="Toolbar"
23+
Background="#4C4F4F4F"
24+
Editor="{x:Bind EditZone}"
25+
Format="{Binding Format.Value, Mode=TwoWay}"
26+
IsEnabled="{Binding IsEnabled.Value, Mode=TwoWay}" />
27+
<ScrollViewer Grid.Row="1">
28+
<Grid>
29+
<Grid.RowDefinitions>
30+
<RowDefinition />
31+
<RowDefinition />
32+
</Grid.RowDefinitions>
33+
34+
<RichEditBox x:Name="EditZone"
35+
MinHeight="300"
36+
VerticalContentAlignment="Stretch"
37+
Background="{x:Null}"
38+
BorderBrush="{x:Null}"
39+
PlaceholderText="Enter Text Here"
40+
TextChanged="EditZone_TextChanged"
41+
TextWrapping="Wrap" />
42+
43+
<Grid x:Name="MD"
44+
Grid.Row="1"
45+
Padding="10"
46+
Visibility="{Binding Format.Value, Mode=OneWay, Converter={StaticResource IsFormatMarkdown}}">
47+
<Grid.RowDefinitions>
48+
<RowDefinition Height="Auto" />
49+
<RowDefinition />
50+
</Grid.RowDefinitions>
51+
<TextBlock Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
52+
Style="{StaticResource SubtitleTextBlockStyle}"
53+
Text="MarkDown Preview" />
54+
<controls:MarkdownTextBlock x:Name="Previewer"
55+
Grid.Row="1"
56+
Canvas.ZIndex="99"
57+
Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
58+
LinkClicked="Previewer_LinkClicked"
59+
ScrollViewer.IsVerticalRailEnabled="False" />
60+
</Grid>
61+
</Grid>
62+
</ScrollViewer>
63+
</Grid>
64+
</Page>
Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
// ******************************************************************
2+
// Copyright (c) Microsoft. All rights reserved.
3+
// This code is licensed under the MIT License (MIT).
4+
// THE CODE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
5+
// INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
6+
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
7+
// IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
8+
// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
9+
// TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH
10+
// THE CODE OR THE USE OR OTHER DEALINGS IN THE CODE.
11+
// ******************************************************************
12+
13+
using System;
14+
using System.Threading.Tasks;
15+
using Microsoft.Toolkit.Uwp.UI.Controls;
16+
using Microsoft.Toolkit.Uwp.UI.Controls.TextToolbarButtons;
17+
using Microsoft.Toolkit.Uwp.UI.Controls.TextToolbarFormats.MarkDown;
18+
using Windows.System;
19+
using Windows.UI.Xaml.Controls;
20+
using Windows.UI.Xaml.Navigation;
21+
22+
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
23+
{
24+
public sealed partial class TextToolbarPage
25+
{
26+
public TextToolbarPage()
27+
{
28+
InitializeComponent();
29+
}
30+
31+
protected override void OnNavigatedTo(NavigationEventArgs e)
32+
{
33+
base.OnNavigatedTo(e);
34+
35+
Shell.Current.RegisterNewCommand("Add/Remove Bold Button", (sender, args) =>
36+
{
37+
var button = Toolbar.GetDefaultButton(ButtonType.Bold);
38+
button.Visibility = button.Visibility == Windows.UI.Xaml.Visibility.Visible ? Windows.UI.Xaml.Visibility.Collapsed : Windows.UI.Xaml.Visibility.Visible;
39+
});
40+
41+
Shell.Current.RegisterNewCommand("Add Custom Button", (sender, args) =>
42+
{
43+
AddCustomButton();
44+
});
45+
}
46+
47+
private int DemoCounter { get; set; } = 0;
48+
49+
private void AddCustomButton()
50+
{
51+
string demoText = "Demo";
52+
demoText = DemoCounter > 0 ? demoText + DemoCounter : demoText;
53+
54+
int keycode = (int)VirtualKey.Number0 + DemoCounter;
55+
VirtualKey? shortcut = null;
56+
57+
if (keycode <= (int)VirtualKey.Number9)
58+
{
59+
shortcut = (VirtualKey)keycode;
60+
}
61+
62+
DemoCounter++;
63+
64+
var demoButton = new ToolbarButton
65+
{
66+
Icon = new SymbolIcon { Symbol = Symbol.ReportHacked },
67+
ToolTip = demoText,
68+
ShortcutKey = shortcut,
69+
Activation = (b) =>
70+
{
71+
var md = Toolbar.Formatter as MarkDownFormatter;
72+
if (md != null)
73+
{
74+
md.SetSelection($"[{demoText}]", $"[/{demoText}]");
75+
}
76+
else
77+
{
78+
Toolbar.Formatter.Selected.Text = $"This was filled by {demoText} button ";
79+
}
80+
}
81+
};
82+
83+
Toolbar.CustomButtons.Add(demoButton);
84+
}
85+
86+
private void Previewer_LinkClicked(object sender, LinkClickedEventArgs e)
87+
{
88+
try
89+
{
90+
var link = new Uri(e.Link);
91+
var linkOpen = Task.Run(() => Launcher.LaunchUriAsync(link));
92+
}
93+
catch
94+
{
95+
}
96+
}
97+
98+
private void EditZone_TextChanged(object sender, Windows.UI.Xaml.RoutedEventArgs e)
99+
{
100+
var md = Toolbar.Formatter as MarkDownFormatter;
101+
if (md != null)
102+
{
103+
string text = md.Text;
104+
Previewer.Text = string.IsNullOrWhiteSpace(text) ? "Nothing to Preview" : text;
105+
}
106+
}
107+
}
108+
}

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/samples.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,16 @@
33
"Name": "Controls",
44
"Icon": "Icons/Foundation.png",
55
"Samples": [
6+
{
7+
"Name": "TextToolbar",
8+
"Type": "TextToolbarPage",
9+
"About": "A Toolbar for Editing Text attached to a RichEditBox. It can format RTF and Markdown, or use a Custom Formatter, and specify your own Formatter with Buttons and Actions.",
10+
"CodeUrl": "https://github.com/Microsoft/UWPCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Controls/TextToolbar",
11+
"XamlCodeFile": "TextToolbar.bind",
12+
"CodeFile": "TextToolbarCode.bind",
13+
"Icon": "/SamplePages/TextToolbar/TextToolbar.png",
14+
"DocumentationUrl": "https://raw.githubusercontent.com/Microsoft/UWPCommunityToolkit/dev/docs/controls/TextToolbar.md"
15+
},
616
{
717
"Name": "Carousel",
818
"Type": "CarouselPage",

Microsoft.Toolkit.Uwp.UI.Controls/Microsoft.Toolkit.Uwp.UI.Controls.csproj

Lines changed: 44 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,33 @@
156156
<Compile Include="OrbitView\OrbitViewPanelItemsArrangedArgs.cs" />
157157
<Compile Include="SurfaceDialTextboxHelper\SurfaceDialTextboxHelper.cs" />
158158
<Compile Include="TextBoxMask\TextBoxMask.cs" />
159-
<Compile Include="TextBoxRegEx\TextBoxRegex.cs" />
159+
<Compile Include="TextToolbar\Formats\ButtonActions.cs" />
160+
<Compile Include="TextToolbar\Formats\Format.cs" />
161+
<Compile Include="TextToolbar\Formats\Formatter.cs" />
162+
<Compile Include="TextToolbar\Formats\MarkDown\MarkDownButtonActions.cs" />
163+
<Compile Include="TextToolbar\Formats\MarkDown\MarkDownFormatter.cs" />
164+
<Compile Include="TextToolbar\Formats\RichText\RichTextButtonActions.cs" />
165+
<Compile Include="TextToolbar\Formats\RichText\RichTextFormatter.cs" />
166+
<Compile Include="TextToolbar\ToolbarFormatActiveConverter.cs" />
167+
<Compile Include="TextToolbar\ShortcutKeyRequestArgs.cs" />
168+
<Compile Include="TextToolbar\Symbols\List.cs" />
169+
<Compile Include="TextToolbar\Symbols\NumberedList.cs" />
170+
<Compile Include="TextToolbar\Symbols\Symbol.cs" />
171+
<Compile Include="TextToolbar\TextToolbar.cs" />
172+
<Compile Include="TextToolbar\TextToolbar.Methods.cs" />
173+
<Compile Include="TextToolbar\TextToolbar.Events.cs" />
174+
<Compile Include="TextToolbar\TextToolbarStrings.cs" />
175+
<Compile Include="TextToolbar\TextToolbar.Properties.cs" />
176+
<Compile Include="TextToolbar\ToolbarItems\ButtonMap.cs" />
177+
<Compile Include="TextToolbar\ToolbarItems\ButtonType.cs" />
178+
<Compile Include="TextToolbar\ToolbarItems\Common\CommonButtons.cs" />
179+
<Compile Include="TextToolbar\ToolbarItems\Common\CommonButtons.Events.cs" />
180+
<Compile Include="TextToolbar\ToolbarItems\DefaultButton.cs" />
181+
<Compile Include="TextToolbar\ToolbarItems\IToolbarItem.cs" />
182+
<Compile Include="TextToolbar\ToolbarItems\DefaultButtonModificationList.cs" />
183+
<Compile Include="TextToolbar\ToolbarItems\ToolbarButton.cs" />
184+
<Compile Include="TextToolbar\ToolbarItems\ToolbarSeparator.cs" />
185+
<Compile Include="TextBoxRegex\TextBoxRegex.cs" />
160186
<Compile Include="TileControl\TileControl.cs" />
161187
<Compile Include="WrapPanel\WrapPanel.cs" />
162188
<Compile Include="WrapPanel\WrapPanel.Data.cs" />
@@ -247,6 +273,22 @@
247273
<Generator>MSBuild:Compile</Generator>
248274
<SubType>Designer</SubType>
249275
</Page>
276+
<Page Include="TextToolbar\Symbols\Symbols.xaml">
277+
<Generator>MSBuild:Compile</Generator>
278+
<SubType>Designer</SubType>
279+
</Page>
280+
<Page Include="TextToolbar\TextToolbar.xaml">
281+
<Generator>MSBuild:Compile</Generator>
282+
<SubType>Designer</SubType>
283+
</Page>
284+
<Page Include="TextToolbar\ToolbarItems\ToolbarButton.xaml">
285+
<Generator>MSBuild:Compile</Generator>
286+
<SubType>Designer</SubType>
287+
</Page>
288+
<Page Include="TextToolbar\ToolbarItems\ToolbarSeparator.xaml">
289+
<Generator>MSBuild:Compile</Generator>
290+
<SubType>Designer</SubType>
291+
</Page>
250292
<Page Include="OrbitView\OrbitView.xaml">
251293
<Generator>MSBuild:Compile</Generator>
252294
<SubType>Designer</SubType>
@@ -328,7 +370,7 @@
328370
<StartupObject />
329371
</PropertyGroup>
330372
<Import Project="$(MSBuildExtensionsPath)\Microsoft\WindowsXaml\v$(VisualStudioVersion)\Microsoft.Windows.UI.Xaml.CSharp.targets" />
331-
<!-- To modify your build process, add your task inside one of the targets below and uncomment it.
373+
<!-- To modify your build process, add your task inside one of the targets below and uncomment it.
332374
Other similar extension points exist, see Microsoft.Common.targets.
333375
<Target Name="BeforeBuild">
334376
</Target>

0 commit comments

Comments
 (0)