Displaying Graphs with an Object Oriented Approach using Silverlight SDK and Visual Studio 2008 - Displaying the Silverlight graph for all products (multiple rows)
(Page 5 of 5 )
As I would like to implement a simple object oriented approach to displaying multiple rows, I added a new class named “ProductUIFactory” to the “SilverlightTest2” project. This is the main class which generated all blocks of Silverlight objects dynamically for each row of Products. It is defined as follows:
Public Class ProductUIFactory
Inherits NorthwindService.Product
Dim _CanvasTop As Double = 0
Dim _TotalSaleValue As Double = 0
Public Sub New(ByVal obj As NorthwindService.Product)
Me.ProductID = obj.ProductID
Me.ProductName = obj.ProductName
Me.SaleTillToDate = obj.SaleTillToDate
Me.UnitPrice = obj.UnitPrice
Me.UnitsInStock = obj.UnitsInStock
Me.UnitsOnOrder = obj.UnitsOnOrder
End Sub
Public Property CurrentCanvasTop() As Double
Get
Return _CanvasTop
End Get
Set(ByVal value As Double)
_CanvasTop = value
End Set
End Property
Public Property TotalSaleValue() As Double
Get
Return _TotalSaleValue
End Get
Set(ByVal value As Double)
_TotalSaleValue = value
End Set
End Property
Public ReadOnly Property ProductSalePercentage() As Double
Get
Return Math.Round((Me.SaleTillToDate * 100) / (TotalSaleValue), 2)
End Get
End Property
#Region "Silverlight UI Blocks"
Public ReadOnly Property UIProductName() As TextBlock
Get
'adding textblock related to Product Name
Dim tbProductName As New TextBlock
With tbProductName
.Text = Me.ProductName
.Width = 172
.Height = 16
.FontSize = 12
'.TextWrapping = TextWrapping.Wra
.SetValue(Canvas.LeftProperty, 8)
.SetValue(Canvas.TopProperty, CurrentCanvasTop)
End With
Return tbProductName
End Get
End Property
Public ReadOnly Property UISaleValue() As TextBlock
Get
'adding textblock related to Sale value
Dim tbSaleValue As New TextBlock
With tbSaleValue
.Text = Me.SaleTillToDate
.Width = 140
.Height = 16
.FontSize = 12
.TextWrapping = TextWrapping.Wrap
.SetValue(Canvas.LeftProperty, 195)
.SetValue(Canvas.TopProperty, CurrentCanvasTop)
End With
Return tbSaleValue
End Get
End Property
Public ReadOnly Property UIGraphOutline() As Rectangle
Get
'adding rectangle related to graph outline
Dim rGraphOutline As New Rectangle
With rGraphOutline
.Width = 222
.Height = 16
.Fill = New SolidColorBrush(Colors.White)
.Stroke = New SolidColorBrush(Colors.Black)
.SetValue(Canvas.LeftProperty, 351)
.SetValue(Canvas.TopProperty, CurrentCanvasTop)
End With
Return rGraphOutline
End Get
End Property
Public ReadOnly Property UIGraphFill() As Rectangle
Get
Dim rGraphFill As New Rectangle
With rGraphFill
.Width = (222 * Me.ProductSalePercentage) / 100
.Height = 16
.Fill = New SolidColorBrush(Colors.Brown)
.Stroke = New SolidColorBrush(Colors.Black)
.SetValue(Canvas.LeftProperty, 351)
.SetValue(Canvas.TopProperty, CurrentCanvasTop)
End With
Return rGraphFill
End Get
End Property
Public ReadOnly Property UIPercentage() As TextBlock
Get
'adding textblock related to Percentage
Dim tbPercentage As New TextBlock
With tbPercentage
.Text = Me.ProductSalePercentage & "%"
.Width = 64
.Height = 16
.FontSize = 12
.TextWrapping = TextWrapping.Wrap
.SetValue(Canvas.LeftProperty, 577)
.SetValue(Canvas.TopProperty, CurrentCanvasTop)
End With
Return tbPercentage
End Get
End Property
#End Region
End Class
The code behind utilizing the above class is developed as follows:
Imports System.Collections.Generic
Partial Public Class Page
Inherits Canvas
Public Sub Page_Loaded(ByVal o As Object, ByVal e As EventArgs)
' Required to initialize variables
InitializeComponent()
Dim svcNorthwind As New NorthwindService.ProductService
Dim objProducts As NorthwindService.Product() = svcNorthwind.GetProductList
Dim TotalSaleValue As Double = svcNorthwind.GetTotalSaleValue
Dim i As Integer = 0
For Each objProduct As NorthwindService.Product In objProducts
Dim objFactory As New ProductUIFactory(objProduct)
With objFactory
.CurrentCanvasTop = (20 * i)
.TotalSaleValue = TotalSaleValue
Me.Children.Add(.UIProductName)
Me.Children.Add(.UISaleValue)
Me.Children.Add(.UIGraphOutline)
Me.Children.Add(.UIGraphFill)
Me.Children.Add(.UIPercentage)
End With
i += 1
Next
End Sub
End Class
You can observe that for each product, we are generating a new row of Silverlight objects using the “ProductUIFactory” class developed in the previous section.
The following is the output you can expect for the above:

I hope you enjoyed the article and any suggestions, bugs, errors, enhancements etc. are highly appreciated at http://jagchat.spaces.live.com
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |