User Id :    Password :      New Member   Forgot Password  
 
Gradient Effect in Silverlight
Description In this article I am going to show how we can show graident effect in silverlight. This is my XAML code in which I am going to show gradient effect.   No. of Views     1677
  Rating     0
Author Rahul Saxena   Posted On     31 Jul 2011
Tags .NET Frameworks,Silverlight,XAML    

Sample Code   Download Code

 

In this article I am going to show how we can show graident effect in silverlight. This is my XAML code in which I am going to show gradient effect.

 

<UserControl x:Class="GradientEffectInSilverlight.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="500" d:DesignWidth="400">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="100"></RowDefinition>
            <RowDefinition Height="110"></RowDefinition>
            <RowDefinition Height="20"></RowDefinition>
            <RowDefinition Height="130"></RowDefinition>
            <RowDefinition Height="20"></RowDefinition>
            <RowDefinition Height="100"></RowDefinition>
            <RowDefinition Height="200"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100"></ColumnDefinition>
            <ColumnDefinition Width="160"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid Grid.Row="1" Grid.Column="1" HorizontalAlignment="Center">
            <TextBlock Text="Rectangle Gradient" HorizontalAlignment="Center"></TextBlock>
        </Grid>
        <Grid Grid.Row="1" Grid.Column="2">
            <Rectangle Width="200" Height="100">
                <Rectangle.Fill>
                    <RadialGradientBrush>
                        <GradientStop Color="White" Offset="1" />
                        <GradientStop Color="LightSkyBlue" Offset="0.50" />
                    </RadialGradientBrush>
                </Rectangle.Fill>
            </Rectangle>
        </Grid>
        <Grid Grid.Row="3" Grid.Column="1">
            <TextBlock Text="Ellipse Gradient"></TextBlock>
        </Grid>
        <Grid Grid.Row="3" Grid.Column="2">
            <Ellipse Height="120" Width="160" StrokeThickness="2">
               <Ellipse.Fill>
                    <LinearGradientBrush StartPoint='0.1,0.06' EndPoint='0.5,0.6'>
                        <GradientStop Color='DarkOliveGreen' Offset='0'/>
                        <GradientStop Color='CadetBlue' Offset='1'/>
                    </LinearGradientBrush>
                </Ellipse.Fill>
            </Ellipse>
        </Grid>
        <Grid Grid.Row="5" Grid.Column="1">
            <TextBlock Text="Rectangle Gradient Again"></TextBlock>
        </Grid>
        <Grid Grid.Row="5" Grid.Column="2">
            <Rectangle Width="200" Height="100">
                <Rectangle.Fill>
                    <LinearGradientBrush >
                        <GradientStop Color="Bisque" Offset="0.0"/>
                        <GradientStop Color="Orange" Offset="0.143"/>
                        <GradientStop Color="Yellow" Offset="0.286"/>
                        <GradientStop Color="DarkTurquoise"  Offset="0.429"/>
                        <GradientStop Color="Blue"  Offset="0.572"/>
                        <GradientStop Color="DarkGray" Offset="0.715"/>
                        <GradientStop Color="Violet" Offset="1.0"/>
                    </LinearGradientBrush>
                </Rectangle.Fill>
            </Rectangle>
        </Grid>
    </Grid>
</UserControl>


 

When we run the application then gradient effect will be seen like below

 

 

 

About Author

About Author Rahul shows great interests in working with Microsoft technologies. He specializes in the implementation of DataBase & Graphics. His area of expertise includes: C#, ASP.NET,ADO.NET,Windows Forms & Web Services. He hails from background , Master's in Computer Application. With programming he loves photography, traveling and reading books. Rahul Saxena
No Photo
 
Country India
Company N/A
Home Page N/A

Rate this article

Rating options from poor, fair, good, very good to excelent.  
 

Comments

   
Write your comment here.
Comment
Verification Code