Skip to content

Commit 3e69b15

Browse files
author
msftbot[bot]
authored
Infinite Canvas dropdown font selector 2 (#3914)
<!-- 🚨 Please Do Not skip any instructions and information mentioned below as they are all required and essential to evaluate and test the PR. By fulfilling all the required information you will be able to reduce the volume of questions and most likely help merge the PR faster 🚨 --> <!-- 📝 It is preferred if you keep the "☑️ Allow edits by maintainers" checked in the Pull Request Template as it increases collaboration with the Toolkit maintainers by permitting commits to your PR branch (only) created from your fork. This can let us quickly make fixes for minor typos or forgotten StyleCop issues during review without needing to wait on you doing extra work. Let us help you help us! 🎉 --> ## Continued off of #3211 <!-- Add the relevant issue number after the "#" mentioned above (for ex: Fixes #1234) which will automatically close the issue once the PR is merged. --> <!-- Add a brief overview here of the feature/bug & fix. --> User can now input a font size via typed text and not only selection from out provided sizes. ## PR Type What kind of change does this PR introduce? <!-- Please uncomment one or more that apply to this PR. --> <!-- - Bugfix --> - Feature <!-- - Code style update (formatting) --> <!-- - Refactoring (no functional changes, no api changes) --> <!-- - Build or CI related changes --> <!-- - Documentation content changes --> <!-- - Sample app changes --> <!-- - Other... Please describe: --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying, or link to a relevant issue. --> You have to enter a font size with text in the textbox, I used the standard font sizes that are given in Microsoft Office PowerPoint (increments from 8 to 96). ## What is the new behavior? <!-- Describe how was this issue resolved or changed? --> User can select the font size themselves now ## PR Checklist Please check if your PR fulfills the following requirements: - [ ] Tested code with current [supported SDKs](../readme.md#supported) - [ ] Pull Request has been submitted to the documentation repository [instructions](..\contributing.md#docs). Link: <!-- docs PR link --> - [ ] Sample in sample app has been added / updated (for bug fixes / features) - [ ] Icon has been created (if new sample) following the [Thumbnail Style Guide and templates](https://github.com/windows-toolkit/WindowsCommunityToolkit-design-assets) - [ ] New major technical changes in the toolkit have or will be added to the [Wiki](https://github.com/windows-toolkit/WindowsCommunityToolkit/wiki) e.g. build changes, source generators, testing infrastructure, sample creation changes, etc... - [ ] Tests for the changes have been added (for bug fixes / features) (if applicable) - [ ] Header has been added to all new source files (run *build/UpdateHeaders.bat*) - [ ] Contains **NO** breaking changes <!-- If this PR contains a breaking change, please describe the impact and migration path for existing applications below. Please note that breaking changes are likely to be rejected within minor release cycles or held until major versions. --> ## Other information
2 parents d3426fa + 196dad9 commit 3e69b15

File tree

5 files changed

+87
-54
lines changed

5 files changed

+87
-54
lines changed

Microsoft.Toolkit.Uwp.UI.Controls.Media/InfiniteCanvas/Commands/InfiniteCanvasCreateTextBoxCommand.cs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ internal class InfiniteCanvasCreateTextBoxCommand : IInfiniteCanvasCommand
1212
private readonly List<IDrawable> _drawableList;
1313
private readonly TextDrawable _drawable;
1414

15-
public InfiniteCanvasCreateTextBoxCommand(List<IDrawable> drawableList, double x, double y, double width, double height, int textFontSize, string text, Color color, bool isBold, bool isItalic)
15+
public InfiniteCanvasCreateTextBoxCommand(List<IDrawable> drawableList, double x, double y, double width, double height, float textFontSize, string text, Color color, bool isBold, bool isItalic)
1616
{
1717
_drawable = new TextDrawable(
1818
x,

Microsoft.Toolkit.Uwp.UI.Controls.Media/InfiniteCanvas/Controls/InfiniteCanvasVirtualDrawingSurface.Commands.cs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ internal void ExecuteUpdateTextBoxFontSize(float newValue)
7979
ExecuteCommand(command);
8080
}
8181

82-
internal void ExecuteCreateTextBox(double x, double y, double width, double height, int textFontSize, string text, Color color, bool isBold, bool isItalic)
82+
internal void ExecuteCreateTextBox(double x, double y, double width, double height, float textFontSize, string text, Color color, bool isBold, bool isItalic)
8383
{
8484
var command = new InfiniteCanvasCreateTextBoxCommand(_drawableList, x, y, width, height, textFontSize, text, color, isBold, isItalic);
8585
ExecuteCommand(command);

Microsoft.Toolkit.Uwp.UI.Controls.Media/InfiniteCanvas/InfiniteCanvas.TextBox.cs

Lines changed: 48 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -28,28 +28,20 @@ public partial class InfiniteCanvas
2828
"Right",
2929
"Up",
3030
"Left",
31-
"Down"
31+
"Down",
32+
"Enter"
3233
};
3334

3435
private Point _lastInputPoint;
3536

3637
private TextDrawable SelectedTextDrawable => _drawingSurfaceRenderer.GetSelectedTextDrawable();
3738

38-
private int _lastValidTextFontSizeValue = DefaultFontValue;
39+
private float _textFontSize = DefaultFontValue;
3940

40-
private int TextFontSize
41+
private void SetFontSize(float newSize)
4142
{
42-
get
43-
{
44-
if (!string.IsNullOrWhiteSpace(_canvasTextBoxFontSizeTextBox.Text) &&
45-
Regex.IsMatch(_canvasTextBoxFontSizeTextBox.Text, "^[0-9]*$"))
46-
{
47-
var fontSize = int.Parse(_canvasTextBoxFontSizeTextBox.Text);
48-
_lastValidTextFontSizeValue = fontSize;
49-
}
50-
51-
return _lastValidTextFontSizeValue;
52-
}
43+
_textFontSize = newSize;
44+
_canvasTextBox.UpdateFontSize(newSize);
5345
}
5446

5547
private void InkScrollViewer_PreviewKeyDown(object sender, KeyRoutedEventArgs e)
@@ -93,13 +85,34 @@ private void CanvasTextBoxItalicButton_Clicked(object sender, RoutedEventArgs e)
9385
}
9486
}
9587

