Techniques and special effects of Silverlight 2.5D RPG games: (3) dynamic light and shadows

Generally speaking, when talking about creating shadows and shadows, the first thing that comes to mind is nothing more3D. The Shadow design in the game can be roughly divided into hard implementation and soft implementation, such as"Game shadowWorkTechnology"This articleArticle3D Game shadow production SolutionProjective shadow,Shadow MapAndShadow volumeAll are hard implementations. The hardware implementation is the most realistic, and the calculation workload is relatively high.SilverlightDevelopment2.5DFor online games, we usually use a soft implementation to express the dynamic light and shadow effects in the scenario. Exquisite light and shadows allow gamers to fully experience the three-dimensional sense of space.2.5DOnline Games are indispensable.

The soft Implementation of light and shade effects in Silverlight 2.5D online games mainly uses analog simulation methods. There are roughly three traditional solutions:

1) fixed circular shadows with vertical radiation. We can assume that when the role is illuminated by the light source on the top of the head, it will produce a circular Light and Shadow. In the game, we only need a circular film material, which is scaled and matched according to the proportion of the role's land occupation,2.5DThe three-dimensional effect is immediately displayed (the best performance of this solution ):

2) dynamic light and shadows Based on the paper doll system. The principle is also very simple, that is, using the shadow as one of the components of the role's paper doll dynamically combines the real-time actions of the role with other components. In exchange for increasing the workload of ArtProgramSimplified Design (general performance of this solution ):

3) dynamic light and shadow of synchronous action ing. The difference is that this solution does not require additional shadow image resources, but usesSilverlightBuilt-inWriteablebitmapCooperationOpacitymask (Transparent mask)Such as the following logic:

Writeablebitmap =   New Writeablebitmap (role. overallwidth, role. overallheight );
Writeablebitmap. Render (role. entity, Null );
Writeablebitmap. invalidate ();
Rectangle rectangle =   New Rectangle () {width = Role. overallwidth, height = Role. overallheight, fill =   New Solidcolorbrush (colors. Black )};
Rectangle. opacitymask =   New Imagebrush () {imagesource = Writeablebitmap };

writeablebitmap object with the maximum possible area of a role as the width and height; then, ( Removes the shape part such as name and blood strip. ) draw writeablebitma P . Then, the writeablebitmap is used as the transparent mask image source of the black rectangle consistent with its size. ( event ) , a dark real-time shadow is born. Of course, at this time, the shadow still needs to be offset according to the hypothetical scene light source location to achieve the final simulation effect. In Silverlight , the following two solutions are available: transformgroup and planeprojection . In this section, I select the latter to achieve the goal:

Shadow. Projection =   New Planeprojection (){
Globaloffsetx =   - P.x + Shadow. Center. X,
Globaloffsety =   - P. Y + Shadow. Center. y,
Localoffsetx =   - 48 ,
Localoffsety =   92 ,
Rotationx =   86 ,
Rotationy =   7.6
};
Shadow. Opacity =   0.5 ;

PlaneprojectionUp12, Very powerful, any plane-based3DThe pivoting effect can be easily achieved (this solution is the most realistic, with a large memory footprint and poor performance ):

In fact, for the paper doll system or real 3D model, the rational use of dynamic light and shade, and both performance and experience are very worth studying. For example, the processing method of "Star changes" is to render the dynamic light and shadow of the main character players from time to time, while all other roles, including the NPC, players, and monsters, use simple basic shadows, it is an excellent design solution:

It should be noted that if you plan to add a Global Shadow switch for the game/You are advised to write a separate shadow manager as the storage and management container for all role shadows instead of using the shadow in the role control. In this section, I have reconstructed the source code of the scenario, with a more distinct hierarchy. The bottom layer is the background map.400*400Slice is dynamically loaded based on the location of the main character. The related parameter is the screen resolution.(By callingJavascriptOfScreen. WidthAndScreen. HeightFunction acquisition)AndOOBThe window size in the mode. The shadow layer is the top layer.IDConsistent shadow synchronization action, provided that the role is within the main-character-centered screen range(Visible)The upper layer is the scene space layer.(Space)All roles, animations, and shadows are in this layer. After all, they need to interact with each other.ZHierarchy.

To download the source code of this Section, go to the directory.

Online Demo address:Http://cangod.com