Silverlight 3 Element Binding: Home Loan Application V 0.1

Posted by on Comments (0)

Silverlight 2 offered nice possibilities around data binding.

But one useful feature was missing: the binding of a UI element property to a property of another UI element.

Fortunately, this is now possible with Silverlight 3.

The simplest example to build is the binding of the Text property of a TextBlock to the Value of a Slider:

In this sample, the user may vary the amount he wants to loan using a Slider. This amount is displayed in the TextBlock above the slider.

Here is the corresponding XAML:

 

<TextBlock Margin="0" TextWrapping="Wrap" Text="{Binding Value, ElementName=Amount, Mode=OneWay}" Foreground="White" FontFamily="Franklin Gothic Heavy" FontSize="32" HorizontalAlignment="Center" VerticalAlignment="Center"/>

 

<Slider ValueChanged="Amount_ValueChanged" Minimum="5000" Maximum="500000" x:Name="Amount" Cursor="Hand" SmallChange="5000" LargeChange="10000" Margin="0" Value="200000"/>

 

To see this application in action: http://www.renaldnollet.com/samples/HomeLoanSL3V0_1/

See you later!

Posted in: Silverlight 3.0   Tags:

Silverlight 3 Tools for Visual Studio : where is my preview ?

Posted by on Comments (1)

If you try the new Silverlight 3 tools for Visual Studio 2008, you should be frustrated (or happy?) while not finding anymore your Silverlight preview.

This one is just… hidden! J

 

 

If you go to the bottom of the XAML page, you can drap up the XAML page and you'll discover the designer.

 

 

Accordingly to this message on the Tim Heuer's blog, it should be more than just hidden:

Where did my design view go?!  You may notice right away that the VS tools no longer have the preview mode for your XAML in Silverlight projects.  This is by design.  We heard some pretty vocal feedback that the preview was usually turned off for most development because it was not turning out to be helpful as the applications got more complex.  The team decided put the resource investment into creating a great editable design surface in VS2010 instead and not delay the release of Silverlight 3.

 

See you later!

First look at Blend 3.0 RC : a simple example of the HyperlinkAction behavior

Posted by on Comments (2)

Blend 3.0 RC is there and it's pretty exciting to play with this new tool.

Things changed between the March preview and this RC version.

Let's play with a first very simple sample of what we can now do…

Blend 3.0 has a new useful asset library: http://blogs.msdn.com/unnir/archive/2009/05/22/the-blend-3-asset-library.aspx

In my sample, I'll just deal with an image and a textbox :

If I go into my assets library, I can find a behaviors category. That's the place where we'll be able to use all the behaviors available in the assemblies referenced for a project.

If I take the HyperlinkAction behavior and drop it on my picture in the designer, I can see the properties of my behavior.

The Trigger gives information about who can fire which event. The SourceName value [Parent] means here that the event is fired by the picture.

With the piker , you can choose any other element in your artboard.

The type of event is here a MouseLeftButtonDown but many other events may be chosen from the dropdown.

The common properties indicates here where to navigate and in which target window.

Here is the resulting XAML of my picture and HyperlinkAction :

 

 

With just 0 line of code and without Visual Studio, I can create links on any Silverlight element using this HyperlinkAction!

See you later!

 

Posted in: Blend 3.0   Tags:

Silverlight dynamic charts with Visifire components

Posted by on Comments (2)