96-
private void CanvasTextBoxFontSizeTextBox_TextChanged(object sender, TextChangedEventArgs e)
88+
private void CanvasComboBoxFontSizeTextBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
9789
{
98-
_canvasTextBox.UpdateFontSize(TextFontSize);
99-
if (SelectedTextDrawable != null)
90+
if (sender is ComboBox s
91+
&& s.SelectedItem is ComboBoxItem selectedItem
92+
&& selectedItem.Content is string selectedText
93+
&& float.TryParse(selectedText, out var sizeNumb))
10094
{
101-
_drawingSurfaceRenderer.ExecuteUpdateTextBoxFontSize(TextFontSize);
102-
ReDrawCanvas();
95+
SetFontSize(sizeNumb);
96+
97+
if (SelectedTextDrawable != null)
98+
{
99+
_drawingSurfaceRenderer.ExecuteUpdateTextBoxFontSize(sizeNumb);
100+
ReDrawCanvas();
101+
}
102+
}
103+
}
104+
105+
private void CanvasComboBoxFontSizeTextBox_TextSubmitted(ComboBox sender, ComboBoxTextSubmittedEventArgs args)
106+
{
107+
if (float.TryParse(args.Text, out var size))
108+
{
109+
SetFontSize(size);
110+
111+
if (SelectedTextDrawable != null)
112+
{
113+
_drawingSurfaceRenderer.ExecuteUpdateTextBoxFontSize(size);
114+
ReDrawCanvas();
115+
}
103116
}
104117
}
105118

