Merge pull request #38 from weijayboyy/pr37-html-preview

EchoFish · web-flow · commit dcc500324c34 · 2026-05-30T05:15:54.000+08:00
feat(preview): 引入真正渲染的 HTML Markdown 预览（tkhtmlview）
diff --git a/gui.py b/gui.py
@@ -1,3 +1,4 @@
+import logging
 import tkinter as tk
 from datetime import datetime
 from pathlib import Path
@@ -8,6 +9,8 @@
 from note_model import NoteManager
 from search_engine import KnowledgeGraph, SearchEngine
 
+logger = logging.getLogger(__name__)
+
 
 class SmartNotesApp:
     def __init__(self, root):
@@ -636,12 +639,43 @@ def _render_markdown_preview(self, content):
             pt.insert(tk.END, '\n')
         pt.config(state='disabled')
 
+    @staticmethod
+    def _html_preview_widget(parent):
+        """Return an HTMLScrolledText if tkhtmlview is installed, else None."""
+        try:
+            from tkhtmlview import HTMLScrolledText  # noqa: PLC0415
+        except ImportError:
+            return None
+        return HTMLScrolledText(parent, html="")
+
     def toggle_preview(self):
+        content = self.editor_text.get(1.0, tk.END)
+        # If an HTML preview backend is available, prefer it; otherwise fall
+        # back to the Tk-tag renderer introduced earlier.
+        if getattr(self, '_html_preview', 'unset') == 'unset':
+            self._html_preview = self._html_preview_widget(self.editor_text.master)
+
+        if self._html_preview is not None:
+            if self._html_preview.winfo_ismapped():
+                self._html_preview.pack_forget()
+                self.editor_text.pack(fill='both', expand=True)
+            else:
+                self.editor_text.pack_forget()
+                self._html_preview.pack(fill='both', expand=True)
+                try:
+                    html = self.markdown_parser.parse_to_styled_html(content)
+                    self._html_preview.set_html(html)
+                except Exception:
+                    logger.exception("HTML 预览渲染失败，回退到标签渲染")
+                    self._html_preview.pack_forget()
+                    self.preview_text.pack(fill='both', expand=True)
+                    self._render_markdown_preview(content)
+            return
+
         if self.preview_text.winfo_ismapped():
             self.preview_text.pack_forget()
             self.editor_text.pack(fill='both', expand=True)
         else:
-            content = self.editor_text.get(1.0, tk.END)
             self.editor_text.pack_forget()
             self.preview_text.pack(fill='both', expand=True)
             self._render_markdown_preview(content)
diff --git a/markdown_parser.py b/markdown_parser.py
@@ -52,6 +52,19 @@ def parse_to_html(self, text: str) -> str:
             logger.exception("Markdown解析失败: %s", e)
             return f"<pre>{text}</pre>"
 
+    _PREVIEW_CSS = (
+        "body{font-family:'Microsoft YaHei UI',sans-serif;font-size:14px;line-height:1.6;}"
+        "h1,h2,h3{color:#2d3748;}code{background:#f1f1f4;padding:2px 4px;border-radius:3px;}"
+        "pre{background:#2d2d2d;color:#f8f8f2;padding:10px;border-radius:5px;overflow:auto;}"
+        "table{border-collapse:collapse;}td,th{border:1px solid #ccc;padding:4px 8px;}"
+        "blockquote{border-left:4px solid #cbd5e0;margin:0;padding-left:12px;color:#718096;}"
+    )
+
+    def parse_to_styled_html(self, text: str) -> str:
+        """Full HTML document with embedded CSS for an HTML preview widget."""
+        body = self.parse_to_html(text)
+        return f"<html><head><style>{self._PREVIEW_CSS}</style></head><body>{body}</body></html>"
+
     def extract_headings(self, text: str) -> List[Tuple[int, str]]:
         headings = []
         for match in self.heading_pattern.finditer(text):
diff --git a/pyproject.toml b/pyproject.toml
@@ -14,6 +14,10 @@ dependencies = [
     "pillow>=10.0,<13",
 ]
 
+[project.optional-dependencies]
+# Richer HTML Markdown preview; the app falls back to a tag renderer without it.
+preview = ["tkhtmlview>=0.2"]
+
 [dependency-groups]
 dev = [
     "ruff>=0.5",
diff --git a/tests/test_styled_html.py b/tests/test_styled_html.py
@@ -0,0 +1,20 @@
+"""Styled HTML preview output + graceful absence of tkhtmlview."""
+import importlib.util
+
+from markdown_parser import MarkdownParser
+
+
+def test_styled_html_wraps_with_css():
+    mp = MarkdownParser()
+    html = mp.parse_to_styled_html("# Title\n\n**bold**")
+    assert html.startswith("<html>")
+    assert "<style>" in html and "font-family" in html
+    assert "<h1" in html  # heading rendered to HTML, not raw markdown
+    assert "<strong>bold</strong>" in html
+
+
+def test_tkhtmlview_optional():
+    # The app must work whether or not tkhtmlview is installed; just assert the
+    # import-capability check is well-defined (no exception).
+    available = importlib.util.find_spec("tkhtmlview") is not None
+    assert available in (True, False)
