B4A Library Math View

MarcoRome · Dec 30, 2015

Fantastic +1

Great Job Johan.

Johan Schoeman · Dec 31, 2015

Here is an update - I have added the second rendering engine (TeX). It make it a bit easier to create the formulas - see sample code / attached B4A project. Some examples in the pic and attached B4A project comes from HERE. Browse the web to get more info on the formula syntax.

Once you have downloaded the attached B4A project you need to replace the entire Files folder of the project with the folder that you can download from here - click here.

Posting the following:
1. updated B4A project (but replace the Files folder - see paragraph above)
2. Updated B4A library files (the other library files (see post above for download) remain unchanged - copy them to your additional library folder.
3. Updated Java code for the wrapper only (other Java code remains as is - see post #1 for the link to it).

Sample Code:

B4X:

#Region  Project Attributes
    #ApplicationLabel: b4aMathView
    #VersionCode: 1
    #VersionName:
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: landscape
    #CanInstallToExternalStorage: False
    #AdditionalJar: chunk-templates-3.0.1.jar

#End Region

#AdditionalRes: ..\resource
#AdditionalRes: c:\ANDRIOD_SDK_TOOLS\extras\android\support\v7\appcompat\res, android.support.v7.appcompat

#Region  Activity Attributes
    #FullScreen: False
    #IncludeTitle: True
#End Region

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.

End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.

    Private mv1 As MathView
    Private mv2 As MathView
    Private mv3 As MathView
    Private mv4 As MathView
    Private mv5 As MathView
    Private mv6 As MathView
    Private mv7 As MathView
    Private mv8 As MathView
    Private mv9 As MathView
    Private mv10 As MathView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("main")

End Sub

Sub Activity_Resume


    Dim  formula1 As String = "<math xmlns=""http://www.w3.org/1998/Math/MathML"">" & Chr(10) & Chr(13) & _
            "  <mrow>" & Chr(10) & Chr(13) & _
            "    <mi>f</mi>" & Chr(10) & Chr(13) & _
            "    <mrow>" & Chr(10) & Chr(13) & _
            "      <mo>(</mo>" & Chr(10) & Chr(13) & _
            "      <mi>a</mi>" & Chr(10) & Chr(13) & _
            "      <mo>)</mo>" & Chr(10) & Chr(13) & _
            "    </mrow>" & Chr(10) & Chr(13) & _
            "  </mrow>" & Chr(10) & Chr(13) & _
            "  <mo>=</mo>" & Chr(10) & Chr(13) & _
            "  <mrow>" & Chr(10) & Chr(13) & _
            "    <mfrac>" & Chr(10) & Chr(13) & _
            "      <mn>1</mn>" & Chr(10) & Chr(13) & _
            "      <mrow>" & Chr(10) & Chr(13) & _
            "        <mn>2</mn>" & Chr(10) & Chr(13) & _
            "        <mi>&#x3C0;</mi>" & Chr(10) & Chr(13) & _
            "        <mi>i</mi>" & Chr(10) & Chr(13) & _
            "      </mrow>" & Chr(10) & Chr(13) & _
            "    </mfrac>" & Chr(10) & Chr(13) & _
            "    <msub>" & Chr(10) & Chr(13) & _
            "      <mo>&#x222E;</mo>" & Chr(10) & Chr(13) & _
            "      <mrow>" & Chr(10) & Chr(13) & _
            "        <mi>&#x3B3;</mi>" & Chr(10) & Chr(13) & _
            "      </mrow>" & Chr(10) & Chr(13) & _
            "    </msub>" & Chr(10) & Chr(13) & _
            "    <mfrac>" & Chr(10) & Chr(13) & _
            "      <mrow>" & Chr(10) & Chr(13) & _
            "        <mi>f</mi>" & Chr(10) & Chr(13) & _
            "        <mo>(</mo>" & Chr(10) & Chr(13) & _
            "        <mi>z</mi>" & Chr(10) & Chr(13) & _
            "        <mo>)</mo>" & Chr(10) & Chr(13) & _
            "      </mrow>" & Chr(10) & Chr(13) & _
            "      <mrow>" & Chr(10) & Chr(13) & _
            "        <mi>z</mi>" & Chr(10) & Chr(13) & _
            "        <mo>&#x2212;</mo>" & Chr(10) & Chr(13) & _
            "        <mi>a</mi>" & Chr(10) & Chr(13) & _
            "      </mrow>" & Chr(10) & Chr(13) & _
            "    </mfrac>" & Chr(10) & Chr(13) & _
            "    <mi>d</mi>" & Chr(10) & Chr(13) & _
            "    <mi>z</mi>" & Chr(10) & Chr(13) & _
            "  </mrow>" & Chr(10) & Chr(13) & _
            "</math>"

    mv1.Engine = 1
    mv1.MathText = formula1

    Dim  formula2 As String = "<math xmlns=""http://www.w3.org/1998/Math/MathML"">" & Chr(10) & Chr(13) & _
            "  <munderover>" & Chr(10) & Chr(13) & _
            "    <mo>&#x2211;<!-- ∑ --></mo>" & Chr(10) & Chr(13) & _
            "    <mrow class=""MJX-TeXAtom-ORD"">" & Chr(10) & Chr(13) & _
            "      <mi>i</mi>" & Chr(10) & Chr(13) & _
            "      <mo>=</mo>" & Chr(10) & Chr(13) & _
            "      <mn>0</mn>" & Chr(10) & Chr(13) & _
            "    </mrow>" & Chr(10) & Chr(13) & _
            "    <mi>n</mi>" & Chr(10) & Chr(13) & _
            "  </munderover>" & Chr(10) & Chr(13) & _
            "  <msup>" & Chr(10) & Chr(13) & _
            "    <mi>i</mi>" & Chr(10) & Chr(13) & _
            "    <mn>2</mn>" & Chr(10) & Chr(13) & _
            "  </msup>" & Chr(10) & Chr(13) & _
            "  <mo>=</mo>" & Chr(10) & Chr(13) & _
            "  <mfrac>" & Chr(10) & Chr(13) & _
            "    <mrow>" & Chr(10) & Chr(13) & _
            "      <mo stretchy=""false"">(</mo>" & Chr(10) & Chr(13) & _
            "      <msup>" & Chr(10) & Chr(13) & _
            "        <mi>n</mi>" & Chr(10) & Chr(13) & _
            "        <mn>2</mn>" & Chr(10) & Chr(13) & _
            "      </msup>" & Chr(10) & Chr(13) & _
            "      <mo>+</mo>" & Chr(10) & Chr(13) & _
            "      <mi>n</mi>" & Chr(10) & Chr(13) & _
            "      <mo stretchy=""false"">)</mo>" & Chr(10) & Chr(13) & _
            "      <mo stretchy=""false"">(</mo>" & Chr(10) & Chr(13) & _
            "      <mn>2</mn>" & Chr(10) & Chr(13) & _
            "      <mi>n</mi>" & Chr(10) & Chr(13) & _
            "      <mo>+</mo>" & Chr(10) & Chr(13) & _
            "      <mn>1</mn>" & Chr(10) & Chr(13) & _
            "      <mo stretchy=""false"">)</mo>" & Chr(10) & Chr(13) & _
            "    </mrow>" & Chr(10) & Chr(13) & _
            "    <mn>6</mn>" & Chr(10) & Chr(13) & _
            "  </mfrac>" & Chr(10) & Chr(13) & _
            "</math>"
    mv2.Engine = 1
    mv2.MathText = formula2



    Dim formula3 As String = "$$\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}$$" & Chr(10) & Chr(13) & _
            " $$(ax^2 + bx + c = 0)$$ "

    mv3.Engine = 0
    mv3.MathText = formula3    

    Dim formula4 As String = "$$\frac{\frac{1}{x}+\frac{1}{y}}{y-z}$$"
    mv4.Engine = 0
    mv4.MathText = formula4

    Dim formula5 As String = "$$\frac{n!}{k!(n-k)!} = \binom{n}{k}$$"
    mv5.Engine = 0
    mv5.MathText = formula5

    Dim formula6 As String = "$$\overbrace{ 1+2+\cdots+100 }^{5050}$$"
    mv6.Engine = 1
    mv6.MathText = formula6    

    Dim formula7 As String = "$$A \xleftarrow{n+\mu-1} B \xrightarrow[T]{n\pm i-1} C$$"
    mv7.Engine = 1
    mv7.MathText = formula7

    Dim formula8 As String = "$$\begin{cases} 3x + 5y + z \\ 7x – 2y + 4z \\ -6x + 3y + 2z \end{cases}$$"
    mv8.Engine = 1
    mv8.MathText = formula8    

    Dim formula9 As String = "$$\left[ \begin{array}{c} x_1 \\ x_2 \end{array} \right] = \begin{bmatrix} A & B \\ C & D \end{bmatrix} \times \left[ \begin{array}{c} y_1 \\ y_2 \end{array} \right]$$"
    mv9.Engine = 1
    mv9.MathText = formula9

    Dim formula10 As String = "$$\begin{bmatrix} xz & xw \\ yz & yw \end{bmatrix} = \left[ \begin{array}{c} x \\ y \end{array} \right] \times \left[ \begin{array}{cc} z & w \end{array} \right]$$"
    mv10.Engine = 1
    mv10.MathText = formula10

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Johan Schoeman · Dec 31, 2015

Just a side note - I have in this week updated my Android SDK and found out the hard way that I had to remove the values-23 folder from this path....

C:\ANDRIOD_SDK_TOOLS\extras\android\support\v7\appcompat\res\values-23

...on my computer else the B4A project would not compile. Why I don't know - but I found the suggestion on the Stackoverflow forum, tried it, and it solved the B4A compiling problem. Perhaps @corwin42 can shed some light on this

MarcoRome · Dec 31, 2015

Really Great work Johan +10. Good Year 2016.

Johan Schoeman · Dec 31, 2015

MarcoRome said:
Really Great work Johan +10. Good Year 2016.

Same to you! Wishing you a great 2016!

freedom2000 · Jan 1, 2016

As usual great job Johan !

Happy new year

sanjibnanda · Feb 17, 2016

very nice , was looking for this.
how could i change the font color and size at run time?

Tayfur · Feb 17, 2016

I want to again learning Math when I see your code

Great lib. Thanks.

Johan Schoeman · Feb 17, 2016

sanjibnanda said:
very nice , was looking for this.
how could i change the font color and size at run time?

You will have to work through the LaTex website. It can be done. Read through this site as a starter:

http://tex.stackexchange.com/questions/21598/how-to-color-math-symbols

Thus, you need to add it to the string that has the formula that should be displayed.

sanjibnanda · Feb 18, 2016

Johan Schoeman said:
You will have to work through the LaTex website. It can be done. Read through this site as a starter:

http://tex.stackexchange.com/questions/21598/how-to-color-math-symbols

Thus, you need to add it to the string that has the formula that should be displayed.

thanks for tip, it worked. see the attached image.

but the font size still remains an issue, i tried many times but failed. if you have some clue i appreciate.

Johan Schoeman · Feb 18, 2016

sanjibnanda said:
thanks for tip, it worked. see the attached image.

but the font size still remains an issue, i tried many times but failed. if you have some clue i appreciate.

I have not played around with the color or the text size at all. You managed to sort out the color. I am sure you will figure out the text size too! Will be great if you can post a code snippet for the color and also a code snippet for the text size once you have figured it out for us...

Or a complete B4A project...that will be great!

hdmiacc · May 20, 2016

why i got this error?

Johan Schoeman · May 20, 2016

hdmiacc said:
why i got this error?

Do you have this jar file in your additional library folder:
chunk-templates-3.0.1.jar

hdmiacc · May 20, 2016

Johan Schoeman said:
Do you have this jar file in your additional library folder:
chunk-templates-3.0.1.jar

yup. already have it. can i know where to place this files assets,katex,MathJax and themes?

Johan Schoeman · May 20, 2016

hdmiacc said:
yup. already have it. can i know where to place this files assets,katex,MathJax and themes?

See point (3) in post #1 of this thread. It has the entire /Files folder of the b4A project. Replace your b4a project's /Files folder with this folder and then everything will be in the right place.

Ehsanz · Oct 6, 2016

Why do i receive the following error?

Johan Schoeman · Oct 6, 2016

Ehsanz said:
Why do i receive the following error?

View attachment 48655

Did you enable MathView in your b4a project's lib tab? Sure you have all the required jars and XML downloaded from the link in post #1 and have copied them to your additional library folder?

Ehsanz · Oct 6, 2016

Johan Schoeman said:
Did you enable MathView in your b4a project's lib tab? Sure you have all the required jars and XML downloaded from the link in post #1 and have copied them to your additional library folder?

Thanks for your mention.The old one of MathView's Library wasn't replaced with new one!
But a new error occurred!?

Johan Schoeman · Oct 7, 2016

Ehsanz said:
Thanks for your mention.The old one of MathView's Library wasn't replaced with new one!
But a new error occurred!?
View attachment 48665

Download and unzip the attached resource.zip file.
Then copy the extracted resource folder to your B4A project so that it is on the same folder level as that of the /Files and /Objects folders of the B4A project.

B4A Library Math View

Attachments

Expert

Expert

Attachments

Expert

Expert

Expert

Well-Known Member

Active Member

Well-Known Member

Expert

Active Member

Attachments

Expert

Member

Attachments

Expert

Member

Expert

New Member

Expert

New Member

Expert

Attachments

Similar Threads