I’m using Visual Studio 2008 SP1 with Silverlight 2 Beta 2 SDK.
1. New Project, select C#/Silverlight/SilverilghtApplication, if there is any dialog asking options, select OK for default. I named the project as ShootBalloonForBlog.
2. Add a new user control file Balloon.xaml , by right click silverlight project item, Add-> New Item …-> Silverlight user control.
3. Replace the Balloon.xaml user control with the following XAML:
(The balloon shape and XAML is referenced from code: http://community.irritatedvowel.com/blogs/pete_browns_blog/archive/2007/07/27/Silverlight-Balloons-Version-3.aspx)
<UserControl x:Class="ShootBalloonForBlog.Balloon"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="100" Height="120">
<Canvas x:Name="LayoutRoot" Background="Transparent">
<Canvas.RenderTransform>
<ScaleTransform x:Name="BalloonScaleTransform" ScaleX="1" ScaleY="1" />
</Canvas.RenderTransform>
<Path x:Name="Path" Width="101" Height="116.623" Canvas.Left="-0.5" Canvas.Top="-0.5" Stretch="Fill" Data="F1 M 50,0C 77.6142,0 100,22.3858 100,50C 100,71.6885 81.9116,86.6289 66.7874,99.7709C 62.5278,103.472 55.8424,108.306 49.9166,108.306C 44.2735,108.306 38.0278,103.639 33.7729,100.067C 17.8186,86.6724 0,71.9711 0,50C 0,22.3858 22.3858,0 50,0 Z M 51.2289,115.623L 43.8216,113.843L 49.0668,108.319L 51.2289,115.623 Z " StrokeLineJoin="Round">
<Path.Stroke>
<LinearGradientBrush StartPoint="0.276127,0.226989" EndPoint="0.930833,0.226989">
<LinearGradientBrush.RelativeTransform>
<TransformGroup>
<SkewTransform CenterX="0.276127" CenterY="0.226989" AngleX="-7.27327" AngleY="0"/>
<RotateTransform CenterX="0.276127" CenterY="0.226989" Angle="55.1587"/>
</TransformGroup>
</LinearGradientBrush.RelativeTransform>
<LinearGradientBrush.GradientStops>
<GradientStop Color="#FFFFFFFF" Offset="0.118644"/>
<GradientStop x:Name="StrokeColorStop" Color="#FFFF0000" Offset="1"/>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Path.Stroke>
<Path.Fill>
<RadialGradientBrush RadiusX="0.654706" RadiusY="0.694299" Center="0.276127,0.226989" GradientOrigin="0.276127,0.226989">
<RadialGradientBrush.GradientStops>
<GradientStop x:Name="FillColorStop" Color="#FFFF0000" Offset="1"/>
</RadialGradientBrush.GradientStops>
<RadialGradientBrush.RelativeTransform>
</RadialGradientBrush.RelativeTransform>
</RadialGradientBrush>
</Path.Fill>
</Path>
<TextBlock Name="Text" Canvas.Left="40" Canvas.Top="40" Text="??" FontSize="16" FontWeight="700"></TextBlock>
</Canvas>
</UserControl>
In Balloon.xaml.cs file: (The missing part from the 1st time blog 2 weeks ago.)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
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 ShootBalloonForBlog
{
public partial class Balloon : UserControl
private Color _color;
private double _scale;
public Balloon(double scale, Color color)
InitializeComponent();
_color = color;
_scale = scale;
Loaded += new RoutedEventHandler(Balloon_Loaded);
}
void Balloon_Loaded(object sender, RoutedEventArgs e)
// set stroke and fill colors
FillColorStop.Color = _color;
StrokeColorStop.Color = _color;
// scale to the size specified
BalloonScaleTransform.ScaleX = _scale;
BalloonScaleTransform.ScaleY = _scale;