Featuring WebStyle state support for creating more polished user interfaces, enhanced event handling capabilities, and a collection of bug fixes and utility improvements, 2025r2 continues improvements to your Web Application development experience with Xojo.
Added Support for WebStyle States
Working on Desktop projects is all fun and jokes. You can just change how the whole application looks every time your application users move their mouse one pixel to the left. Latency? Who cares!
In order to achieve the same results, WebStyle has been improved to support states. Hover, Pressed and Visited.
- WebStyle.Hover
This is the style that will be applied when the mouse is over the element - WebStyle.Pressed
This is the style that will be applied when the user is pressing a mouse button in the element - WebStyle.Visited
This style can be used with WebLink instances. Used to let the user know the browser has visited that link in the past
Consider the following WebContainer:
In this case, it’s just a container with a WebLabel inside.
The Opening event contains the following code:
Please note I’m using named colors. You can read more about named colors in Introducing Named Color and CSS Classes in Xojo Web. If you try using another Bootstrap theme, the same code will use the new color palette without modifications.
Here is the result:
Combined with WebStyle.AddTransition, it opens the gates for more interesting GUIs. Let’s add some transitions to our code:
Let’s try the project again:
Neat! Let’s go crazy for a second with more complex effects:
The result:
You should definitely avoid going that crazy, this is just to show the possibilities. As Dr. Ian Malcolm said … “Your scientists were so preoccupied with whether or not they could, they didn’t stop to think if they should.”
WebContainer.Pressed
Speaking about pressing on things, WebContainer.Pressed event is now available, so you don’t need to place a WebLabel or a WebContainer on top just to capture that event anymore. The event comes with some coordinates, just in case you need them.
The result:
Other changes
WebToolbar.Resized
Trying to tweak your design for different screen sizes? If WebToolbar’s automated behavior is not enough, you can implement the new WebToolbar.Resized event and adapt the contents. This is useful when you are reusing the same WebToolbar subclass in multiple WebPages. You will be able to place this code in just one place.
Exporting maps with WebMapViewer
Same as with MobileMapViewer. You can now use WebMapViewer.ToPicture method to export the current map. Like WebChart.ToPicture, due to the asynchronous nature of Web projects, the picture will be available in the new WebMapViewer.RequestedPicture event.
Updated DataTables
Last, but not least, DataTables has been upgraded from v1.13.4 to v2.2.2.
That’s (not) all!
As always, please make sure to check the release notes for a detailed list of new features and bug fixes. The Web framework is built on top of Xojo, new global features or bug fixes also applies to Web, including improvements to Console projects. Xojo Web is “just” a big Console project.
Thank you everyone for reporting, testing beta builds and giving us feedback.
Happy coding!
Ricardo has always been curious about how things work. Growing up surrounded by computers he became interested in web technologies in the dial-up connections era. Xojo has been his secret weapon and language of preference since 2018. When he’s not online, chances are he will be scuba diving … or crocheting amigurumis. Find Ricardo on Twitter @piradoiv.