@@ -147,20 +160,22 @@ private void CanvasTextBox_TextChanged(object sender, string text)
147160
ReDrawCanvas();
148161
return;
149162
}
163+
else
164+
{
165+
_drawingSurfaceRenderer.ExecuteCreateTextBox(
166+
_lastInputPoint.X,
167+
_lastInputPoint.Y,
168+
_canvasTextBox.GetEditZoneWidth(),
169+
_canvasTextBox.GetEditZoneHeight(),
170+
_textFontSize,
171+
text,
172+
_canvasTextBoxColorPicker.Color,
173+
_canvasTextBoxBoldButton.IsChecked ?? false,
174+
_canvasTextBoxItalicButton.IsChecked ?? false);
150175

151-
_drawingSurfaceRenderer.ExecuteCreateTextBox(
152-
_lastInputPoint.X,
153-
_lastInputPoint.Y,
154-
_canvasTextBox.GetEditZoneWidth(),
155-
_canvasTextBox.GetEditZoneHeight(),
156-
TextFontSize,
157-
text,
158-
_canvasTextBoxColorPicker.Color,
159-
_canvasTextBoxBoldButton.IsChecked ?? false,
160-
_canvasTextBoxItalicButton.IsChecked ?? false);
161-
162-
ReDrawCanvas();
163-
_drawingSurfaceRenderer.UpdateSelectedTextDrawable();
176+
ReDrawCanvas();
177+
_drawingSurfaceRenderer.UpdateSelectedTextDrawable();
178+
}
164179
}
165180

166181
private void InkScrollViewer_PointerPressed(object sender, PointerRoutedEventArgs e)
@@ -179,20 +194,17 @@ private void InkScrollViewer_PointerPressed(object sender, PointerRoutedEventArg
179194

180195
Canvas.SetLeft(_canvasTextBox, SelectedTextDrawable.Bounds.X);
181196
Canvas.SetTop(_canvasTextBox, SelectedTextDrawable.Bounds.Y);
182-
_canvasTextBox.UpdateFontSize(SelectedTextDrawable.FontSize);
183197
_canvasTextBox.UpdateFontStyle(SelectedTextDrawable.IsItalic);
184198
_canvasTextBox.UpdateFontWeight(SelectedTextDrawable.IsBold);
185199

186200
// Updating toolbar
187201
_canvasTextBoxColorPicker.Color = SelectedTextDrawable.TextColor;
188-
_canvasTextBoxFontSizeTextBox.Text = SelectedTextDrawable.FontSize.ToString();
189202
_canvasTextBoxBoldButton.IsChecked = SelectedTextDrawable.IsBold;
190203
_canvasTextBoxItalicButton.IsChecked = SelectedTextDrawable.IsItalic;
191204

192205
return;
193206
}
194207

195-
_canvasTextBox.UpdateFontSize(TextFontSize);
196208
_canvasTextBox.UpdateFontStyle(_canvasTextBoxItalicButton.IsChecked ?? false);
197209
_canvasTextBox.UpdateFontWeight(_canvasTextBoxBoldButton.IsChecked ?? false);
198210

@@ -210,7 +222,7 @@ private void ClearTextBoxValue()
210222
_canvasTextBox.Clear();
211223
}
212224

