You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
xiaomi/src/ui/TableEditActivity.java

245 lines
10 KiB

package net.micode.notes.ui;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.ImageButton;
import net.micode.notes.R;
public class TableEditActivity extends Activity implements View.OnClickListener {
private static final String TAG = "TableEditActivity";
public static final String EXTRA_TABLE_HTML = "table_html";
public static final String RESULT_TABLE_HTML = "result_table_html";
private WebView mWebView;
private String mTableHtml;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.table_edit_activity);
// 初始化视图
initViews();
// 获取传入的表格HTML
Intent intent = getIntent();
if (intent.hasExtra(EXTRA_TABLE_HTML)) {
mTableHtml = intent.getStringExtra(EXTRA_TABLE_HTML);
} else {
// 默认创建一个2x2的表格
mTableHtml = generateDefaultTable(2, 2);
}
// 初始化WebView
initWebView();
}
private void initViews() {
// 标题栏按钮
ImageButton btnBack = findViewById(R.id.btn_back);
ImageButton btnDone = findViewById(R.id.btn_done);
btnBack.setOnClickListener(this);
btnDone.setOnClickListener(this);
// 表格操作按钮
Button btnAddRowAbove = findViewById(R.id.btn_add_row_above);
Button btnAddRowBelow = findViewById(R.id.btn_add_row_below);
Button btnDeleteRow = findViewById(R.id.btn_delete_row);
Button btnAddColLeft = findViewById(R.id.btn_add_col_left);
Button btnAddColRight = findViewById(R.id.btn_add_col_right);
Button btnDeleteCol = findViewById(R.id.btn_delete_col);
// 设置点击事件
btnAddRowAbove.setOnClickListener(this);
btnAddRowBelow.setOnClickListener(this);
btnDeleteRow.setOnClickListener(this);
btnAddColLeft.setOnClickListener(this);
btnAddColRight.setOnClickListener(this);
btnDeleteCol.setOnClickListener(this);
}
private void initWebView() {
mWebView = findViewById(R.id.web_view_table);
// 配置WebView
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setDomStorageEnabled(true);
webSettings.setDefaultTextEncodingName("utf-8");
// 设置WebViewClient
mWebView.setWebViewClient(new WebViewClient());
// 添加JavaScript接口
mWebView.addJavascriptInterface(new TableEditInterface(), "Android");
// 加载表格编辑页面
loadTableEditor();
}
private void loadTableEditor() {
// 构建HTML页面
StringBuilder htmlBuilder = new StringBuilder();
htmlBuilder.append("<!DOCTYPE html>")
.append("<html>")
.append("<head>")
.append("<meta charset=\"utf-8\">")
.append("<style>")
.append("body { font-family: Arial, sans-serif; margin: 0; padding: 10px; background-color: #f5f5f5; }")
.append("table { border-collapse: collapse; width: 100%; background-color: white; }")
.append("td, th { border: 1px solid #ddd; padding: 8px; text-align: left; min-width: 80px; }")
.append("th { background-color: #f2f2f2; font-weight: bold; }")
.append("td[contenteditable='true'], th[contenteditable='true'] { outline: none; }")
.append("td[contenteditable='true']:focus, th[contenteditable='true']:focus { outline: 2px solid #4CAF50; }")
.append("</style>")
.append("<script>")
.append("function addRowAbove() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (!table) return;")
.append(" var newRow = table.insertRow(0);")
.append(" for (var i = 0; i < table.rows[0].cells.length; i++) {")
.append(" var newCell = newRow.insertCell(i);")
.append(" newCell.contentEditable = true;")
.append(" newCell.innerHTML = ' ';")
.append(" }")
.append("}")
.append("function addRowBelow() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (!table) return;")
.append(" var newRow = table.insertRow(table.rows.length);")
.append(" for (var i = 0; i < table.rows[0].cells.length; i++) {")
.append(" var newCell = newRow.insertCell(i);")
.append(" newCell.contentEditable = true;")
.append(" newCell.innerHTML = ' ';")
.append(" }")
.append("}")
.append("function deleteRow() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (!table || table.rows.length <= 1) return;")
.append(" table.deleteRow(table.rows.length - 1);")
.append("}")
.append("function addColLeft() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (!table) return;")
.append(" for (var i = 0; i < table.rows.length; i++) {")
.append(" var newCell = table.rows[i].insertCell(0);")
.append(" newCell.contentEditable = true;")
.append(" newCell.innerHTML = ' ';")
.append(" }")
.append("}")
.append("function addColRight() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (!table) return;")
.append(" for (var i = 0; i < table.rows.length; i++) {")
.append(" var newCell = table.rows[i].insertCell(table.rows[i].cells.length);")
.append(" newCell.contentEditable = true;")
.append(" newCell.innerHTML = ' ';")
.append(" }")
.append("}")
.append("function deleteCol() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (!table || table.rows[0].cells.length <= 1) return;")
.append(" for (var i = 0; i < table.rows.length; i++) {")
.append(" table.rows[i].deleteCell(table.rows[i].cells.length - 1);")
.append(" }")
.append("}")
.append("function getTableHtml() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" return table ? table.outerHTML : '';")
.append("}")
.append("function initTable() {")
.append(" var table = document.getElementsByTagName('table')[0];")
.append(" if (table) {")
.append(" var cells = table.getElementsByTagName('td');")
.append(" for (var i = 0; i < cells.length; i++) {")
.append(" cells[i].contentEditable = true;")
.append(" }")
.append(" var headers = table.getElementsByTagName('th');")
.append(" for (var i = 0; i < headers.length; i++) {")
.append(" headers[i].contentEditable = true;")
.append(" }")
.append(" }")
.append("}")
.append("</script>")
.append("</head>")
.append("<body>")
.append(mTableHtml != null ? mTableHtml : "<table border=\"1\"><tr><th>列1</th><th>列2</th></tr><tr><td> </td><td> </td></tr></table>")
.append("<script>initTable();</script>")
.append("</body>")
.append("</html>");
String html = htmlBuilder.toString();
// 加载HTML
mWebView.loadDataWithBaseURL(null, html, "text/html", "utf-8", null);
}
private String generateDefaultTable(int rows, int cols) {
StringBuilder html = new StringBuilder();
html.append("<table border=\"1\" cellpadding=\"4\" cellspacing=\"0\">");
// 表头
html.append("<tr>");
for (int i = 0; i < cols; i++) {
html.append("<th>列").append(i + 1).append("</th>");
}
html.append("</tr>");
// 数据行
for (int i = 0; i < rows; i++) {
html.append("<tr>");
for (int j = 0; j < cols; j++) {
html.append("<td> </td>");
}
html.append("</tr>");
}
html.append("</table>");
return html.toString();
}
@Override
public void onClick(View v) {
int id = v.getId();
if (id == R.id.btn_back) {
finish();
} else if (id == R.id.btn_done) {
// 获取表格HTML并返回
mWebView.evaluateJavascript("Android.onTableHtml(getTableHtml());", null);
} else if (id == R.id.btn_add_row_above) {
mWebView.evaluateJavascript("addRowAbove();", null);
} else if (id == R.id.btn_add_row_below) {
mWebView.evaluateJavascript("addRowBelow();", null);
} else if (id == R.id.btn_delete_row) {
mWebView.evaluateJavascript("deleteRow();", null);
} else if (id == R.id.btn_add_col_left) {
mWebView.evaluateJavascript("addColLeft();", null);
} else if (id == R.id.btn_add_col_right) {
mWebView.evaluateJavascript("addColRight();", null);
} else if (id == R.id.btn_delete_col) {
mWebView.evaluateJavascript("deleteCol();", null);
}
}
private class TableEditInterface {
@JavascriptInterface
public void onTableHtml(String html) {
// 返回表格HTML
Intent intent = new Intent();
intent.putExtra(RESULT_TABLE_HTML, html);
setResult(RESULT_OK, intent);
finish();
}
}
}