jarvisteach / appJar

Simple Tkinter GUIs in Python
http://appJar.info
Other
615 stars 68 forks source link

Style classes like CSS? Have to set font each widget. #481

Closed ghost closed 4 years ago

ghost commented 6 years ago

Is there a way to set font family and other stylings by class (as in CSS class) to avoid repetitious coding on each widget? As far as I can tell, I will have to set font family on each widget separately to avoid error messages and have already set all the other styles separately. It would be great if I could assign a class to a widget and then define the class once like in CSS. Thanks for the awesome GUI maker, I am in 7th heaven using appJar, finally able to make a front end for a sqlite db (I hope) without going to coder school for years. The reason I'm not able to set font globally (without error messages) is demonstrated below.

from appJar import gui 

app = gui("appjar font problem", "400x400")

#.setFont(**style) # can I see an example? Instructions at http://appjar.info/pythonGuiOptions/ just say "This can be used to set the font for all widgets. Pass in any of the above styles that are required." This doesn't mean anything to me.

#app.setFont(family="Courier") # works but gives error message copied at bottom

#app.setFont(20, "Courier") # size works, family is ignored; no error message

app.addLabel("l1", "Times")
app.addLabel("l2", "Comic Sans")
app.addLabel("l3", "Helvetica")
app.addLabel("l4", "Sans Serif")
app.addLabel("l5", "Verdana")
app.addLabel("l6", "Courier")
app.addLabel("texas", "Texas")

app.getLabelWidget("l1").config(font="Times 20 italic underline")
app.getLabelWidget("l2").config(font=("Comic Sans", "20", "normal"))
app.getLabelWidget("l3").config(font="Helvetica 20 underline")
app.getLabelWidget("l4").config(font=("Sans Serif", "20", "bold"))
app.getLabelWidget("l5").config(font="Verdana 20 overstrike")
app.getLabelWidget("l6").config(font="Courier 12 bold")
app.getLabelWidget("texas").config(font="Courier 20 italic")

app.go()
2018-07-14 17:00:08,872 appJar:ERROR [Line 7->2630/_fontHelper]: Failed to adjust inputFont to Times.
2018-07-14 17:00:08,872 appJar:ERROR [Line 7->2630/_fontHelper]: Failed to adjust labelFont to Times.
2018-07-14 17:00:08,872 appJar:ERROR [Line 7->2630/_fontHelper]: Failed to adjust buttonFont to Times.

Setting font family works but this error appears in the console every time I run a program in which I've set font family.

jarvisteach commented 6 years ago

Hi @Whearly - glad you're enjoying using appJar.

There is an example of how to set the font on the page you mention: http://appjar.info/pythonGuiOptions/#font

app.setFont(size=16, family="Times", underline=True, slant="italic")
app.setButtonFont(size=14, family="Verdana", underline=False, slant="roman")

And it seems to work fine on my platform.

jarvisteach commented 6 years ago

@Whearly - I've been thinking about this a bit more and have come up with the following...

First create your stylesheet, called myStyle.py:

body = { 
    'geom':'400x400', 
    'font':{'size':33, 'family':"helvetica", 'weight':'normal', 'underline':False, 'slant':"roman", 'overstrike':False},
    'bg':'yellow',
    'fg':'red'
}

t1 = { 
    'font':{'size':16, 'family':"times", 'weight':'normal', 'underline':False, 'slant':"italic", 'overstrike':True},
    'bg':'red',
    'fg':'pink'
}
t2 = { 
    'font':{'size':20, 'family':"times", 'weight':'normal', 'underline':False, 'slant':"italic", 'overstrike':True},
    'bg':'green',
    'fg':'orange'
    }   
t3 = { 
    'font':{'size':24, 'family':"times", 'weight':'bold', 'underline':True, 'slant':"roman", 'overstrike':False},
    'bg':'blue',
    'fg':'green'
    }   
t4 = { 
    'font':{'size':28, 'family':"times", 'weight':'bold', 'underline':True, 'slant':"roman", 'overstrike':False},
    'bg':'yellow',
    'fg':'blue'
    }   

Then, use it in your code:

from appJar import gui 
import myStyle as style

with gui("appjar font problem", **style.body) as app:
    app.label("l1", "Label 1")
    app.label("l2", "Label 2")
    app.label("l3", "Label 3", **style.t1)
    app.label("l4", "Label 4", **style.t2)
    app.label("l5", "Label 5", **style.t3)
    app.label("l6", "Label 6", **style.t4)
    app.label("l7", "Label 7")
jarvisteach commented 6 years ago

The myStyle.py file looks similar to a css file, except for all the extra quotation marks.

We then just unpack the style in the call to add labels.

jarvisteach commented 6 years ago

I might look into making this a feature of a future release - appJar can auto look for a style file, and then have a specific parameter for style ids...

jarvisteach commented 4 years ago

Closing this, as happy with the current implementation.