I freely admit to knowing next to nothing about theme files and I honestly hope to keep as close to that standard as possible. However, having read the AnyScreen documentation, I thought maybe, just maybe, I would see results on various controls using a different theme than what is offered using Shift+F12 when testing thru the Clarion IDE.
Unfortunately, no differences are displayed. It definitely looks as if using AnyScreen:SetCSSFile(‘MyStyle.css’) with an unnamed theme is not enough. It also looks as if using AnyScreen:SetTheme(‘MyTheme’) does not change the display. Neither of these functions are documented to return results, so error checking is not obvious.
Attached is a zip of the simple test application with a theme file. Any suggestions?
AnyScreenTheme.zip (471.6 KB)
1 Like
From reading the overwhelming response, let me ask the question in a more general way:
Might anyone have a simple CSS file and example of how to implement it in AnyScreen?
Well there was an example posted in the AnyScreen newsgroup by Sanjin of how to change the background colour of a list.
So with for example the Invoice APP you’d create an Invoice.CSS file in the same folder with this line
.cla-list { background-color: #05193a !important; }
I’ve tested the above using the HTML5 client in the Clarion IDE and the .CSS colour change is applied.
Thank you. Unfortunately, I can’t test until Tuesday. Can I assume you had to call AnyScreen:SetCSSFile?
In the test I included, the display of controls is not necessarily consistent within each of the 4 themes included. The Clarion theme, for most controls, does not indicate the selected control. The Bootstrap themes both result in a very strange spin box. Nevertheless, I am hopeful that a good CSS just might be what is needed to overcome at least some of the shortcomings.
No, no call to any AnyScreen method, just ensure the .CSS has the same name as the EXE
I don’t think you can apply a theme in that way however, and the Clarion IDE themes seem to be hard-wired into the IDE so the AnyScreen:SetTheme etc will only work in an AnyScreen server.
Was thinking too this is the case. Unfortunately, Marko sort of glossed over the theme details in his ClarionLive presentation. Documentation at this point is only basic.
Agree. It does seem to pick up a CSS with the same name and in the same folder. Why the result I see for your example line looks more like a greenbar (every other line colored) plus list header is another question.
Was able to use this and a couple of additional background color settings so a demo was marginally less ugly. Unfortunately, using the Tab key to advance between fields under AnyScreen still fails to properly show the selected field or in the case of a selected numeric entry, may in fact disable the control.
If you can produce a small stand-alone (no 3rd Party stuff) demo for the Tab key issue I’ll post it on the newsgroups for you.
Here is the zip that was uploaded for the PTSS.AnyScreenTab.zip (124.3 KB)
I tested using 13744 and Opera and everything worked as expected.
What do you see and which browser are you using?
Using Firefox w/ AnyScreen
- Window opens, the string entry field is not outlined as selected
- Enter string in the field
- Hit tab key to move to numeric entry field
- Default amount of $0.00 displays in a highlighted color
- Entry of any numeric key or even delete does nothing to the field
- Only after re-clicking on the numeric entry field, is entry possible
- Tabbing between other fields does NOT outline selected field.
I have not considered browser differences when testing AnyScreen.
OK try using different browsers
because it does make a difference. With Chrome the first field isn’t highlighted, but with Opera it is. For me both with Opera and Chrome entering numbers works OK
After your last reply, I tried with Chrome and saw the same results as with Firefox.
I also see the same problems with MS Edge.
I am beginning to believe that using PROP:Wizard on a SHEET causes a lot of the display problems.
Attached is a simplified example that does not show the selected field problems BUT does demo control event problems under AnyScreen - (ie a Qty * Amount calculated total not always displayed).
AnyScreenTotal.zip (11.0 KB)
Further testing yesterday showed this to be absolutely true.
Some other useful CSS selectors for setting AnyScreen colors:
.cla-list table {backgroud-color: MyListBack}
.cla-list table thead {background-color: MyListHeaderBack; color: MyListHeaderText}
.cla-list table tbody {background-color: MyListBodyBack;}
.entry.readonly input {background-color: MyEntryReadOnlyBack;}
.text textarea {background-color: MyTextboxBack;}
.text.readonly textarea {background-color: MyTextReadOnlyBack;}
.window {background-color: MyWindowBack;}
.window .window-title {background-color: MyWinCaptionBack; color:MyWinCaptionText}
.button {background-color: MyBtnBack; color:MyBtnText}
Have yet to sort out the CSS selectors for a listbox highlight bar, checkbox when checked, radio when set.