Building an Application with Third-Party Controls - Silverlight

Though Silverlight 1.1 Alpha Refresh does not yet include pre-built controls, a number of third-party control libraries have been created.

BuildinganApplicationwithThird-PartyControls

Though
Silverlight 1.1 Alpha Refresh does not yet include pre-built controls, a number
of third-party control libraries have been created. One such third-party
library is Netika’s GOA WinForms library for Silverlight. This library is an
implementation of .NET’s Sys-tem.Windows.Form libraryforbothSilverlightandFlash.Thisallows
us tocreateSilver-light
applications by using .NET desktop applications as templates. The free version
of GOA WinForms includes 40+ controls, including buttons, text boxes, calendars
and more. Netika’s website at www.netikatech.com includes demos and
documentation for all the controls. To
download the library, go to www.netikatech.com/downloads
and select the standard Silverlight
version of GOA WinForms. After installation, open Visual Studio 2008 and create
a new project. Select VisualBasic, then GOA WinFormsVB Application in My Templates.Namethisproject InterestRateCalculator, as wewillbecreatinga Silverlightapplication that calculates interest. For a GOA WinForms
project, the Visual Basic code-behind file is located in MyForm.vb. In this file, you will find an InitializeComponent function (lines 27–42) that creates a Button. Select BuildInterestRateCalculator from the Build menu,then openTestPage.htmlinyourbrowser toseeasamplebutton.

Open up the InterestRateCalculatorForWindows project from the examples directory. We are going to be creating a Silverlight
application from this desktop application (Fig. 19.24). First, build and run
the project to see how the application looks on the desktop. Next, replace the InitializeComponent function in the InterestRateCalcu-lator project’s MyForm.vb withthe InitializeComponent inthe
InterestRateCalcula-torForWindows project’s
InterestRateCalculatorForWindows.Designer.vb.Thenreplace
the Friend
WithEvents line (line 26) in the InterestRateCalculator project’s MyForm.vb withthe Friend WithEvents lines(lines139–147)
inthe InterestRateCal-culatorForWindows project’s InterestRateCalculatorForWindows.Designer.vb file.Finally, copy the btnCalculate_Click function from the InterestRateCalculatorFor-Windows project’s InterestRateCalculatorForWindows.vb intothe MyForm classinthe InterestRateCalculator project’s MyForm.vb.

Try
to build the InterestRateCalculator project. You will see several errors. This is because
not every property of the Windows Form controls has been implemented in GOA
WinForms. Looking at Fig. 19.25, you will see that we commented out lines 47,
60, 82,

100, 118 and 128–129. These
lines all accessed properties not supported in GOA Win-Forms. We kept these
lines as comments to show you the relatively easy process of con-verting a
Visual Basic desktop application to a Silverlight 1.1 application when using
GOA WinForms controls.

1' Fig. 19.25: MyForm.vb

2' Using third-party controls in
Silverlight 1.1 Alpha Refresh.

3Public Class MyForm

4Inherits System.Windows.Forms.Form

5

6Public Sub New()

7MyBase.New()

8InitializeComponent()

9End Sub ' New

10

11Protected Overloads Overrides Sub Dispose(
_

12ByVal disposing As Boolean)

13If disposing Then

14If Not (components Is Nothing) Then

15components.Dispose()

16End If

End If

18MyBase.Dispose(disposing)

19End Sub ' Dispose

20

21Private components As System.ComponentModel.IContainer

22

23Private Sub InitializeComponent()

24Me.btnCalculate = New System.Windows.Forms.Button

25Me.txtDisplay = New System.Windows.Forms.TextBox

26Me.lblBalance = New System.Windows.Forms.Label

27Me.updYear = New System.Windows.Forms.NumericUpDown

28Me.lblYears = New System.Windows.Forms.Label

29Me.txtInterest = New System.Windows.Forms.TextBox

30Me.lblInterest = New System.Windows.Forms.Label

31Me.txtPrincipal = New System.Windows.Forms.TextBox

32Me.lblPrincipal = New System.Windows.Forms.Label

33CType(Me.updYear,
_

34System.ComponentModel.ISupportInitialize).BeginInit()

35Me.SuspendLayout()

36

37' btnCalculate

38Me.btnCalculate.Location = New System.Drawing.Point(197,14)

39Me.btnCalculate.Name ="btnCalculate"

40Me.btnCalculate.Size = New System.Drawing.Size(75,23)

