1 Previous Next 

WPF OneWay Binding Part 3


In this part we will bind to a class. We will start off by creating a grid to display the properties of the class. Finally we will show how to get the form to update itself when a value changes in the class.


Lets start off creating a class that shows some info about the computer. Here is the class.

Public Class ComputerInfo

    Public ReadOnly Property UserName() As String
        Get
            Return Environment.UserName
        End Get
    End Property
    Public ReadOnly Property ComputerName() As String
        Get
            Return Environment.MachineName
        End Get
    End Property
    Public ReadOnly Property UpTime() As Integer
        Get
            Return Environment.TickCount
        End Get
    End Property


End Class

Ok lets register the class with the form.

<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WPFOneWayBindToVariable"
    Title="WPFOneWayBindToVariable" Height="300" Width="300"
    >
  <Window.Resources>
    <local:ComputerInfo x:Key="ci"></local:ComputerInfo>
  </Window.Resources>

Now lets create a grid with 2 columns and 3 rows to show the class in.

   <Grid>
      <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition Height="30" />
        <RowDefinition Height="30" />
        <RowDefinition Height="30" />
      </Grid.RowDefinitions>

Lets put the data in the grid we just created.

      <Label Grid.Column="0" Grid.Row="0" Content="User Name" HorizontalAlignment="Right"/>
      <Label Grid.Column="0" Grid.Row="1" Content="Computer Name" HorizontalAlignment="Right"/>
      <Label Grid.Column="0" Grid.Row="2" Content="Up Time" HorizontalAlignment="Right"/>
      <Label Grid.Column="1"  Grid.Row="0" Content="{Binding Path=UserName}" DataContext="{Binding Source={StaticResource ci}}">
      </Label>
      <Label Grid.Column="1"  Grid.Row="1" Content="{Binding Path=ComputerName}" DataContext="{Binding Source={StaticResource ci}}">
      </Label>
      <Label Grid.Column="1"  Grid.Row="2" Content="{Binding Path=UpTime}" DataContext="{Binding Source={StaticResource ci}}">
      </Label>

To get the form to update itself automatically when a value changes in the class the class has to inherit from DependencyObject. The properties values that can change must be stored in a DependencyProperty. In this class I want the UpTime property to update itself every second with a timer.


Imports System.Windows.Threading

Public Class ComputerInfo
    Inherits DependencyObject

    Public Shared TickCountProperty As DependencyProperty = DependencyProperty.Register("UpTime", GetType(Integer), GetType(ComputerInfo))


    Public Sub New()
        Dim dt As New DispatcherTimer
        AddHandler dt.Tick, AddressOf TimerTick
        With dt
            .Interval = TimeSpan.FromSeconds(1)
            .Start()
        End With
    End Sub

    Public ReadOnly Property UserName() As String
        Get
            Return Environment.UserName
        End Get
    End Property
    Public ReadOnly Property ComputerName() As String
        Get
            Return Environment.MachineName
        End Get
    End Property
    Public ReadOnly Property UpTime() As Integer
        Get
            Return GetValue(TickCountProperty)
        End Get
    End Property

    Public Sub TimerTick(ByVal sender As Object, ByVal e As EventArgs)
        SetValue(TickCountProperty, Environment.TickCount)
    End Sub

End Class



Here is the windows complete XAML

<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WPFOneWayBindToVariable"
    Title="WPFOneWayBindToVariable" Height="300" Width="300"
    >
  <Window.Resources>
    <local:ComputerInfo x:Key="ci"></local:ComputerInfo>
  </Window.Resources>
    <Grid>
      <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition Height="30" />
        <RowDefinition Height="30" />
        <RowDefinition Height="30" />
      </Grid.RowDefinitions>
      <Label Grid.Column="0" Grid.Row="0" Content="User Name" HorizontalAlignment="Right"/>
      <Label Grid.Column="0" Grid.Row="1" Content="Computer Name" HorizontalAlignment="Right"/>
      <Label Grid.Column="0" Grid.Row="2" Content="Up Time" HorizontalAlignment="Right"/>
      <Label Grid.Column="1"  Grid.Row="0" Content="{Binding Path=UserName}" DataContext="{Binding Source={StaticResource ci}}">
      </Label>
      <Label Grid.Column="1"  Grid.Row="1" Content="{Binding Path=ComputerName}" DataContext="{Binding Source={StaticResource ci}}">
      </Label>
      <Label Grid.Column="1"  Grid.Row="2" Content="{Binding Path=UpTime}" DataContext="{Binding Source={StaticResource ci}}">
      </Label>
    </Grid>
</Window>



1 Previous Next