Build a workflow designer using Silverlight (15th) (scaling flowchart)

Source codeDownload: http://www.shareidea.net/opensource.htm

Online Demo: http://www.shareidea.net/workflow.htm

Video tutorial: http://www.shareidea.net/video/sharedesigner/sharedesigner.html

QQ: 85444465

Series of indexes in this article:

Using Silverlight to build a workflow designer (1)

Build a workflow designer using Silverlight (2)

Using Silverlight to build a workflow designer (3)

Build a workflow designer using Silverlight (4)

Build a workflow designer using Silverlight (5)

Build a workflow designer using Silverlight (6)

Using Silverlight to build a workflow designer (7)

Using Silverlight to build a workflow designer (8)

Using Silverlight to build a workflow designer (9)

Build a workflow designer using Silverlight (10)

Build a workflow designer using Silverlight (11)

Build a workflow designer using Silverlight (12)

Build a workflow designer using Silverlight (13)

Build a workflow designer using Silverlight (14th)

Build a workflow designer using Silverlight (15th) 

When the process is too complex and there are too many processes, the entire flowchart cannot be fully displayed on the screen. You need to drag the scroll bar to display it. This is inconvenient to understand the general situation of the entire process. I think of the scaling function of some graphic software. If you can add scaling to the process, then we can solve the problem that the flowchart is too complex and inconvenient to view.

10. added the flowchart scaling function.

The scaling of activities and rules should be considered for process scaling. For activities and rules, their scaling methods are slightly different.

For an activity, scaling affects two places. One is the activity location, that is, the top and left attributes relative to the container. The other is the size of the activity image.

For rules, scaling only affects the rule location. If a rule is associated with an activity, the position of the rule is not scaled, but the position is changed with the associated activity.

 

First, add a scaling method to the ielement interface, void zoom (double zoomdeep). The zoomdeep parameter in this method describes the scaling ratio. The following describes how to implement this method in activities and rules.

10.1 Active Scaling

As mentioned above, activity scaling affects two aspects: Activity Location and activity size. For the given scale Size(Zoomdeep), You only needZoomdeepSet and size the application in place. But it is very important that scaling refers to the scaling of the source image. Therefore, you need to record the original size of the activity and the original location (each location changes, for example, when an activity is dragged, record the location information ).

 

Use the following method to scale the activity

//Original Image Width

DoubleOrigpicturewidth = 0;

//Original height

DoubleOrigpictureheight = 0;

//Original Image Position

PointOrigposition;

//Location changed?

BoolPositionischange =True;

Public VoidZoom (DoubleZoomdeep)

{

If(Origpicturewidth = 0)

{

Origpicturewidth = sdpicture. picturewidth;

Origpictureheight = sdpicture. pictureheight;

}

If(Positionischange)

{

Origposition =This. Position;

Positionischange =False;

}

Sdpicture. pictureheight = origpictureheight * zoomdeep;

Sdpicture. picturewidth = origpicturewidth * zoomdeep;

This. Position =New Point(Origposition. x * zoomdeep, origposition. y * zoomdeep );

}

 

10.2 Rule Scaling

Unlike the scaling of an activity, the scaling of a rule only scales the position. Note that the scaling of the Rule points associated with the activity is not performed.Code:

PointOrigbeginpoint;

PointOrigendpoint;

PointOrigturnpoint1point;

PointOrigturnpoint2point;

BoolPositionischange =True;

Public VoidZoom (DoubleZoomdeep)

{

If(Positionischange)

{

Origbeginpoint = beginpointposition;

Origendpoint = endpointposition;

Origturnpoint1point = ruleturnpoint1.centerposition;

Origturnpoint2point = ruleturnpoint2.centerposition;

Positionischange =False;

}

If(Beginactivity =Null)

Beginpointposition =New Point(Origbeginpoint. x * zoomdeep, origbeginpoint. y * zoomdeep );

If(Endactivity =Null)

Endpointposition =New Point(Origendpoint. x * zoomdeep, origendpoint. y * zoomdeep );

If(Linetype =Rulelinetype. Polyline)

{

Ruleturnpoint1.centerposition =New Point(Origturnpoint1point. x * zoomdeep, origturnpoint1point. y * zoomdeep );

Onruleturn1pointmove (ruleturnpoint1.centerposition );

Ruleturnpoint2.centerposition =New Point(Origturnpoint2point. x * zoomdeep, origturnpoint2point. y * zoomdeep );

Onruleturn2pointmove (ruleturnpoint2.centerposition );

}

}

10.3 Use Slider Implement scroll bar drag Scaling

First, addSilder

slider name =" slizoom " largechange =" 1 " smallchange =" 1 " maximum =" 2 " Minimum =" 0.5 " width =" 70 " valuechanged =" slizoom_valuechanged "> slider >

Write the code in the event slizoom_valuechanged to scale the entire flowchart. The scaling will affect several aspects:

LScaling of all activities

LScaling of all rules

LContainer size change

 

The above three changes are reflected in the following code:

Private VoidSlizoom_valuechanged (ObjectSender,Routedpropertychangedeventargs<Double> E)

{

If(Slizoom! =Null)

{

DoubleZoomdeep = slizoom. value;

Btzoomvalue. Text = getzoomvalue (zoomdeep. tostring ());

IelementIEL =Null;

Foreach(UielementUICInCnsdesignercontainer. Children)

{

IEL = UICAs Ielement;

If(IEL! =Null)

{IEL. Zoom (zoomdeep );

}

}

If(Zoomdeep> = 1)

{

Sliwidth. value = sliwidth. Minimum * zoomdeep;

Sliheight. value = sliheight. Minimum * zoomdeep; 

}

Else

{

Sliwidth. value = sliwidth. Minimum;

Sliheight. value = sliheight. Minimum;

}

}

}

 

problem: if a rule is not associated with an activity, or for a rule of the line type, the scaling is different from the scaling ratio of the entire flowchart> because the active scaling scales the size and position, which affects the final position of the activity at the same time. The scaling of the rule is to scale the location, so the scaling of the rule not associated with the activity is not completely synchronized with the whole.