Last month, Rey Dacoco began a series titles “Visual F# 100 Examples”. He posted Example Number 1 on 2010-10-18. I copied his code into a new Mercurial repository, revised it, then coded a Silverlight version.
“Problem: Make a windows form application that will ask the user’s mental age and chronological age and display his intelligence quotient (IQ).”
namespace Example001Silverlight
open System
open System.Windows
open System.Windows.Controls
open System.Windows.Media
module UI =
let createForm() =
let form = Canvas()
form.Width <- 300.
form.Height <- 200.
form.Background <- SolidColorBrush Colors.LightGray
// create the controls
let title = TextBlock(Text="Compute IQ")
let n1label = TextBlock(Text="Mental age:")
let firsttextbox = TextBox(Width=30.)
let n2label = TextBlock(Text="Chronological age:")
let secondtextbox = TextBox(Width=30.)
let n3label = TextBlock(Text="IQ:")
let anslabel = TextBlock()
let addbutton = Button(Content="Compute")
// add the controls to the form
let addToForm uiElement (top:double) (left:double) =
form.Children.Add uiElement
uiElement.SetValue(Canvas.TopProperty, top)
uiElement.SetValue(Canvas.LeftProperty, left)
addToForm title 5. 5.
addToForm n1label 40. 5.
addToForm firsttextbox 40. 120.
addToForm n2label 70. 5.
addToForm secondtextbox 70. 120.
addToForm n3label 100. 5.
addToForm anslabel 100. 120.
addToForm addbutton 130. 120.
//when the compute button is clicked
//display the iq value in the anslabel
addbutton.Click.Add(fun _ ->
try
let manum = Convert.ToDouble firsttextbox.Text
let canum = Convert.ToDouble secondtextbox.Text
let iq = Convert.ToDouble((manum/canum)*100.00)
anslabel.Text <- Convert.ToString(iq)
with :? FormatException ->
anslabel.Text <- String.Empty
)
form
type App() as app =
inherit Application()
do
app.Startup.Add(fun _ ->
app.RootVisual <- UI.createForm()
)
I recommend installing TortoiseHg and cloning the repository I setup for these examples. (I also have had good luck with the Visual Studio source control provider called VisualHG that uses TortoiseHG.)
The solution shows that it is possible to create an F# Silverlight application with a single F# project without involving C#. You just have to hit F5 and you can debug the app in your favorite browser. I was able to use both Chrome and IE on my Windows 7 64-bit computer to debug. The only annoying bug is that F5 is opening up a slightly wrong URL:
file:///C:/Users/ctaggart/blog/Examples100/Example001Silverlight/Bin/TestPage.html
when it should be:
file:///C:/Users/ctaggart/blog/Examples100/Example001Silverlight/Bin/Debug/TestPage.html
Please let me know if you figure out how to fix this. For now, just manually change the URL in your browser. I usually just close the new tab and refresh the other one to enter debug on the correct URL.