213-
private void CanvasTextBoxFontSizeTextBox_PreviewKeyDown(object sender, KeyRoutedEventArgs e)
225+
private void CanvasComboBoxFontSizeTextBox_PreviewKeyDown(object sender, KeyRoutedEventArgs e)
214226
{
215227
if (_allowedCommands.Contains(e.Key.ToString()))
216228
{

Microsoft.Toolkit.Uwp.UI.Controls.Media/InfiniteCanvas/InfiniteCanvas.cs

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ namespace Microsoft.Toolkit.Uwp.UI.Controls
2121
/// </summary>
2222
[TemplatePart(Name = CanvasTextBoxToolsName, Type = typeof(StackPanel))]
2323
[TemplatePart(Name = CanvasTextBoxColorPickerName, Type = typeof(Windows.UI.Xaml.Controls.ColorPicker))]
24-
[TemplatePart(Name = CanvasTextBoxFontSizeTextBoxName, Type = typeof(TextBox))]
24+
[TemplatePart(Name = CanvasComboBoxFontSizeTextBoxName, Type = typeof(TextBox))]
2525
[TemplatePart(Name = CanvasTextBoxItalicButtonName, Type = typeof(ToggleButton))]
2626
[TemplatePart(Name = CanvasTextBoxBoldButtonName, Type = typeof(ToggleButton))]
2727
[TemplatePart(Name = DrawingSurfaceRendererName, Type = typeof(InfiniteCanvasVirtualDrawingSurface))]
@@ -45,7 +45,7 @@ public partial class InfiniteCanvas : Control
4545

4646
private const string CanvasTextBoxToolsName = "CanvasTextBoxTools";
4747
private const string CanvasTextBoxColorPickerName = "CanvasTextBoxColorPicker";
48-
private const string CanvasTextBoxFontSizeTextBoxName = "CanvasTextBoxFontSizeTextBox";
48+
private const string CanvasComboBoxFontSizeTextBoxName = "CanvasComboBoxFontSizeTextBox";
4949
private const string CanvasTextBoxItalicButtonName = "CanvasTextBoxItalicButton";
5050
private const string CanvasTextBoxBoldButtonName = "CanvasTextBoxBoldButton";
5151
private const string DrawingSurfaceRendererName = "DrawingSurfaceRenderer";
@@ -71,7 +71,7 @@ public partial class InfiniteCanvas : Control
7171
private StackPanel _canvasTextBoxTools;
7272
private Windows.UI.Xaml.Controls.ColorPicker _canvasTextBoxColorPicker;
7373

74-
private TextBox _canvasTextBoxFontSizeTextBox;
74+
private ComboBox _canvasComboBoxFontSizeTextBox;
7575
private ToggleButton _canvasTextBoxItalicButton;
7676
private ToggleButton _canvasTextBoxBoldButton;
7777
private Button _undoButton;
@@ -244,7 +244,7 @@ protected override void OnApplyTemplate()
244244
{
245245
_canvasTextBoxTools = (StackPanel)GetTemplateChild(CanvasTextBoxToolsName);
246246
this._canvasTextBoxColorPicker = (Windows.UI.Xaml.Controls.ColorPicker)GetTemplateChild(CanvasTextBoxColorPickerName);
247-
_canvasTextBoxFontSizeTextBox = (TextBox)GetTemplateChild(CanvasTextBoxFontSizeTextBoxName);
247+
_canvasComboBoxFontSizeTextBox = (ComboBox)GetTemplateChild(CanvasComboBoxFontSizeTextBoxName);
248248
_canvasTextBoxItalicButton = (ToggleButton)GetTemplateChild(CanvasTextBoxItalicButtonName);
249249
_canvasTextBoxBoldButton = (ToggleButton)GetTemplateChild(CanvasTextBoxBoldButtonName);
250250
_drawingSurfaceRenderer = (InfiniteCanvasVirtualDrawingSurface)GetTemplateChild(DrawingSurfaceRendererName);
@@ -296,7 +296,7 @@ protected override void OnApplyTemplate()
296296

297297
private void UnRegisterEvents()
298298
{
299-
_canvasTextBoxFontSizeTextBox.TextChanged -= CanvasTextBoxFontSizeTextBox_TextChanged;
299+
_canvasComboBoxFontSizeTextBox.SelectionChanged -= CanvasComboBoxFontSizeTextBox_SelectionChanged;
300300
_canvasTextBoxItalicButton.Click -= CanvasTextBoxItalicButton_Clicked;
301301
_canvasTextBoxBoldButton.Click -= CanvasTextBoxBoldButton_Clicked;
302302
_canvasTextBoxColorPicker.ColorChanged -= CanvasTextBoxColorPicker_ColorChanged;
@@ -314,13 +314,14 @@ private void UnRegisterEvents()
314314
Unloaded -= InfiniteCanvas_Unloaded;
315315
Application.Current.LeavingBackground -= Current_LeavingBackground;
316316
_drawingSurfaceRenderer.CommandExecuted -= DrawingSurfaceRenderer_CommandExecuted;
317-
_canvasTextBoxFontSizeTextBox.PreviewKeyDown -= CanvasTextBoxFontSizeTextBox_PreviewKeyDown;
317+
_canvasComboBoxFontSizeTextBox.PreviewKeyDown -= CanvasComboBoxFontSizeTextBox_PreviewKeyDown;
318+
_canvasComboBoxFontSizeTextBox.TextSubmitted -= CanvasComboBoxFontSizeTextBox_TextSubmitted;
318319
Loaded -= InfiniteCanvas_Loaded;
319320
}
320321

321322
private void RegisterEvents()
322323
{
323-
_canvasTextBoxFontSizeTextBox.TextChanged += CanvasTextBoxFontSizeTextBox_TextChanged;
324+
_canvasComboBoxFontSizeTextBox.SelectionChanged += CanvasComboBoxFontSizeTextBox_SelectionChanged;
324325
_canvasTextBoxItalicButton.Click += CanvasTextBoxItalicButton_Clicked;
325326
_canvasTextBoxBoldButton.Click += CanvasTextBoxBoldButton_Clicked;
326327
_canvasTextBoxColorPicker.ColorChanged += CanvasTextBoxColorPicker_ColorChanged;
@@ -338,7 +339,8 @@ private void RegisterEvents()
338339
Unloaded += InfiniteCanvas_Unloaded;
339340
Application.Current.LeavingBackground += Current_LeavingBackground;
340341
_drawingSurfaceRenderer.CommandExecuted += DrawingSurfaceRenderer_CommandExecuted;
341-
_canvasTextBoxFontSizeTextBox.PreviewKeyDown += CanvasTextBoxFontSizeTextBox_PreviewKeyDown;
342+
_canvasComboBoxFontSizeTextBox.PreviewKeyDown += CanvasComboBoxFontSizeTextBox_PreviewKeyDown;
343+
_canvasComboBoxFontSizeTextBox.TextSubmitted += CanvasComboBoxFontSizeTextBox_TextSubmitted;
342344
Loaded += InfiniteCanvas_Loaded;
343345
}
344346

@@ -366,7 +368,7 @@ private void ConfigureControls()
366368

367369
SetCanvasWidthHeight();
368370

369-
_canvasTextBox.UpdateFontSize(TextFontSize);
371+
SetFontSize(_textFontSize);
370372
}
371373

372374
private void SetZoomFactor()

Microsoft.Toolkit.Uwp.UI.Controls.Media/InfiniteCanvas/InfiniteCanvas.xaml

Lines changed: 26 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -97,13 +97,32 @@
9797
</ToggleButton.Content>
9898
</ToggleButton>
9999

100-
<TextBox x:Name="CanvasTextBoxFontSizeTextBox"
101-
Width="64"
102-
Height="32"
103-
InputScope="Number"
104-
MaxLength="3"
105-
Text="22"
106-
ToolTipService.ToolTip="Font Size" />
100+
<ComboBox x:Name="CanvasComboBoxFontSizeTextBox"
101+
MinWidth="64"
102+
Height="32"
103+
SelectedIndex="9"
104+
Margin="0,0,12,0"
105+
VerticalAlignment="Center"
106+
ToolTipService.ToolTip="Font Size"
107+
IsEditable="True"
108+
>
109+
<ComboBoxItem Content="8" />
110+
<ComboBoxItem Content="9" />
111+
<ComboBoxItem Content="10" />
112+
<ComboBoxItem Content="11" />
113+
<ComboBoxItem Content="12" />
114+
<ComboBoxItem Content="14" />
115+
<ComboBoxItem Content="16" />
116+
<ComboBoxItem Content="18" />
117+
<ComboBoxItem Content="20" />
118+
<ComboBoxItem Content="22" />
119+
<ComboBoxItem Content="24" />
120+
<ComboBoxItem Content="26" />
121+
<ComboBoxItem Content="28" />
122+
<ComboBoxItem Content="36" />
123+
<ComboBoxItem Content="48" />
124+
<ComboBoxItem Content="72" />
125+
</ComboBox>
107126

108127
</StackPanel>
109128
</StackPanel>

0 commit comments

Comments
 (0)