Грустно видеть, что науке и математике никогда не уделяется достаточного внимания на платформе Android. Возможно, это легкая проблема, но я полный чувак в javascript, поэтому я изо всех сил пытаюсь понять, как решить эту проблему.
То, что я хочу сделать, просто: Мне просто нужно использовать математическое уравнение рендеринга. Это может быть MathJax или JqMath или что-то маленькое и быстрое. Если мне нужно сделать это в веб-просмотре, как я могу показать простой текст в абзаце и форматированном уравнении в пределах одного веб-представления?
(кто-то выходит с другими методами, которые, очевидно, работают, я также рассмотрю это как решение)
ЧТО Я СДЕЛАЛ СКАЗАТЬ:
Я начал с использования MathJax, чтобы поместить формулу в webview (я не знаю, есть ли какой-нибудь успешный случай использования jqMath? Кто-нибудь хочет поделиться своим опытом?) Я могу воспроизвести все функциональные возможности, аналогичные функциям автономного Приложение MathJax. В этом приложении пользовательские ключи в строке в поле EditText и MathJax будут отображать формулу в Latex после нажатия пользователем кнопки для подтверждения.
Мне не нужен пользователь для подтверждения. Я думал, что это должно быть проще, потому что нет взаимодействия с пользователем, но так или иначе уравнение никогда не отображается. Я знаю, что мне что-то не хватает, потому что коды в автономном MathJax предназначены для ввода пользователем. Какую часть кода я должен изменить, чтобы напрямую вывести уравнение из строки, скажем, \sqrt {b ^ 2-4ac}? Вот начальный заголовок для webview:
WebView w = (WebView) findViewById(R.id.webview);
w.getSettings().setJavaScriptEnabled(true);
w.getSettings().setBuiltInZoomControls(true);
w.loadDataWithBaseURL("http://bar", "<script type='text/x-mathjax-config'>"
+"MathJax.Hub.Config({ showMathMenu: false, "
+"jax: ['input/TeX','output/HTML-CSS'], "
+"extensions: ['tex2jax.js'], "
+"TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
+"'noErrors.js','noUndefined.js'] } "
+"});</script>"
+"<script type='text/javascript' "
+"src='file:///android_asset/MathJax/MathJax.js'"
+"></script><span id='math'></span>","text/html","utf-8","");
И вот как загружается исходный веб-просмотр, когда пользователь нажимает кнопку после ввода в edittext:
WebView w = (WebView) findViewById(R.id.webview);
EditText e = (EditText) findViewById(R.id.edit);
w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
+doubleEscapeTeX(e.getText().toString())
+"\\\\]';");
w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
private static String doubleEscapeTeX(String s) {
String t="";
for (int i=0; i < s.length(); i++) {
if (s.charAt(i) == '\'') t += '\\';
if (s.charAt(i) != '\n') t += s.charAt(i);
if (s.charAt(i) == '\\') t += "\\";
}
return t;
}
Я попытался заменить жестко запрограммированной строкой
w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
+doubleEscapeTeX("sample string")
+"\\\\]';");
но он не работает, текст "sample string"
даже не появится в веб-просмотре.
[РЕШЕНИЕ] см. "Ответ на вопрос"
Чтобы подробно описать его ответ, это пример того, как установить предложение в виде простого текста, а затем отобразить форматированное уравнение в форме отображения (все в одном веб-просмотре):
Замените последнюю строку выше на
+"></script><span id='math'></span>","text/html","utf-8","");
с
+"></script><span id='text'>This is plain text.</span> <span id='math'></span>", "text/html", "utf-8", "");
Затем вызовите
w.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
if (!url.startsWith("http://bar"))
return;
w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
+doubleEscapeTeX("\\sqrt{b^2-4ac}") + "\\\\]';");
w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
}
});
Это установит строку. Это обычный текст в обычном шрифте, а в центре - формула в веб-просмотре.
EDIT (проблема с Android 4.4)
Начиная с Android KitKat, вы должны заменить все строки loadUrl(...)
на evaluateJavascript(...)
. Но это доступно только для KitKat (API 19 или выше), поэтому вам сначала нужно выполнить проверку версии SDK. Например:
if (android.os.Build.VERSION.SDK_INT < 19) {
w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
} else {
w.evaluateJavascript("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);",null);
}
ОБНОВЛЕНИЕ (КАК MATHJAX 2.5)
Поскольку происходят изменения папок, предыдущий код не будет работать в последней версии MathJax. Кроме того, рекомендуемый способ минимизации размера локального MathJax теперь использует Grunt. Шаблон для уменьшения размера MathJax можно найти здесь.
Предполагая, что вы успешно уменьшили размер MathJax и предположили вывод HTML-CSS, вот простая версия, которая может загружать MathJax:
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final WebView w = (WebView) findViewById(R.id.webview);
w.getSettings().setJavaScriptEnabled(true);
w.getSettings().setBuiltInZoomControls(true);
String Url = "</style>"
+ "<script type='text/x-mathjax-config'>"
+ " MathJax.Hub.Config({" + " showMathMenu: false,"
+ " jax: ['input/TeX','output/HTML-CSS', 'output/CommonHTML'],"
+ " extensions: ['tex2jax.js','MathMenu.js','MathZoom.js', 'CHTML-preview.js'],"
+ " tex2jax: { inlineMath: [ ['$','$'] ], processEscapes: true },"
+ " TeX: {" + " extensions:['AMSmath.js','AMSsymbols.js',"
+ " 'noUndefined.js']" + " }"
+ " });"
+ "</script>"
+ "<script type='text/javascript' src='file:///android_asset/MathJax/MathJax.js'>"
+ "</script>"
+ "<p style=\"line-height:1.5; padding: 16 16\" align=\"justify\">"
+ "<span >";
// Demo display equation
url += "This is a display equation: $$P=\frac{F}{A}$$";
url += "This is also an identical display equation with different format:\\[P=\\frac{F}{A}\\]";
// equations aligned at equal sign
url += "You can also put aligned equations just like Latex:";
String align = "\\begin{aligned}"
+ "F\\; &= P \\times A \\\\ "
+ "&= 4000 \\times 0.2\\\\"
+ "&= 800\\; \\text{N}\\end{aligned}";
url += align;
url += "This is an inline equation \\sqrt{b^2-4ac}.";
// Finally, must enclose the brackets
url += "</span></p>";
mWebView.loadDataWithBaseURL("http://bar", url, "text/html", "utf-8", "");
mWebView.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
if (!url.startsWith("http://bar")) return;
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
view.loadUrl(JAVASCRIPT);
} else {
view.evaluateJavascript(JAVASCRIPT, null);
}
}
});
}
В отличие от ответа Джоса, нет необходимости отделять текстовые или математические типы, MathJax просто форматирует их соответственно.
Однако, похоже, что есть ошибка, что веб-просмотр в устройствах KitKat не может отображать заглавную букву "A". Любой, кто знает способ, может предложить обходной путь для этого.