41Me.btnCalculate.TabIndex =17

42Me.btnCalculate.Text ="Calculate"

43

44' txtDisplay

45' the following line was commented out
because it accessed

46' a property that is not supported in
GOA WinForms

47' Me.txtDisplay.BackColor =
System.Drawing.SystemColors.Control

48Me.txtDisplay.Location = New System.Drawing.Point(18,170)

49Me.txtDisplay.Multiline = True

50Me.txtDisplay.Name ="txtDisplay"

51Me.txtDisplay.ReadOnly = True

52Me.txtDisplay.ScrollBars =
System.Windows.Forms.ScrollBars.Vertical

53Me.txtDisplay.Size = New System.Drawing.Size(254,104)

54Me.txtDisplay.TabIndex =16

55Me.txtDisplay.Font = New Font("Courier
New",10)

56

57' lblBalance

58' the following line was commented out
because it accessed

59' a property that is not supported in
GOA WinForms

60' Me.lblBalance.AutoSize = True

61Me.lblBalance.Location = New System.Drawing.Point(17,143)

62Me.lblBalance.Name ="lblBalance"

63Me.lblBalance.Size = New System.Drawing.Size(122,13)

64Me.lblBalance.TabIndex =15

65Me.lblBalance.Text ="Yearly account
balance:"

66

67' updYear

68Me.updYear.Location = New System.Drawing.Point(85,95)

69Me.updYear.Maximum = New Decimal(New Integer()
{10,0,0,0})

Me.updYear.Minimum
= New Decimal(New
Integer() {1,0,0,0})

71Me.updYear.Name ="updYear"

72Me.updYear.ReadOnly = True

73Me.updYear.Size = New System.Drawing.Size(100,20)

74Me.updYear.TabIndex =14

75Me.updYear.TextAlign = _

76System.Windows.Forms.HorizontalAlignment.Right

77Me.updYear.Value = New Decimal(New Integer()
{1,0,0,0})

78

79' lblYears

80' the following line was commented out
because it accessed

81' a property that is not supported in
GOA WinForms

82' Me.lblYears.AutoSize = True

83Me.lblYears.Location = New System.Drawing.Point(17,102)

84Me.lblYears.Name ="lblYears"

85Me.lblYears.Size = New System.Drawing.Size(37,13)

86Me.lblYears.TabIndex =13

87Me.lblYears.Text ="Years:"

88

89' txtInterest

90Me.txtInterest.Location = New System.Drawing.Point(85,58)

91Me.txtInterest.Name ="txtInterest"

92Me.txtInterest.Size = New System.Drawing.Size(100,20)

93Me.txtInterest.TabIndex =12

94Me.txtInterest.TextAlign = _

95System.Windows.Forms.HorizontalAlignment.Right

96

97' lblInterest

98' the following line was commented out
because it accessed

99' a property that is not supported in
GOA WinForms

100' Me.lblInterest.AutoSize = True

101Me.lblInterest.Location = New System.Drawing.Point(17,61)

102Me.lblInterest.Name ="lblInterest"

103Me.lblInterest.Size = New System.Drawing.Size(71,13)

104Me.lblInterest.TabIndex =11

105Me.lblInterest.Text ="Interest
Rate:"

106

107' txtPrincipal

108Me.txtPrincipal.Location =
New System.Drawing.Point(85,17)

109Me.txtPrincipal.Name ="txtPrincipal"

110Me.txtPrincipal.Size = New System.Drawing.Size(100,20)

111Me.txtPrincipal.TabIndex =10

112Me.txtPrincipal.TextAlign = _

113System.Windows.Forms.HorizontalAlignment.Right

114

115' lblPrincipal

116' the following line was commented out
because it accessed

117' a property that is not supported in
GOA WinForms

118' Me.lblPrincipal.AutoSize = True

119Me.lblPrincipal.Location =
New System.Drawing.Point(17,20)

120Me.lblPrincipal.Name ="lblPrincipal"

121Me.lblPrincipal.Size = New System.Drawing.Size(50,13)

122Me.lblPrincipal.TabIndex =9

Me.lblPrincipal.Text
="Principal:"

125' FrmInterestCalculator

126' the following two lines were
commented out because they

127' accessed properties that are not
supported in GOA WinForms

128' Me.AutoScaleDimensions = New
System.Drawing.SizeF(6.0!, 13.0!)

129' Me.AutoScaleMode =
System.Windows.Forms.AutoScaleMode.Font

130Me.ClientSize = New
System.Drawing.Size(289,288)

131Me.Controls.Add(Me.btnCalculate)

132Me.Controls.Add(Me.txtDisplay)

133Me.Controls.Add(Me.lblBalance)

134Me.Controls.Add(Me.updYear)

135Me.Controls.Add(Me.lblYears)

136Me.Controls.Add(Me.txtInterest)

137Me.Controls.Add(Me.lblInterest)

138Me.Controls.Add(Me.txtPrincipal)

139Me.Controls.Add(Me.lblPrincipal)

140Me.Name ="FrmInterestCalculator"

141Me.Text ="Interest Calculator"

142CType(Me.updYear, _

143System.ComponentModel.ISupportInitialize).EndInit()

144Me.ResumeLayout(False)

145Me.PerformLayout()

146End Sub '
InitializeComponent

147

148Friend WithEvents btnCalculate As System.Windows.Forms.Button

149Friend WithEvents txtDisplay As System.Windows.Forms.TextBox

150Friend WithEvents lblBalance As System.Windows.Forms.Label

151Friend WithEvents updYear As System.Windows.Forms.NumericUpDown

152Friend WithEvents lblYears As System.Windows.Forms.Label

153Friend WithEvents txtInterest As System.Windows.Forms.TextBox

154Friend WithEvents lblInterest As System.Windows.Forms.Label

155Friend WithEvents txtPrincipal As System.Windows.Forms.TextBox

156Friend WithEvents lblPrincipal As System.Windows.Forms.Label

157

158Public Shared Sub
Main()

159Application.Run(New
MyForm)

160End Sub ' Main

161

162Private Sub btnCalculate_Click(ByVal sender As System.Object,
_

163ByVal e As
System.EventArgs) Handles btnCalculate.Click

164

165Dim principal As Decimal

166Dim rate
As Double

167Dim year
As Integer

168Dim amount
As Decimal

169

170principal = Convert.ToDecimal(Me.txtPrincipal.Text)

171rate = Convert.ToDouble(Me.txtInterest.Text)

172year = Convert.ToInt32(Me.updYear.Value)

173

174txtDisplay.Text = String.Format("{0,-6}{1}" & vbCrLf, "Year", _

175"Amount on Deposit")

176

177For yearCounter As Integer =1 To year

178amount = principal * Convert.ToDecimal( _

179Math.Pow(1 + rate
/ 100, yearCounter))

180txtDisplay.Text &= String.Format("{0,-6:D}{1:C}" & vbCrLf, _

181yearCounter, amount)

182Next

183End Sub '
btnCalculate_Click

184End Class ' MyForm

Fig. 19.25 | Usingthird-partycontrolsinSilverlight1.1Alpha
Refresh.

Build the InterestRateCalculator project, then open up TestPage.html
in a web browser. You will see an "AG_E_UNKNOWN_ERROR" error message because the application is not running
from a web server. You can safely ignore this error message for now. Test the
application, and compare it with the desktop version (Fig. 19.24). Some of the
con-trols function slightly differently, as GOA WinForms is not an exact
replica of the stan-dard Windows Forms controls.

The
InitializeComponent function (lines 23–146) was generated in the Interest-RateCalculatorForWindows
project usingVisualStudio’sdesign
mode.
TextBoxesare
used to input the principal and
interest-rate amounts, and a NumericUpDown
control is used to input the number of years for which we want to calculate
interest.

The btnCalculate_Click function (lines 162–183) handles btnCalculate’s Click event
(line 163). Lines 165 and 168 declare two Decimal
variables, principal and amount.
Line 166 declares rate as type Double,
and line 167 declares year as type Integer.
Lines 170–171 take the Text from the txtPrincipal
and txtInterest text boxes, convert them to
the correct type, then store the value in the corresponding variable. Line 172
takes the Value
fromthe updYear NumericUpDown, convertsit toan
integer, andstores thevalueto year.Lines174–175set
the
txtDisplay’s Text to display "Year" and "Amount on Deposit" column headersfollowedbya
carriagereturn.Theseare
formattedusingthe String.Format
method.

Lines 177–182 count
from 1 to year in increments of 1. Lines 178–179
perform a calculation based on the following formula:

a = p(1 + r)n

where a is the amount, p is the principal, r
is the rate and n is the year. Lines 180–181 set txtDisplay’s Text to display two columns
containing the current yearCounter and amount values.