At present I am working on a project that involves animating a custom built 2D shape in WPF. The shape is to look like a box and at the present I seem to have a few glitches.
Here is what my code looks like at the moment
namespace Wpftrial4
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
SolidColorBrush fillcolor = new SolidColorBrush();
SolidColorBrush bordercolor = new SolidColorBrush();
public MainWindow()
{
InitializeComponent();
fillcolor.Color = Colors.WhiteSmoke;
bordercolor.Color = Colors.Blue;
}
private void button1_Click(object sender, RoutedEventArgs e)
{
//Manually creating the required 2D Box shape
Path path_rectangle = new Path();
path_rectangle.Fill = fillcolor;
path_rectangle.Stroke = bordercolor;
path_rectangle.StrokeThickness = 5;
RectangleGeometry rg = new RectangleGeometry();
double width_rec = 100;
double height_rec = 50;
double left_rec = 130;
double top_rec = 100;
rg.Rect = new Rect(left_rec, top_rec, width_rec, height_rec);
path_rectangle.Data = rg;
canvas1.Children.Add(path_rectangle);
Path path2_top = new Path();
path2_top.Stroke = new SolidColorBrush(Colors.Brown);
path2_top.StrokeThickness = 6;
RectangleGeometry rg2 = new RectangleGeometry();
double width2 = 100;
double height2 = 2;
double left2 = 130;
double top2 = 90;
rg2.Rect = new Rect(left2, top2, width2, height2);
path2_top.Data = rg2;
canvas1.Children.Add(path2_top);
Path path3_topcover = new Path();
path3_topcover.Stroke = new SolidColorBrush(Colors.White);
path3_topcover.StrokeThickness = 5;
RectangleGeometry rg3 = new RectangleGeometry();
double width3 = 100;
double height3 = 5;
double left3 = 130;
double top3 = 100;
rg3.Rect = new Rect(left3, top3, width3, height3);
path3_topcover.Data = rg3;
canvas1.Children.Add(path3_topcover);
//combining part_Group type
GeometryGroup myGeometryGroup = new GeometryGroup();
myGeometryGroup.Children.Add(rg);
myGeometryGroup.Children.Add(rg3);
Path myPath = new Path();
myPath.Stroke = Brushes.Blue;
myPath.Data = myGeometryGroup;
canvas1.Children.Add(myPath);
////test animate
//myCustomAnimatedBox MB2 = new myCustomAnimatedBox(200, 200, 300, 250) { Stroke = Brushes.Black, StrokeThickness = 2 };
//canvas1.Children.Add(MB2); //new myCustomAnimatedBox(200, 200, 300, 250,500,500){Stroke = Brushes.Black, StrokeThickness = 2});
//PointAnimation pa2 = new PointAnimation();
////DoubleAnimation da = new DoubleAnimation();
//pa2.To = new Point(100, 100);
////da.By = 50;
//pa2.Duration = TimeSpan.FromSeconds(10);
////MB2.BeginAnimation(myCustomAnimatedBox.TopProperty,pa2);//(//MB2.BeginAnimation(myCustomAnimatedBox.CenterProperty, pa2);
}
//class- style custom2D shape creation
private void button2_Click(object sender, RoutedEventArgs e)
{
myCustomAnimatedBox MB = new myCustomAnimatedBox(200, 200, 350, 250) { Stroke = Brushes.Black, StrokeThickness = 2 };
canvas1.Children.Add(MB); //new myCustomAnimatedBox(200, 200, 300, 250,500,500){Stroke = Brushes.Black, StrokeThickness = 2});
//PointAnimation pa = new PointAnimation();
////DoubleAnimation da = new DoubleAnimation();
//pa.To = new Point(100, 100);
////da.By = 50;
//pa.Duration = TimeSpan.FromSeconds(10);
//MB.BeginAnimation(myCustomAnimatedBox.CenterProperty, pa);
}
}
//Class that defines the custom 2D shape
public class myCustomAnimatedBox : Shape
{
private double x1, width;
private double y1, height;
private GeometryGroup myBox = new GeometryGroup();
public myCustomAnimatedBox(double XX1, double YY1, double widTH, double heiGHT)
{
makeBox(XX1, YY1, widTH, heiGHT);
}
//public static readonly DependencyProperty CenterProperty = DependencyProperty.Register("Center", typeof(Point), typeof(myCustomAnimatedBox),
// new PropertyMetadata( null,PropertyChanged));// FrameworkPropertyMetadata( FrameworkPropertyMetadataOptions.AffectsMeasure));
////new Point(cent_X, cent_Y)
//public Point Center
//{
// get { return (Point)GetValue(CenterProperty); }
// set
// {
// SetValue(CenterProperty, value);
// myBox.Children.Clear();
// makeBox(myBox, value.X, value.Y, width, height);
// }
//}
//public Point Center
//{
// get { return (Point)GetValue(CenterProperty); }
// set
// {
// SetValue(CenterProperty, value);
// myBox.Children.Clear();
// makeBox(myBox, value.X, value.Y, width, height);
// }
//}
//public Point Top
//{
// get { return new Point(X1, Y1); }
// set
// {
// //X1 = value.X;
// //Y1 = value.Y;
// Top = value;
// }
//}
//public static readonly DependencyProperty TopProperty = DependencyProperty.Register("Top", typeof(Point), typeof(myCustomAnimatedBox), new FrameworkPropertyMetadata( FrameworkPropertyMetadataOptions.AffectsMeasure));
//new PropertyMetadata( null,PropertyChanged));
public double X1
{
get { return x1; }
set
{
x1 = value;
}
}
public double Y1
{
get { return y1; }
set
{
y1 = value;
}
}
//Trial at creating a dependency property
//private static void TopPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
//{
// myCustomAnimatedBox myB = (myCustomAnimatedBox)d;
// myB.InvalidateVisual();
//}
protected override Geometry DefiningGeometry
{
get { return myBox; }
}
//Function that draws the object
private void makeBox(double XX1, double YY1, double widTH, double heiGHT)
{
width = widTH;
height = heiGHT;
this.X1 = XX1;
this.Y1 = YY1;
RectangleGeometry rectangle_part = new RectangleGeometry();
rectangle_part.Rect = new Rect(X1,Y1,width,height);
RectangleGeometry rg_cover = new RectangleGeometry();
RectangleGeometry rg_top = new RectangleGeometry();
rg_top.Rect = new Rect(X1, Y1 - 10, width, 2);
rg_cover.Rect = new Rect(X1, Y1, width, 5);
myBox.Children.Add(rectangle_part);
myBox.Children.Add(rg_top);
myBox.Children.Add(rg_cover);
}
}
}
Since the shape would be undergoing animation like: box opening and closing, I need the custom shape to have a movable part. GeometryGroup according to most authors seem to offer the most advantages when animation plus other databinding is required however. IN the code I have tested creating the shape manually. This could be seen in code attached to Button1. However when I try to do the class implementation, i am not able to get the kind of effect I want like altering individual constituent characteristics. I am less than 1 month into WPF and would like help in the following areas.
- Is GeometryGroup ideal for what I want to achieve?
- will following this course lead to the achievement of my goal. ie will I be able to animate a part of a custom 2D shape built in WPF ie box--open; box---Close.
- Can someone tell me what I need to do to be able to alter individual properties of the constituent shapes ie rectangles in my custom shape.
Thanks for your help.