As per corporate requirements, I had to create a Kiosk that would allow visitors in the front lobby access to a specific careers and job application web site. Obviously, the computer had to be locked down and “frozen”, which was accomplished with Windows SteadyState (see my article), I also had to make sure that the users could always reach the careers and job application web site without any distractions. Lastly, I had to make a custom screensaver that would fade the screen 50% during a certain time period and 100% the remainder. This was all accomplished by creating a simple .NET Windows application with a web browser object, a few timers and a couple of forms.
And yes, the “screensaver” fade was included in the custom web browser as well. See my article on SteadyState and Screensavers for more information on why I decided to do it that way.
Although the custom web browser was written in Visual Studio .NET 2005 Professional, anyone with a Windows XP + computer could download the free Microsoft Visual Studio 2008 Express products, such as VB.NET and create the .NET application described below.
New .NET Windows Application
Start out by creating a new .NET Windows Application in the language of your choice. For this example, I will use Visual Basic.
frmMain :: the Main Form
1. First we will modify the form, setting FormBorderStyle to None and setting WindowState to Maximized to fill the entire screen with no border.
2. Next lets drag a ToolStrip on the form, this will be used for navigation.
3. While you are dragging the ToolStrip object, drag two (2) Timer objects – we will use these later on.
4. Modify Timer1 to tick at 1000 millisecond intervals and Timer2 to tick at 180000 (3 minutes) intervals. Timer1 should be enabled and Timer2 disabled.
5. Now lets drag a WebBrowser component on to the form, this will be used for … well web browsing?
6. For minimal control, add just three buttons to the ToolStrip for controlling the WebBrowser: (1) Back; (2) Refresh; and (3) Back to devtrends.com. To make the buttons better looking than just text or the standard image, I’ve created custom bitmaps.
Modify the buttons, DisplayStyle to ImageAndText and Text to the text of the button.
On to the code…
1. Lets start by modifying the button actions, so double click on the Back button. Use the following code:
'tell the web browser to go back. If WebBrowser1.CanGoBack = True Then WebBrowser1.GoBack() End If
2. Refresh button:
'tell the web browser to refresh the page WebBrowser1.Refresh()
3. back to devtrends.com button:
'tell the web browser to go to devtrends.com WebBrowser1.Navigate("http://www.devtrends.com/")
4. Now lets modify the Load statement to contain the same code as the back to devtrends.com button. This way our web page loads first everytime.
5. Lets make sure the user cannot close the form/application by adding the following code to the FormClosing event for the form:
'prevent user from closing the application If e.CloseReason = CloseReason.UserClosing Then e.Cancel = True End If
6. Back at the top of the code, add the following variable statements:
Public mousex As Integer Public mousey As Integer
7. In the Form Load statement, add the following statements:
mousex = MousePosition.X mousey = MousePosition.Y
8. In Timer1 tick (double click on the Timer1 object in design view), add the following statements:
If mousex <> MousePosition.X Or mousey <> MousePosition.Y Then Timer2.Enabled = False Else 'the mouse has not moved... start Timer2 Timer2.Enabled = True End If 'set current mouse position. mousex = MousePosition.X mousey = MousePosition.Y
9. In Timer2 tick, add the following statements:
Dim fadeform As New frmFader fadeform.Show()
subMain :: “sub main” Module
This may be an old school method, however, we’ll create a module that contains a Sub main. Sub main will be the starting point for your application, which we will modify as the last step in this section.
Right click on your project and choose Add > Module, and name the module subMain.
1. Add the following code to your newly created module:
'instantiate public form object of frmMain, which we will use to reference later on from frmFader Public mainfrm As New frmMain Sub Main() 'display the main form. mainfrm.Show() 'keep the application running... Application.Run() End Sub
2. Modify the Visual Studio Project Properties, uncheck “Use Application Framework” and choose Startup object, “Sub Main”.
frmFader :: “Screensaver” Fader Form
Lets create the next form, frmFader. Right click on your project and choose Add > Windows Form, and name the form frmFader. Immediate make the following design modifications to your new form:
1. Change WindowState to Maximized.
2. TopMost to True.
3. ShowInTaskbar to False.
4. FormBorderStyle to None.
5. BackColor to Black.
Next we’ll modify the code behind the frmFader form that will make the form 50% transparent or 0% transparent, depending on the time of day. Remember, I needed an application that would black the screen out during a certain time window.
1. At the top of the code, add the following statements, which will be used to watch if the mouse is moved:
Public mousex As Integer Public mousey As Integer
2. In the Form Load sub, add the following code:
'stop Timer1 and Timer2 on frmMain mainfrm.Timer1.Enabled = False mainfrm.Timer2.Enabled = False 'set current mouse positions mousex = MousePosition.X mousey = MousePosition.Y 'hide the mouse cursor Cursor.Hide() 'get the current hour Dim curHour As Integer curHour = Hour(Now()) 'if the time is between 8am and 5pm then use 50% otherwise 100% If curHour >= 8 And curHour <= 17 Then Me.Opacity = 0.5 Else Me.Opacity = 1 End If
The comment lines explain most of what the code is doing. However, in the beginning of the code, I have it stop the Timers on the calling form (frmMain). This is required otherwise you would get multiple “screensavers” appear every 3 minutes.
3. In the Form Closing sub, we must add the following code to ensure the screensaver will reappear (we did stop the timers and hid the mouse cursor, remember?):
mainfrm.Timer1.Enabled = True Cursor.Show()
4. Finally, lets watch for mouse movement on the form as we want to close the form when the mouse is moved. In the Form Mousemove sub, add the following code:
If mousex <> MousePosition.X Or mousey <> MousePosition.Y Then 'the mouse moved... lets close this overlayed form Me.Close() End If
That’s it…I’m out. If you want to cheat, just download the source code below. And as always, use this stuff at your own risk.