Im using Web 2.0, and I am lost because webstyle is no longer available.
How to remove boarder color of a WebRectangle?
me.style.value("border") = "0px;"
2 Likes
Border in Xojo has this definition of Styles:
<div id="T5ccbm" class="XojoRectangle" style="left: 20px; top: 20px; width: 150px; height: 150px; border: 1px solid rgb(206, 212, 218); border-radius: 0.25rem; background-color: rgb(255, 255, 255); position: absolute; overflow: hidden;"></div>
You can use this code in the opening event to remove the border:
Me.Style.Value("border") = ""
Me.Style.Value("border-radius") = ""
Edit: if you want to change the border this may help CSS Borders
2 Likes
Thank you.
Where can I find those? Is there a documentation on where to find that item “boarder” ? Or do I need to learn CSS and dig the html of the running xojo?
That’s what I’m doing since web 2. Learn a little CSS and see the code on the page with the browser developers tools
2 Likes
The short answer: yes you should know a little CSS (as @AlbertoD stated), I wrote a few articles in the last year, which might help you to get into the topic: https://blog.xojodocs.com/how-to-customize-xojo-web-2/
There are a few limitations. Some CSS (even if you detect the right elements can’t be changed solely by your own CSS “injection” but only via JavaScript on your element). This is for instance due to the fact that CSS has inheritance on board, and some parameters are not (easily) accessible via the style parameter of your element. But, those are the more rare cases, you can really change a lot already out-of-the-box.
In principle it is no way different then with the styles from Web1 (logic-wise). Granted, it’s less user-friendly. If you are asking why I did not add WebRectangle to https://blog.xojodocs.com/tecccss-xojo-web-plugin/ the reason is simple. I did not want to add elements, where very likely you want to have different setting per element on one page. For instance one WebRectangle with a border, and other w/o, etc. Plus I assume that overtime Xojo will add more settings to the IDE.
However, since I developed my first plugins, I learned the hard way how much work this implicates. It is not only about adding parameters to the Inspector, but for most parameters you need to create enumerations, etc. I understand why Xojo doesn’t have the resources to easily add all possible CSS settings per element, it doesn’t look like, but it is a lot of work. Plus it doesn’t add to much value, as you can change many settings already today via CSS. Last but not least, doing WEB implicates these days understanding CSS in almost every framework. I’m not aware of many alternatives, where you could say, I can change 90 percent of my elements w/o touching CSS at all.
I understand that some are complaining about this, but it is what it is, and honestly there are many areas in Xojo where you need to learn a bit beyond Xojo. Take installation programs for Windows, or notarisation of apps, certificates, declares, etc.
CSS looks overwhelming at the beginning, but it really is not rocket science, if you play around with it for 2 to 3 days. Don’t give up!
1 Like
If you want a customizable Rectangle from the IDE (including background images) without getting into CSS, there’s GraffitiRectangle.
2 Likes
And your screen shot shows very nicely how much work is behind it ;-). So you either have to kneel in CSS, or save yourself the time and hassle and invest in your very good tools.