How do I apply tag conditionals when using wx.html2?

Question

I put the conditional expression in {2}, {3} and try to put green in case of Ture and red in case of False. Is it possible to use SetForegroundColour to represent colors? If you run it, it will be None. Do you need another method?
I also tried background-image: url ('1.png'); to specify the background, it's a white background. When using <img scr = 1.png /> inside the body tag, an x display image error appears.

# -*- coding: utf-8 -*- 
import wx
import wx.html2
import sqlite3 
    
class AppFrame(wx.Frame):    
    def __init__(self, parent):    
        super(AppFrame, self).__init__(parent)    
        self.html_view = wx.html2.WebView.New(self)    
        sizer = wx.BoxSizer(wx.VERTICAL)    
        sizer.Add(self.html_view, 1, wx.EXPAND)    
        self.SetSizer(sizer)    

if __name__ == '__main__':    
    i = 'test1'    
    j = 'test2'    
    k = ('True', 'False')    
    l = ('True(color Green)', 'False(color Red)', 'How??')    

    for loop1 in k: pass    
    if loop1 == 'True': a = print(k[0])    
    else: a = print(k[1])    

    app = wx.App()    
    frame = AppFrame(None)    
    frame.html_view.SetPage("""    
      <!doctype html>    
      <html lang="ko">    
        <head>    
          <meta charset="utf-8">    
          <title>HTML TEST</title>    
          <style>    
            table{{    
              width: 100%;    
              border-collapse: collapse    
            }}    
            table, th, td{{    
              border: 2px solid #bcbcbc;    
              text-align: center;    
            }}    
            body{{    
              background-image:url('1.png');    
              background-position: conter conter;    
              background-color:gold;    
            }}    
          </style>    
        </head>    
        <body>    
          <table>    
            <caption><h1>Hello world!<h1></caption>    
            <thead>    
              <tr>          
                <th>{0}</th>    
                <th>{1}</th>    
                <th>Ipsum</th>    
                <th>Ipsum</th>    
                <th>Ipsum</th>    
                <th>Ipsum</th>      
              </tr>    
            </thead>    
            <tbody>    
              <tr>          
                <td>{2}</td>    
                <td>{3}</td>    
                <td>Dolor</td>    
                <td>Dolor</td>    
                <td>Dolor</td>    
                <td>Dolor</td>      
              </tr>    
            </tbody>    
            <tfoot>    
              <tr>    
                <td colspan="6">Table Foot</td>    
              </tr>    
            </tfoot>      
          </table>    
          <script>    
              if({0} == 'True'){{    
                  ???    
              }}      
              else{{    
                  ???    
              }}      
          </script>    
        </body>    
      </html>    
    """.format(i, j, a, l), "")    
    frame.Show(True)    
    app.MainLoop()

Domagoj · Accepted Answer · 2023-01-12T10:00:06.813

It was a bit hard to comprehend what do you want but here is the simplest example of conditional background change of HTML element using .format. Be advised, to modify example for Python 3. CSS snippet background-color can be used on any element that supports it such as your <th></th> elements. If you want to change the text color just use the color attribute. Same can be applied in your <style> section of the HTML code.

import wx
import wx.html2
class AppFrame(wx.Frame):
    def __init__(self, parent):
        super(AppFrame, self).__init__(parent)
        self.html_view = wx.html2.WebView.New(self)
        sizer = wx.BoxSizer(wx.VERTICAL)
        sizer.Add(self.html_view, 1, wx.EXPAND)
        self.SetSizer(sizer)

if __name__ == '__main__':

    Test = True

    if Test == True:
        color = 'Green'
    else:
        color = 'Red'

    app = wx.App()
    frame = AppFrame(None)
    frame.html_view.SetPage("""
            <!doctype html>
            <html lang="ko">
              <head>
                <meta charset="utf-8">
                <title>HTML TEST</title>
                <style>
                  body{{
                    background-position: conter conter;
                    background-color:gold;
                  }}
                </style>
              </head>
              <body>
              <p>Normal text</p>
              </br>
              <p style="background-color:{0}">Conditionally changed background for Test={1}</p>
              </br>
              </body>
            </html>""".format(color, Test), "")
    frame.Show(True)
    app.MainLoop()

I learned a lot in the answer Thank you. One more thing I want to know is that if you use `showfullscreen`, all the scrollbars are deleted in `html`, but the right scrollbar is active in `html2`. Can not delete? I have given a `1.png` image to the background, but I want to know if it works in `html2` The operating system is Windows. — 다크매터, Aug 29 '17 at 03:21
The problem you are describing is quite specific for the html code you are writing and end goal of your app. Operating system should not be the problem. Try to experiment with the `body {overflow:hidden}` CSS snippet. https://stackoverflow.com/a/3296701/1771956 — Domagoj, Aug 29 '17 at 12:48

How do I apply tag conditionals when using wx.html2?

1 Answers1