隨筆 - 67  文章 - 79  trackbacks - 0
          <2008年8月>
          272829303112
          3456789
          10111213141516
          17181920212223
          24252627282930
          31123456

          常用鏈接

          留言簿(1)

          隨筆檔案

          文章檔案

          相冊

          搜索

          •  

          最新評論

          閱讀排行榜

          評論排行榜

          書接上回,繼續研究WebKit 實現了夢幻中的三位一體式的XmlRichEdit
          示范效果:

          在View面板上的修改能體現在Edit上
          同樣修改了Edit 也能體現在View面板上

          同時數據使用xml描述,xslt轉換到html,使用webkit渲染html并響應其中的html事件
          以后只要修改xml和xslt就能產生不同的效果

          xml 表達 數據Model:
          template.xml
          <?xml version="1.0"?>
          <?xml-stylesheet type="text/xsl" href="richedit.xsl"?>
          <document id='doc'>
          <title id='title'>Template</title>
          <text id='text'>1234567891234</text>
          </document>

          xsl 將xml轉換到html:
          richedit.xsl
          <xsl:stylesheet version="1.0"
              xmlns:xsl
          ='http://www.w3.org/1999/XSL/Transform'>
              
          <xsl:output method="html" />

              
          <xsl:template match="document">
                  
          <html>
                      
          <head>
                          
          <meta http-equiv="content-type"
                              content
          ="text/html; charset=UTF-8" />
                          
          <script type="text/javascript">
                              function onChanged(e,id) { var element
                              =document.getElementById(id);
                              python.onChanged(id,element.textContent); }
                          
          </script>
                      
          </head>
                      
          <body>
                          
          <div>
                              
          <xsl:attribute name='id'>
                          
          <xsl:value-of select='@id' />
                      
          </xsl:attribute>
                              
          <xsl:apply-templates />
                          
          </div>
                      
          </body>
                  
          </html>
              
          </xsl:template>

              
          <xsl:template match="title">
                  
          <div>
                      
          <h1>
                  
          <xsl:attribute name='id'>
                      
          <xsl:value-of select='@id' />
                  
          </xsl:attribute>

                  
          <xsl:attribute name='contenteditable'>
                    
          <xsl:text>true</xsl:text>
                  
          </xsl:attribute>
                  
                  
          <xsl:attribute name='onkeyup'>
                    
          <xsl:text>onChanged(event,'</xsl:text>
                    
          <xsl:value-of select='@id' />
                    
          <xsl:text>')</xsl:text>
                  
          </xsl:attribute>

                  
          <xsl:value-of select='.' />
                      
          </h1>
                  
          </div>
              
          </xsl:template>

              
          <xsl:template match="text">
                  
          <div>
                      
          <p>
                  
          <xsl:attribute name='id'>
                      
          <xsl:value-of select='@id' />
                  
          </xsl:attribute>

                  
          <xsl:attribute name='contenteditable'>
                    
          <xsl:text>true</xsl:text>
                  
          </xsl:attribute>

                  
          <xsl:attribute name='onkeyup'>
                    
          <xsl:text>onChanged(event,'</xsl:text>
                    
          <xsl:value-of select='@id' />
                    
          <xsl:text>')</xsl:text>
                  
          </xsl:attribute>

                          
          <xsl:value-of select='.' />
                      
          </p>
                  
          </div>
              
          </xsl:template>

          </xsl:stylesheet>

          python腳本 將html渲染到WebKit:
          xml_utils.py
          from lxml import etree

          def getElementById(doc,id):
               
          return doc.xpath("//*[@id='%s']"%id)[0]
           
          def XSLTransform(xml,xslt):
              
          try:
                  
          return xslt(xml)
              
          except Exception,e:
                  transform
          =etree.XSLT(etree.parse(xslt))
                  
          try:
                      
          return transform(xml)
                  
          except Exception,e:
                      root
          =etree.parse(xml)
                      
          return transform(root)
               
          if __name__=='__main__':
              
          print XSLTransform('template.xml''richedit.xsl')
            

          sample.py
          import sys,locale
          from lxml import etree
          from PyQt4 import Qt
          from PyQt4 import QtCore
          from PyQt4 import QtGui
          from PyQt4 import QtWebKit

          import xml_utils

          encoding
          =locale.getdefaultlocale()[1]



          class PythonJS(QtCore.QObject):
              
              
          __pyqtSignals__ = ("contentChanged(const QString &,const QString &)")
              
              @QtCore.pyqtSignature(
          "QString,QString")
              
          def onChanged(self, id,msg):
                  
          #print msg,id
                  self.emit(QtCore.SIGNAL('contentChanged(const QString &,const QString &)'),id, msg)

              @QtCore.pyqtSignature(
          "", result="QString")
              
          def message(self): 
                  
          return "Message!"

          class MainWindow(QtGui.QMainWindow):
              
          def __init__(self):
                  super(MainWindow,self).
          __init__()
                  self.update
          =True
                  self.xml
          =etree.parse('template.xml')
                  
                  
                  self.tabs
          =QtGui.QTabWidget(self)
                  self.browser
          =QtWebKit.QWebView(self.tabs)
                  self.edit
          =QtGui.QPlainTextEdit(self.tabs)
                  
                  self.tabs.addTab(self.browser,
          'View')
                  self.tabs.addTab(self.edit,
          'Edit')
                  
                  self.edit.setPlainText(etree.tostring(self.xml,pretty_print
          =True))
                  
                  self.pjs
          =PythonJS()
                  
                  self.connect(self.edit,QtCore.SIGNAL(
          'textChanged()'),self.onTextChanged)
                  self.connect(self.pjs,QtCore.SIGNAL(
          'contentChanged(const QString &,const QString &)'),self.onJSMessage)
                  self.connect(self.browser.page().mainFrame(),QtCore.SIGNAL(
          'javaScriptWindowObjectCleared ()'),self.onObjectClear)
                  
                  html
          =xml_utils.XSLTransform(self.xml, 'richedit.xsl')
                  self.browser.setHtml(unicode(html))
                  
              
          def onJSMessage(self,id,msg):
                  
                  self.html
          = self.browser.page().mainFrame ().toHtml()
                  
          #print unicode(self.html).encode(encoding)
                  self.setEditText(id,msg)
                  
              
          def resizeEvent(self,s):
                  size
          =self.size()
                  self.tabs.resize(size)

              
          def setEditText(self,id,str,update=False):
                  t
          =self.update
                  self.update
          =update
                  e
          =xml_utils.getElementById(self.xml, id)
                  e.text
          =unicode(str)
                  self.edit.setPlainText(etree.tostring(self.xml,pretty_print
          =True))
                  self.update
          =t
                  
                      
              
          def onTextChanged(self):
                  
          if self.update:
                      
          try:
                          self.xml
          = etree.fromstring(unicode(self.edit.toPlainText()) )
                          
          try:
                              html
          =xml_utils.XSLTransform(self.xml, 'richedit.xsl')
                              html
          =unicode(html)
                              
          if html:
                                  self.browser.setHtml(html)
                                  self.browser.page().mainFrame().addToJavaScriptWindowObject(
          'python',self.pjs) 
                                  self.browser.reload()
                          
          except Exception,e:
                              
          print e
                      
          except Exception,e:
                          
          print e
                      
              
          def onObjectClear(self):
                  self.browser.page().mainFrame().addToJavaScriptWindowObject(
          'python',self.pjs)  
              
          if __name__=='__main__':
              app
          =QtGui.QApplication(sys.argv)
              frame
          =MainWindow()
              frame.show()
              sys.exit(app.exec_())       
                  





          posted on 2008-08-01 12:01 zarra 閱讀(2407) 評論(4)  編輯  收藏

          FeedBack:
          # re: 使用Webkit和xml、xslt 實現html風格的RichEdit試驗[未登錄] 2008-08-03 13:09 apple
          牛人啊~~~剛開始的代碼還能看懂,再往下看只能一楞塄的了!!  回復  更多評論
            
          # re: 使用Webkit和xml、xslt 實現html風格的RichEdit試驗 2008-08-04 11:16 zarra
          是webkit功能強大 ,雖說這些類似Xulrunner風格的gui框架,是給沒有gui編程經驗的設計師們準備的,但是卻給了統一文檔,視圖框架的契機  回復  更多評論
            
          # re: 使用Webkit和xml、xslt 實現html風格的RichEdit試驗 2008-08-27 09:56 gushanke
          QT版的,我要wx版的使用指南啊,QT的lincense不行啊  回復  更多評論
            
          # re: 使用Webkit和xml、xslt 實現html風格的RichEdit試驗[未登錄] 2008-08-28 11:00 zarra
          qt比wxwidget成熟多了 自己寫東西 用qt方便很多
          wx的webkit 還沒有成氣候,再加上wx本身在類基礎上的輕量級,所以很難設想 簡單的將wx類導入到webkit里面使用
          如果商業開發 購買qt的授權和學習wx 估計二者所花的成本差不多  回復  更多評論
            

          只有注冊用戶登錄后才能發表評論。


          網站導航:
           
          主站蜘蛛池模板: 安吉县| 兰坪| 营口市| 靖边县| 台江县| 东乡族自治县| 高雄县| 广平县| 含山县| 琼海市| 新龙县| 盐山县| 休宁县| 金昌市| 昌宁县| 科尔| 额敏县| 勐海县| 西畴县| 嘉鱼县| 仁化县| 永定县| 高碑店市| 喜德县| 安义县| 永清县| 剑河县| 合肥市| 深州市| 方城县| 嘉峪关市| 禹州市| 任丘市| 安乡县| 嘉义县| 灵丘县| 林甸县| 秭归县| 吴川市| 大石桥市| 巴南区|