• python.tkinter设计标记语言(转译2-html)


    @TOC

    前言

    本文只作为笔记记录。

    前文我们已经通过TinText渲染器部分和TinML获得了test.tin解释后的标记内容列表。本文,我们将根据这个解释结果将Tin标记转为html文件。

    转为html的好处

    第一,Tin标记语言作为一个小小小小小项目,光把编写内容呈现在TinText中是不够的,需要导出为其它常见文件。

    第二,html足够常见,而且可以通过html格式继续转化为其它格式文件。html转图片、PDF、Markdown等格式的功能,已经有了完善的实现。我们只需要把Tin标记文本转译为html格式文本,就相当于打开了一扇落地窗😇,进而可以借助html格式转变为其它能够转变的任何格式文件。

    而如果我们想给Tin标记文本转化为另一个新的格式文件,或者单纯就是为了练手,同样可以根据解释结果列表来进行编写。本篇文章中,就以HTML为例。

    tin转译为html

    工具类

    我们先定义一下转译工具类。

    class TinTranslator():
        """
        tin->html的转译工具类
        *后续可能支持tin->markdown
        """
    
        def __init__(self,tinml:TinML):
            self.tinml=tinml
            self.doc=None
            
            self.tinPmark=('*','/','_','-','!')
            self.tinPlink_re=re.compile('.*?!\[(.*?)\]\((..*?)\)')
    

    这里,我们定义了一些基础属性和小工具。

    TinTranslator直接绑定TinML,做到实时同步。

    转译功能

    这里先以</code>为例。</p> <p>TinText使用dominate作为html生成工具。</p> <pre data-index="1" class="set-code-hide prettyprint"><code class="prism language-python has-numbering" onclick="mdcp.signin(event)" style="position: unset;"> <span class="token keyword">def</span> <span class="token function">tohtml</span><span class="token punctuation">(</span>self<span class="token punctuation">,</span>_title<span class="token operator">=</span><span class="token string">'TinText'</span><span class="token punctuation">,</span>_style<span class="token operator">=</span><span class="token string">''</span><span class="token punctuation">)</span><span class="token punctuation">:</span> <span class="token comment">#tin->html</span> doc<span class="token operator">=</span>dominate<span class="token punctuation">.</span>document<span class="token punctuation">(</span>title<span class="token operator">=</span>_title<span class="token punctuation">)</span> doc<span class="token punctuation">.</span>head<span class="token punctuation">.</span>add<span class="token punctuation">(</span>meta<span class="token punctuation">(</span>charset<span class="token operator">=</span><span class="token string">'utf-8'</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">if</span> _style<span class="token operator">!=</span><span class="token string">''</span><span class="token punctuation">:</span> doc<span class="token punctuation">.</span>head<span class="token punctuation">.</span>add<span class="token punctuation">(</span>style<span class="token punctuation">(</span>_style<span class="token punctuation">)</span><span class="token punctuation">)</span> _body<span class="token operator">=</span>div<span class="token punctuation">(</span><span class="token punctuation">)</span> doc<span class="token punctuation">.</span>body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>_body<span class="token punctuation">)</span> <span class="token keyword">for</span> tag<span class="token punctuation">,</span>kw <span class="token keyword">in</span> self<span class="token punctuation">.</span>tinml<span class="token punctuation">:</span> <span class="token keyword">if</span> tag <span class="token operator">==</span> <span class="token string">'<title>'</span><span class="token punctuation">:</span> <span class="token comment">#标题</span> text<span class="token operator">=</span>kw<span class="token punctuation">[</span><span class="token string">'title'</span><span class="token punctuation">]</span> level<span class="token operator">=</span><span class="token builtin">int</span><span class="token punctuation">(</span>kw<span class="token punctuation">[</span><span class="token string">'level'</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token keyword">if</span> level<span class="token operator">==</span><span class="token number">1</span><span class="token punctuation">:</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>h1<span class="token punctuation">(</span>text<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> level<span class="token operator">==</span><span class="token number">2</span><span class="token punctuation">:</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>h2<span class="token punctuation">(</span>text<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> level<span class="token operator">==</span><span class="token number">3</span><span class="token punctuation">:</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>h3<span class="token punctuation">(</span>text<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> level<span class="token operator">==</span><span class="token number">4</span><span class="token punctuation">:</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>h4<span class="token punctuation">(</span>text<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> level<span class="token operator">==</span><span class="token number">5</span><span class="token punctuation">:</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>h5<span class="token punctuation">(</span>text<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> level<span class="token operator">==</span><span class="token number">6</span><span class="token punctuation">:</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>h6<span class="token punctuation">(</span>text<span class="token punctuation">)</span><span class="token punctuation">)</span> <div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}"></div></code></pre> <p>有了解释结果,转译就很方便了,不需要处理可能的错误。</p> <p><code><p></code>有点复杂,因为Tin的p标记与html的p标记并不同级,而是包含了html中的b, u, i, s, a等标记,还要继续下分情况,因此需要类似TinText中的预渲染步骤。</p> <pre data-index="2" class="set-code-hide prettyprint"><code class="prism language-python has-numbering" onclick="mdcp.signin(event)" style="position: unset;"> <span class="token keyword">def</span> <span class="token function">__tinP_to_html</span><span class="token punctuation">(</span>self<span class="token punctuation">,</span>texts<span class="token punctuation">)</span><span class="token punctuation">:</span> <span class="token comment">#tin段落转html段落</span> res<span class="token operator">=</span><span class="token punctuation">[</span><span class="token punctuation">]</span> <span class="token keyword">for</span> text <span class="token keyword">in</span> texts<span class="token punctuation">:</span> <span class="token keyword">if</span> text<span class="token operator">==</span><span class="token string">''</span><span class="token punctuation">:</span> res<span class="token punctuation">.</span>append<span class="token punctuation">(</span>br<span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> text<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token operator">==</span><span class="token string">' '</span><span class="token punctuation">:</span> res<span class="token punctuation">.</span>append<span class="token punctuation">(</span>text<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">:</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token keyword">elif</span> text<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token keyword">not</span> <span class="token keyword">in</span> self<span class="token punctuation">.</span>tinPmark<span class="token punctuation">:</span> res<span class="token punctuation">.</span>append<span class="token punctuation">(</span>text<span class="token punctuation">)</span> <span class="token keyword">else</span><span class="token punctuation">:</span> head_mark<span class="token operator">=</span>text<span class="token punctuation">[</span><span class="token punctuation">:</span><span class="token number">5</span><span class="token punctuation">]</span> head_num<span class="token operator">=</span><span class="token number">0</span> now_p<span class="token operator">=</span><span class="token boolean">None</span><span class="token comment">#初始化,空</span> <span class="token keyword">if</span> <span class="token string">'*'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> head_num<span class="token operator">+=</span><span class="token number">1</span> <span class="token keyword">if</span> <span class="token string">'/'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> head_num<span class="token operator">+=</span><span class="token number">1</span> <span class="token keyword">if</span> <span class="token string">'_'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> head_num<span class="token operator">+=</span><span class="token number">1</span> <span class="token keyword">if</span> <span class="token string">'-'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> head_num<span class="token operator">+=</span><span class="token number">1</span> <span class="token comment">#开始具体转义html<p></span> <span class="token keyword">if</span> <span class="token string">'!'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> result<span class="token operator">=</span>self<span class="token punctuation">.</span>tinPlink_re<span class="token punctuation">.</span><span class="token keyword">match</span><span class="token punctuation">(</span>text<span class="token punctuation">)</span> <span class="token keyword">if</span> result<span class="token punctuation">:</span> url_text<span class="token punctuation">,</span>url<span class="token operator">=</span>result<span class="token punctuation">.</span>groups<span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token keyword">if</span> url_text<span class="token operator">==</span><span class="token string">''</span><span class="token punctuation">:</span> url_text<span class="token operator">=</span>url now_p<span class="token operator">=</span>a<span class="token punctuation">(</span>url_text<span class="token punctuation">,</span>href<span class="token operator">=</span>url<span class="token punctuation">)</span> <span class="token keyword">else</span><span class="token punctuation">:</span> head_num<span class="token operator">+=</span><span class="token number">1</span> <span class="token keyword">if</span> <span class="token string">'*'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> <span class="token keyword">if</span> now_p<span class="token punctuation">:</span> now_p<span class="token operator">=</span>b<span class="token punctuation">(</span>now_p<span class="token punctuation">)</span> <span class="token keyword">else</span><span class="token punctuation">:</span> now_p<span class="token operator">=</span>b<span class="token punctuation">(</span>text<span class="token punctuation">[</span>head_num<span class="token punctuation">:</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token keyword">if</span> <span class="token string">'/'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> <span class="token keyword">if</span> now_p<span class="token punctuation">:</span> now_p<span class="token operator">=</span>i<span class="token punctuation">(</span>now_p<span class="token punctuation">)</span> <span class="token keyword">else</span><span class="token punctuation">:</span> now_p<span class="token operator">=</span>i<span class="token punctuation">(</span>text<span class="token punctuation">[</span>head_num<span class="token punctuation">:</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token keyword">if</span> <span class="token string">'_'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> <span class="token keyword">if</span> now_p<span class="token punctuation">:</span> now_p<span class="token operator">=</span>u<span class="token punctuation">(</span>now_p<span class="token punctuation">)</span> <span class="token keyword">else</span><span class="token punctuation">:</span> now_p<span class="token operator">=</span>u<span class="token punctuation">(</span>text<span class="token punctuation">[</span>head_num<span class="token punctuation">:</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token keyword">if</span> <span class="token string">'-'</span> <span class="token keyword">in</span> head_mark<span class="token punctuation">:</span> <span class="token keyword">if</span> now_p<span class="token punctuation">:</span> now_p<span class="token operator">=</span>s<span class="token punctuation">(</span>now_p<span class="token punctuation">)</span> <span class="token keyword">else</span><span class="token punctuation">:</span> now_p<span class="token operator">=</span>s<span class="token punctuation">(</span>text<span class="token punctuation">[</span>head_num<span class="token punctuation">:</span><span class="token punctuation">]</span><span class="token punctuation">)</span> res<span class="token punctuation">.</span>append<span class="token punctuation">(</span>now_p<span class="token punctuation">)</span> <span class="token keyword">return</span> res <div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}"></div></code></pre> <p>转译部分的代码如下:</p> <pre data-index="3" class="set-code-show prettyprint"><code class="prism language-python has-numbering" onclick="mdcp.signin(event)" style="position: unset;"> <span class="token keyword">elif</span> tag <span class="token operator">==</span> <span class="token string">'<p>'</span><span class="token punctuation">:</span> <span class="token comment">#段落</span> texts<span class="token operator">=</span>kw<span class="token punctuation">[</span><span class="token string">'text'</span><span class="token punctuation">]</span> _p<span class="token operator">=</span>p<span class="token punctuation">(</span><span class="token string">''</span><span class="token punctuation">)</span> htmltexts<span class="token operator">=</span>self<span class="token punctuation">.</span>__tinP_to_html<span class="token punctuation">(</span>texts<span class="token punctuation">)</span> <span class="token keyword">for</span> htmltext <span class="token keyword">in</span> htmltexts<span class="token punctuation">:</span> _p<span class="token punctuation">.</span>add<span class="token punctuation">(</span>htmltext<span class="token punctuation">)</span> _body<span class="token punctuation">.</span>add<span class="token punctuation">(</span>_p<span class="token punctuation">)</span> <div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}"></div></code></pre> <p>尽量保持转译部分的干净,额外的处理交给转译器类的内置函数。</p> <h3><a name="t5"></a><a id="_147"></a>效果展示</h3> <p>下图中,左侧为浏览器,右侧为TinText.TinReader。<br> <img src="https://1000bd.com/contentImg/2024/09/08/c1b41440eb360c74.gif" alt="在这里插入图片描述"></p> </div> </div> </li> <li class="list-group-item ul-li"> <b>相关阅读:</b><br> <nobr> <a href="/Article/Index/941324">交换机与路由技术-12-单臂路由</a> <br /> <a href="/Article/Index/1478070">将Excel中的数据导入shell脚本,并调用expect脚本</a> <br /> <a href="/Article/Index/1050142">nodeJs 基础</a> <br /> <a href="/Article/Index/1474525">2015-2020年全国地区生产总值及一二三产构成数据总览,shp/excel格式</a> <br /> <a href="/Article/Index/1397908">函数式编程:Rust中的闭包与迭代器</a> <br /> <a href="/Article/Index/752358">【音视频】srs直播平台搭建</a> <br /> <a href="/Article/Index/1050884">R语言使用lead函数将dataframe数据向前移动指定的行数(尾部补NA值)</a> <br /> <a href="/Article/Index/883052">在 Qt 中实现变色的图标(tintColor)</a> <br /> <a href="/Article/Index/804681">StarkWare:关于Cairo的10个资源</a> <br /> <a href="/Article/Index/1197034">微服务框架 SpringCloud微服务架构 16 SpringAMQP 16.3 入门案例的消息接收</a> <br /> </nobr> </li> <li class="list-group-item from-a mb-2"> 原文地址:https://blog.csdn.net/tinga_kilin/article/details/140995975 </li> </ul> </div> <div class="col-lg-4 col-sm-12"> <ul class="list-group" style="word-break:break-all;"> <li class="list-group-item ul-li-bg" aria-current="true"> 最新文章 </li> <li class="list-group-item ul-li"> <nobr> <a href="/Article/Index/1906469">【JVM】编译执行与解释执行的区别是什么?JVM 使用哪种方式?</a> <br /> <a href="/Article/Index/1907193">用 Hashids 优雅解决 C 端自增 ID 暴露问题</a> <br /> <a href="/Article/Index/1907195">V8引擎 精品漫游指南--Ignition篇(上) 指令 栈帧 槽位 调用约定 内存布局 基础内容</a> <br /> <a href="/Article/Index/1907196">LLVM Pass快速入门(四):代码插桩</a> <br /> <a href="/Article/Index/1907197">milkup:桌面端 markdown AI续写和即时渲染</a> <br /> <a href="/Article/Index/1907198">基于项目工程构建SBOM(软件物料清单)的研究</a> <br /> <a href="/Article/Index/1907199">鸿蒙应用开发UI基础第二节:鸿蒙应用程序框架核心解析与实操</a> <br /> <a href="/Article/Index/1907200">.NET 中如何快速实现 List 集合去重?</a> <br /> <a href="/Article/Index/1907201">扣子Coze实战:从0到1打造抖音+小红书热点监控智能体</a> <br /> <a href="/Article/Index/1907202">浅谈数据访问层</a> <br /> </nobr> </li> </ul> <ul class="list-group pt-2" style="word-break:break-all;"> <li class="list-group-item ul-li-bg" aria-current="true"> 热门文章 </li> <li class="list-group-item ul-li"> <nobr> <a href="/Article/Index/888177">十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!</a> <br /> <a href="/Article/Index/797680">奉劝各位学弟学妹们,该打造你的技术影响力了!</a> <br /> <a href="/Article/Index/888183">五年了,我在 CSDN 的两个一百万。</a> <br /> <a href="/Article/Index/888179">Java俄罗斯方块,老程序员花了一个周末,连接中学年代!</a> <br /> <a href="/Article/Index/797730">面试官都震惊,你这网络基础可以啊!</a> <br /> <a href="/Article/Index/797725">你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法</a> <br /> <a href="/Article/Index/797702">心情不好的时候,用 Python 画棵樱花树送给自己吧</a> <br /> <a href="/Article/Index/797709">通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!</a> <br /> <a href="/Article/Index/797716">13 万字 C 语言从入门到精通保姆级教程2021 年版</a> <br /> <a href="/Article/Index/888192">10行代码集2000张美女图,Python爬虫120例,再上征途</a> <br /> </nobr> </li> </ul> </div> </div> </div> <!-- 主体 --> <!--body结束--> <!--这里是footer模板--> <!--footer--> <nav class="navbar navbar-inverse navbar-fixed-bottom"> <div class="container"> <div class="row"> <div class="col-md-12 text-center"> <div style="padding:0px 5px;"> <a href="/tools">小工具</a> <a href="https://games.1000bd.com">小游戏</a> </div> <div class="text-muted center foot-height"> Copyright © 2022 侵权请联系<a href="mailto:2656653265@qq.com">2656653265@qq.com</a>    <a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2022015340号-1</a> </div> <div style=" padding:5px 0;"> <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010502049817" style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"> <img src="" style="float:left;" /><p style="float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px; color:#939393;">京公网安备 11010502049817号</p></a> </div> </div> </div> </div> </nav> <!--footer--> <!--footer模板结束--> <script src="/js/plugins/jquery/jquery.js"></script> <script src="/js/bootstrap.min.js"></script> <!--这里是scripts模板--> <!--scripts模板结束--> </body> </html>