Proposal: Add a MathInputBox control

[winston-de]

Proposal: Add a MathInputBox control

Summary

This proposal is to provide a control that allows developers to provide users with a rich experience for creating, editing, and viewing math equations for all input methods.

Rationale

• Apps like OneNote and Calculator have made their own solutions to this
• MacOS and iPadOS/iOS provide an equation tool
• Custom solutions to this (see Windows Calculator graph input) generally don't work as well with touch, since buttons for special characters don't interact well with the touch keyboard
• There is currently no public api or control that allows for users to convert ink to math with the exception of the math input panel, which is out of date and will not ship built into Windows 11

Scope

Capability	Priority
This proposal will add a MathInputControl that devs can add to their apps	Must
The MathInputControl will give users a rich equation editing experience and commands, for example auto closing parenthesis, converting "\sqrt" to √	Must
The MathInputControl will provide an ink to math experience with a pen, for example showing a ink input panel for math when tapped with a pen similar to TextBox behavior	Must
The MathInputControl will allow users with screen readers to easily understand the MathInputBox content (possibly by reading equations the same way they would be pronounced, eg "x^2" -> "x squared")	Must
This proposal will add an input scope for "math", so that the windows touch keyboard can provide an enhanced equation input experience for tablets (eg math autocomplete and symbols)	Must
The MathInputControl will allow developers to specify the output format (eg LaTeX, raw text)	Could

Important Notes

Possible code for a basic graphing scenario:

<StackPanel Orientation="Vertical>
    <MathInputBox Format="LaTeX" Text="y = x ^ { 2 }" InputChanged="MathInputBox_InputChanged"/>
    <controls:GraphControl />
</StackPanel>

void MathInputBox_InputChanged(object sender, MathInputChangedEventArgs e)
{
  GraphEquation(e.Output);
}

///<summary> Graphs the given equation</summary>
/// <param name="equation">The equation to graph in LaTeX format</param>
private void GraphEquation(string equation) 
{
    // magic
}

Open Questions

[mdtauk]

I think I made a similar proposal, when the NumberBox was being proposed.

Calculator is currently working on moving their UI code to C# whilst making their core code that handles the calculations, a C++ WinRT component.

So maybe when that work is done, WinUI could include that Core and create a TextBox/NumberBox with a Calculator flyout?

https://github.com/microsoft/calculator/issues/453#issuecomment-483872523

[winston-de]

This proposal isn't for a calculator control, but for a control designed for entering (complex) math equations. Something similar to what OneNote has.

https://user-images.githubusercontent.com/59544401/123497256-46603480-d5e1-11eb-9b0e-f51282a7b1ee.mp4

You're idea is pretty cool though, and probably could be achieved using the LaunchUriForResultsAsync function.