Грустно видеть, что науке и математике никогда не уделяется достаточно внимания на платформе Android. Может быть, это простая проблема, но я полный чувак в javascript, поэтому я изо всех сил пытаюсь понять, как решить эту проблему.
Я хочу сделать очень просто: мне просто нужно использовать математическое уравнение рендеринга. Это может быть MathJax или JqMath или что-то маленькое и быстрое. Если мне нужно сделать это в веб-просмотре, как я могу отобразить простой текст в абзаце и форматированное уравнение в одном и том же веб-просмотре?
(кто-нибудь предлагает другие методы, которые, очевидно, работают, я также рассмотрю это как решение)
ЧТО Я СДЕЛАЛ ДО СИХ ПОР:
Я начал с использования MathJax, чтобы поместить формулу в веб-просмотр (Я не знаю, есть ли какой-либо успешный пример использования jqMath? Кто-нибудь хочет поделиться своим опытом?). Я могу воспроизвести все функции так же, как это из автономного приложения MathJax. В этом приложении пользователь вводит строку в поле EditText, и MathJax отображает формулу в Latex, как только пользователь нажимает кнопку для подтверждения.
Мне не нужно, чтобы пользователь подтверждал. Я думал, что это должно быть проще, потому что нет взаимодействия с пользователем, но почему-то уравнение никогда не отображается. Я знаю, что должен что-то упустить, потому что коды в автономном MathJax предназначены для ввода пользователем. Какую часть кода мне следует изменить, чтобы напрямую отображать уравнение из строки, скажем, \sqrt{b^2-4ac}? Вот начальный заголовок для веб-просмотра:
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","");
А вот как исходное веб-представление загружается, когда пользователь нажимает кнопку после ввода текста редактирования:
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]);");
}
});
Это установит строку Это обычный текст обычным шрифтом и по центру отобразит формулу в веб-просмотре.
ИЗМЕНИТЬ (выпуск 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. Любой, кто знает способ, может предложить обходной путь для этого.
Примечания: