Step 1 : Open Visual Studio.
- Select new -> project
- Select your preferred language
- Select a WPF application
- Name the project
- Now name of project is "WpfApplicationDemo"
Step 2 : Open the Toolbox of WPF application.
- Drag & Drop a rectangle control onto the design view.
- Drag & Drop three slider controls onto the design view.
Step 3 : Now, the final source code of the XAML page is given below.
Code
<Window x:Class="WpfApplicationDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="500" Width="525">
<Canvas Name="LayoutRoot" Background="LightGray" Height="390">
<Rectangle Name="rectangle1" Width="200" Height="200"
Canvas.Left="20" Canvas.Top="40" Fill="Gold"
Stroke="Black" StrokeThickness="2">
</Rectangle>
<Slider Name="RedSlider" Width="20" Height="300"
Background="Red" Maximum="255" Minimum="0"
Canvas.Left="300" Canvas.Top="40" Orientation="Vertical"
ValueChanged="RedSlider_ValueChanged"/>
<Slider Name="GreenSlider" Width="20" Height="300"
Background="Green" Maximum="255" Minimum="0"
Canvas.Left="350" Canvas.Top="40" Orientation="Vertical"
ValueChanged="GreenSlider_ValueChanged"/>
<Slider Name="BlueSlider" Width="20" Height="300"
Background="Blue" Maximum="255" Minimum="0"
Canvas.Left="400" Canvas.Top="40" Orientation="Vertical"
ValueChanged="BlueSlider_ValueChanged"/>
</Canvas>
</Window>
Step 4 : Now, the source code of MainWindows.xaml.cs file.
Code
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Windows.Controls.Primitives;
namespace WpfApplicationDemo
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void GreenSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
UpdateCircleWithColors();
}
private void BlueSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
UpdateCircleWithColors();
}
private void RedSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
UpdateCircleWithColors();
}
private void UpdateCircleWithColors()
{
Color clr = Color.FromArgb(255, Convert.ToByte(RedSlider.Value),
Convert.ToByte(GreenSlider.Value), Convert.ToByte(BlueSlider.Value));
rectangle1.Fill = new SolidColorBrush(clr);
}
}
}
Output
Resources