Some weeks ago, I saw that Visifire (http://www.visifire.com/) was working on chart open source components for Silverlight 2 (currently in beta 1).

Here is a snapshot of a small Silverlight 2 beta 1 application I wrote with this components :

You can change the values in the textboxes and refresh the charts when clicking on the button.

You can test it there : http://www.renaldnollet.com/blogsamples/silverlightcharts1/testpage.html

This sample is easily done. Here is my XAML file :

<UserControl x:Class="SilverLightTests.SilverlightControl5"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="615" Height="483" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
<Grid x:Name="LayoutRoot" Background="White">
<Button x:Name="MyButton" Height="32" HorizontalAlignment="Stretch" Margin="260,5,223,0" VerticalAlignment="Top" Content="Refresh charts"/>
<TextBox x:Name="tb1" HorizontalAlignment="Left" Margin="5,5,0,0" Width="110" Text="1" VerticalAlignment="Top" Height="26"/>
<TextBox x:Name="tb2" HorizontalAlignment="Left" Margin="119,5,0,0" Text="2" VerticalAlignment="Top" Height="26" Width="110"/>
<TextBox x:Name="tb3" HorizontalAlignment="Left" Margin="5,35,0,0" Text="3" VerticalAlignment="Top" Height="26" Width="110"/>
<TextBox x:Name="tb4" HorizontalAlignment="Left" Margin="119,35,0,0" Width="110" Text="4" VerticalAlignment="Top" Height="26"/>
<TextBox x:Name="tb5" Height="26" HorizontalAlignment="Left" Margin="5,65,0,0" VerticalAlignment="Top" Width="110" Text="5"/>
<TextBox x:Name="tb6" HorizontalAlignment="Left" Margin="119,65,0,0" Text="6" Height="26" VerticalAlignment="Top" Width="110"/>
<TextBox x:Name="tb7" HorizontalAlignment="Left" Margin="5,95,0,0" Text="7" Height="26" VerticalAlignment="Top" Width="110"/>
<TextBox x:Name="tb8" HorizontalAlignment="Left" Margin="119,95,0,0" Text="8" Height="26" VerticalAlignment="Top" Width="110"/>
<Canvas HorizontalAlignment="Left" Margin="5,135,0,48" VerticalAlignment="Stretch" x:Name="MyCanvas" Width="300" Height="300" d:LayoutOverrides="Width"/>
<Canvas HorizontalAlignment="Right" Margin="0,135,6,48" VerticalAlignment="Stretch" x:Name="MyCanvas2" Height="300" Width="300" d:LayoutOverrides="Width"/>
Grid>
UserControl>

And here is my code-behind :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverLightTests
{
public partial class SilverlightControl5 : UserControl
{
public SilverlightControl5()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(Page_Loaded);
this.MyButton.Click += new RoutedEventHandler(MyButton_Click);
}
void MyButton_Click(object sender, RoutedEventArgs e)
{
CreateChart();
}
void Page_Loaded(object sender, RoutedEventArgs e)
{
CreateChart();
}
public void CreateChart()
{
Visifire.Charts.Chart visiChart = new Visifire.Charts.Chart();
Visifire.Charts.DataSeries dataSeries = new Visifire.Charts.DataSeries();
Visifire.Charts.DataPoint dataPoint;
visiChart.AnimationType = "Type4";
Visifire.Charts.Title title = new Visifire.Charts.Title();
title.Text = "";
visiChart.Children.Add(title);
visiChart.Width = 300;
visiChart.Height = 300;
Random rand = new Random(DateTime.Now.Millisecond);
for (int i = 1; i < 9; i++)
{
dataPoint = new Visifire.Charts.DataPoint();
TextBox tb = (TextBox)this.LayoutRoot.Children[i];
dataPoint.YValue = System.Convert.ToDouble(tb.Text);
dataPoint.LegendText = tb.Name;
dataSeries.Children.Add(dataPoint);
}
dataSeries.RenderAs = "Pie";
visiChart.Children.Add(dataSeries);
MyCanvas.Children.Clear();
MyCanvas.Children.Add(visiChart);
Visifire.Charts.Chart visiChart2 = new Visifire.Charts.Chart();
visiChart2.AnimationType = "Type4";
visiChart2.Width = 300;
visiChart2.Height = 300;
dataSeries = new Visifire.Charts.DataSeries();
for (int i = 1; i <9; i++)
{
dataPoint = new Visifire.Charts.DataPoint();
TextBox tb = (TextBox)this.LayoutRoot.Children[i];
dataPoint.YValue = System.Convert.ToDouble(tb.Text);
dataSeries.Children.Add(dataPoint);
}
dataSeries.RenderAs = "Column";
visiChart2.Children.Add(dataSeries);
MyCanvas2.Children.Clear();
MyCanvas2.Children.Add(visiChart2);
}
}
}
Posted in: Silverlight 2.0   Tags:

Visual Studio 2005 and the Load method of UserControl

Posted by on Comments (0)

Maybe you already met this kind of problems with UserControl and Visual Studio 2005 : you design a main winform without any problems, you design a user control without any problem. But then when you add the user control to the main form, the designer will encouter an error on the main form. You nevertheless may run the application without any problem.

The reason for this is that the designer is calling the load method of user controls when you open the form that is hosting those user controls.

 

A simple test :

Here is the designer part of my user control (an empty one with just one label, this is enough to demonstrate our problem):


Here is the code behind :



The important thing there is the Load method.

 

Then, if I want to add the user control to a main empty form, here is what you will see :

Most of the time, this is not annoying, but sometimes, this may lead to the impossibility to woon the main form with the designer (because you are in design time and not run time, information may not be available):

 


You can then work with the DesignTime property of the user control :

 

Posted in: .NET 2.0 | Visual Studio 2005   Tags: