This post originated from an RSS feed registered with Agile Buzz
by James Robertson.
Original Post: Making an About Window...
Feed Title: Michael Lucas-Smith
Feed URL: http://www.michaellucassmith.com/site.atom
Feed Description: Smalltalk and my misinterpretations of life
I recently had the need to make an 'About' window for WithStyle. Given the nature of presenting information using CSS and XML, I thought it'd be fun to make the About window a simple window which contains a WithStyle widget and some styled HTML.
This allows me to get a mixture of good Look and Feel for, what's usually a presentation window, and actual information about a product, eg: what version it is, etc.
So how do you do it? Well, we start with a subclass of WithStyle.Client.WsThinClientWindow and I called it WsAboutWindow.
From here, we need to make a window spec that'll fit our needs. I copied the ThinClient's windowSpec, removed the toolbar and menubar, set its position to come up centered in the screen, locked its width and height to 400x300.
At this point, we can open up the window using WithStyle.Client.WsAboutWIndow open, but that's not terribly exciting yet. To add a bit of magic we need to throw in the contents of the window.
So, add yourself a postBuildWith: method to the window. In that method we write:
postBuildWith: aBuilder
super postBuildWith: aBuilder.
self browserWidget documentSource: self about
Next, we throw some content in to the about method, we can get that content from anywhere. But I just inline it in to the method:
aboutMessage
^'<html>
<head>
<title>About WithStyle</title>
<style type="text/css">', self aboutStyles, '</style>
</head>
<body>
<h1>WithStyle</h1>
<p id="copyright">WithStyle is a trade mark of Software WithStyle Pty Ltd.</p>
<p id="link"><a href="http://www.softwarewithstyle.com">www.softwarewithstyle.com</a></p>
<p id="version">Version: 1.0</p>
<p id="version">Build: ', self build, '</p>
</body>
</html>'
I have a method that figures out the build number for WithStyle and I also have aboutStyles which contains the CSS for this source code:
That's all there is to it. Now you've made the most simplest of WithStyle windows for giving out some About information. Also, the presentation of it is better than what you can achieve using regular UI techniques.
There's any number of refactoring techniques we can use on our About HTML and CSS too, but those are for the coding style experts to divulge.