You are developing a game, and your game is pretty decent but game without sound and music is not good game and does not create excitement that it needs to. For example Xbox 360 has Achievement earning, when you earn achievement sound of achievement earning is so nice to ears that you would love to play game just for the sake of earning achievements. Anyways that's apart coming back to todays tips and tricks. We are going to see how you can play Sound and Music in game using Windows Phone 7, what are challenges, tips and tricks.
XNA provides two ways of playing sound/music:
1 – SoundEffect 2 – Song using MediaPlayer
When you want to play small sounds, like explosion of bomb or sound of coin dropping on floor or similar sound effects you would want to use SoundEffect class. and when you want to play Background Music you would want to use Song class. Difference is that SoundEffect only plays WAV files, so when you use Music as WAV file, your music would be at-least 1 minute long, and 1 minute for WAV file is huge, your wav file will be very large approximate 20-30 MB.
Song class has another issue that at a time we can play only one file, we can not play more than 1 file simultaneously. So if you want to play Human voice, you might want to make them as WAV file and play them using SoundEffect class.
Above code will load content which is “coinsound” in wav file format, we create it’s instance and then play. Now you must be wondering why to call CreateInstance? when we are already initializing object. Now take a case when you collect coin you want to play sound so you execute above code, now above code works fine, but what if we collect multiple coins at same time then what to do in that case? In that case above code will produce sound of coin only once, even if you execute Play method multiple times, and will not give kind of effect we are looking for. So to produce multiple sound effect of same sound file, we can use same object but every time we will have to call CreateInstance and then call Play method.
Now, for playing Music we write below code:
Song sng = Content.Load<Song>(“backmusic”); MediaPlayer.Play(sng); MediaPlayer.IsRepeating = true;
Notice we are using MediaPlayer class for playing music, it means it will be using Zune Player to play the music. Now when you write above code and run your application you will come across given below error:
“Song playback failed. Please verify that the song is not DRM protected. DRM protected songs are not supported for creator games.”
This happens because your Windows Phone’s Zune Library is locked by Zune Software on PC.. Currently possible way of doing is to first run your game through Visual Studio on Device, when you encounter above error, stop debugging, disconnect device from PC and then start game on device through applications, and now you should be able to hear Music. NOTE: When you do SoundEffect you will not have any problem as above, It is only with MediaPlayer.
Whenever you develop a game for Windows Phone 7 using XNA game does not start in Full Screen mode, meaning when game starts it does not occupy the entire screen instead it leaves some space on top if running in Portrait mode or leaves some space on left side if running in Landscape mode.
This happens because Windows Phone Operating System makes top space or left space available for the battery meter indicator, time, cell signal, wifi signal, etc… now this can make your game look really bad and you will not be able to utilize the entire screen. So what to do if you want to occupy entire screen? Well, very simple you just have to write one single line of code, look at below code snippet:
public Game1() { graphics = new GraphicsDeviceManager(this); graphics.IsFullScreen = true; Content.RootDirectory = "Content"; TargetElapsedTime = TimeSpan.FromTicks(333333); }
Writing above code will hide the bar which occupied the space. But this does not mean your game will block calls, notifications, etc.. whenever any kind of notification or call arrives Windows Phone Operating System will alert your game saying User is not able to see screen so that you can pause the game. This happens only when you receive a call or notification which would take up a space of screen.
For the partial-screen Obscured notification and the tombstoning notification to the Game.Deactivated event will be fired. PhoneApplicationService.Deactivated event will fires for both Silverlight and XNA when the app is being tombstoned. Obscured and Unobscured are not binded in App.xaml.cs file is because there will be many non-game applications which will not need to use these events.
Once you done with the above code, compile and run the code and notice the difference.
Hello, with this blog post I am starting tips and tricks on Developing Games on Windows Phone 7 using XNA.. or in general XNA.
By default whenever you develop game for Windows Phone 7 using XNA, your game will always start in Landscape mode. Your emulator will start in portrait mode, but game is playable in landscape mode.
Let’s say you have requirement of developing game for portrait mode and not landscape mode, you have to add 2 lines of code. In your game after you initialize GraphicsDeviceManager write following 2 lines:
public Game1() { graphics = new GraphicsDeviceManager(this); Content.RootDirectory = "Content"; graphics.PreferredBackBufferWidth = 480; graphics.PreferredBackBufferHeight = 800; TargetElapsedTime = TimeSpan.FromTicks(333333); }
after writing above code, compile and run it. .and you will have your game starting in Portrait mode.
PUG DevCon 2010 was held on 18-19 December 2010 in ICC Towers, Pune. It was multi track event.
On 1st day we had 2 tracks. In 1st track, sessions were taken by Sanjay Vyaas, Nauzad Kapadia and Sarang Datye. In 2nd track, sessions were taken by Ashiwni Shahane, Saranya Sriram, Dhaval Faria and Ketaki Kode. Topics covered on 1st day were NET 4.0, multithreaded applications with Net 4.0, Office business applications, Azure applications, Cloud, XNA and Silverlight.
On 2nd day we had 3 tracks. 1st track included VS2010 sessions, 2nd track included Silverlight sessions and 3rd track included Sharepoint sessions. Sessions on 2nd day were taken by, Dhananjay Kumar, Subodh Sohoni, Gouri Sohoni, Kunal Chowdhary, Pradnya Naik, Nauzad Kapadia, Mahesh Sabnis, Mayur Tendulkar, Sudhendra Kohlam, Monish Darda, Raj Chaudhari, Sankool Shah and Dhaval Faria.
I was speaker for 1st day 2nd track. I spoke on Developing games using XNA game studio along with Dhaval Faria. I covered theory part of basics on building a game, previous video game consoles. Dhaval Faria covered the coding part for a game. Being a PUG volunteer, I also handled registration counter for both days.
Whole event was a big hit. Almost 140 people attended on Day 1 and 100 people attended on Day 2.
Hello.. I hope all are enjoying Windows Phone 7 development.. This is 1 more blog on Windows Phone 7. This blog is regarding isolated storage of Windows Phone 7. In this blog I am going to include a brief introduction on isolated storage of Windows Phone 7 and 1 demo along with its screenshots.
Isolated storage is basically local storage of your Windows Phone 7 mobile. Your applications can save its data in this isolated storage. It is compulsory for the user to save their application data in isolated storage. Windows Phone 7 does not allow storing files in any other file system locations.
Let’s see what exactly isolated storage means. “Isolated” means separated from others. So basically, in this storage each application’s data is isolated from each other. Means 1 application can’t see and access another application’s data. But sometimes it may happen that your 1 application may need data of another application. Then the best option is use of Cloud. You can put your data in cloud and access whichever data you want for any application.
It is very important that developer should keep a watch on data storage. It’s important that you should conserve data space. You can do this by deleting temporary data in storage. Also if user creates any data in the application, developer should allow them to delete it later which will help to conserve space. Using cloud as option is another way of conserving data space. Always give user, information about data getting stored in storage through your application so that if storage is getting full, user will get to know it and accordingly user can delete files.
The above figure is taken from msdn site. You can refer msdn site http://msdn.microsoft.com/en-us/library/ff402541%28v=VS.92%29.aspx for this. This figure shows you the actual storage of data. Figure is self-explanatory. Upper is the main Application Data Store Folder. It has two parts local settings and files and folders structure. 1st is Local Settings which updates the changes made by developer to the application directory. 2nd part is Files and Folders. You can access it by using API. Using these APIs developer can create, delete and manipulate files and folders. Now let’s see demo for isolated storage.
Step 1:-
As we have to develop windows phone application, we need to choose Windows Phone application in Visual Studio. So it will be File -> New -> Project -> Windows Phone Application.
Once you create a new project you will get your project on your screen as shown in below figure.
Step 2:-
In this demo I am going to show you how to write and store data in isolated storage and also how to read data from isolated storage. For that I am going to use 1 textbox to take input from user, 1 button to save data, 1 textblock to display stored data and again 1 button to retrieve data from isolated storage and display in above textblock. You can see this UI in figure below.
Step 3:-
Code behind..
As we have to use isolated storage, we need to add 2 IO namespaces. System.IO System.IO.IsolatedStorage So at start you add these namespaces by including using statement in your code behind.
Step 4:-
Here we are going to include the steps for writing and reading data from isolated storage.
In the above figure you can see two methods written btnSave_Click and btnShow_Click. btnSave_Click is written for writing and storing data in isolated storage and btnShow_Clickis written for displaying data from isolated storage. Let’s start with storing data. Here IsolatedStorageFile represents an isolated storage area containing files and folders. So basically using IsolatedStorageFile we can create directories, files etc were we can store our data. Later on we have created a directory called Data in storage. We can create files in this directory and store data in it. After that we going to use StreamWriter to write data in a file. So what we actually doing here is, 1st we creating a new IsolatedStorageFileStream for a file abc.txt in above created folder. Mode of this file is Create as we going to create this file in above created store (isf in our code). This whole argument is been given to StreamWriter. Later on we going to write in this file whatever input we had taken from the user. Thus we are done with writing data in file.
Now let’s see how to retrieve data. Here again we declaring new IsolatedStorageFile same way as above. Here as we have to read data we going to use StreamReader. So similarly, creating a new IsolatedStorageFileStream for a file abc.txt in above created folder. Mode of this file is Open as we going to open this file which was already created above in our store (isf in our code). This whole argument is been given to StreamReader. After this, we reading data from that file and displaying it in textblock. Thus we are done with reading data in file.
Step 5:-
Now let’s run our application by pressing F5. You will get on screen as shown in below figure.
This is going to be the UI which we had designed.
Now let’s enter input in textbox which will be stored in isolated storage.
Once you click Save button your data gets saved in isolated storage and you get a message box that your data is stored.
Now let’s retrieve this stored data. Click on Show button and you will get the stored data in your textblock as shown in below figure.
That’s it!!! We are done with our isolated storage demo. Will be back soon with such more interesting blogs. Till that time, Good bye and enjoy WP7 developing.
After installing Windows Phone 7 SDK, when you start Visual Studio 2010 and Click on New Project or immediately after starting Visual Studio 2010, Visual Studio crash run following command in Visual Studio Command Prompt by going to Start > All Programs > Visual Studio 2010 > Visual Studio Tools > Visual Studio Command Prompt
devenv.exe /installvstemplates
Cause: if you run devenv.exe /Log C:\output.txt in your txt file you will notice that there are some duplicate entries for the Project Templates. By running above specified command it will reinstall VS Templates, and solve the issue.
Hello.. We had seen how to develop an application for Windows Phone 7. We had seen a very basic application Hello World Application. We will see more later. This blog is for those who are ready with their applications or will be ready with their application. In my blog am going to explain the steps how you can submit your application on Marketplace.
So we have to start with creating an account. Once it’s done go to this site http://create.msdn.com/en-US/ . Login onto this site with username and password of the account created. Once you login you will get below image on your screen.
On left hand side you can see written Submit for Windows Phone. As the name suggests, if you want to submit your windows phone application you can click here for further procedure. Basically, this is a 5-step procedure which you have to complete for submitting your application on Marketplace.
I will explain you these steps in detail once step by step. So back to Home page. When you will click on “Submit for Windows Phone”, you will a form of “upload” on your screen. You need to upload .xap file of your application. Now what is .xap file.
A .xap file is basically a compiled Silverlight application. The file is actually a .zip file that contains all the files necessary for the application. Just rename the .xap file to have a .zip extension and then you can open it up to see its contents. The .xap file contains an application manifest (AppManifest.xaml) file and all the necessary DLL's that are required by the application. This .xap file is placed in \Bin\Release or \Bin\Debug.
This .xap file to upload should not exceed than 400MB. In the form you can see, Application name. Give your application name. In Application Platform select Windows Phone 7. In language select English language. In version select the version which you have used. In Application Package upload your application. Below two are optional things. Once your upload form filling is done, click Next. It will take you to next step, “description”.
Above image shows how your description form will be. It consist complete description of your application. Depending on this form users will decide to buy your application or not as they will get complete description of your application. So I will suggest you to use many keywords so that it’s easy to for users to find your application. Now let’s see details about form. 1st is application title. You can write here according to your application. Similarly you can select category according to your application. Next is the detailed description. This is the main thing which user will go through. So write as much as possible. Next is optional part. Next field is keywords. Write as many keywords as I mentioned above. Legal URL field is optional. Then is Support Email Address. This field is also optional. But I will suggest you to add this email so that if any user has any issues or questions with your application he can mail you those solutions. So that once you solve those issues user will be satisfied completely. So it’s better to add Support Email Address. Required device capabilities field. This includes the requirements for your application.
Once your upload form filling is done, click Next. It will take you to next step, “artwork”.
Above image shows your artwork form. Artwork form includes tiles or images of your application. This will attract user to buy your application. Large mobile app tile and Small mobile app tile includes tiles of your application. Large has size of 173 X 173px and Small has 99 X 99px. Similarly size of Large PC app title is 200 X 200px. For creating this image you can use Paint.Net or Photoshop. Talking about images, you have to adjust your application image dimensions same like mentioned above. Even if it changes a bit, it will fail. Next field is Background art which is optional field. Next is screenshots. You can add screenshots of your application in this field. With these screenshots user will get proper idea about your application. You can add upto 8 screenshots. Its size is 480 X 800px.
Once your upload form filling is done, click Next. It will take you to next step, “pricing”.
Above image shows your pricing form. In this, 1st field is for trial mode. If your application has trial mode, tick this field. Next is worldwide distribution tick it as your application will be up for whole world. Primary offer currency, you can set this according to your convenience. You can set it as USD etc. Application Price is the price of your application. Set it as per your calculation. You can submit 5 free applications per account.
Once your upload form filling is done, click Next. It will take you to next step, “submit”.
This is the last form. There is only 1 option in this form. Automatically publish to Marketplace after passing certification. Tick this. Once you tick this click on button “Submit for certification” below.
So you are done with submitting your application in Marketplace. Once it’s done you can visit your app hub to see the status. Most of the Windows Phone 7 apps are being tested / approved within a few days. Its same as below image.
If your app fails testing, then Microsoft will send you an email detailing the reason for failure.
This is all with this blog. Will be back soon with few more blogs regarding Windows Phone 7!!! Till that time bye and enjoy development for Windows Phone 7.
Hello all. I am back with my blogs once again. This time I am going to write a blog on a current hot topic. Guessed correct!!! Windows Phone 7. All are excited with WP7 topic. Not only for use but also for development of WP7 applications. So for what are we waiting? Let’s start building applications.. I will start with a very basic application and as we all know our tradition “Hello World Application”. I will include screenshots for each of my step so that it’s easy for you to understand visually too. So let’s start…
Step 1-
Let’s start from very basic part – creating new project. Go to File -> New -> Project.
You will get a screen where you will get options. Check on left hand side, select a language C# or VB and select Silverlight for Windows Phone. After selecting it you will get options regarding Windows Phone Applications on right hand side. Select 1st option – Windows Phone Application. Give your application name below. I have given it name WP7HelloWorld.
Step 2-
You will get a screen where you can see two splitted windows. On left side you can see WP7 device and on right side you can see XAML code. You can design on device using tools from toolbox. If you want to make changes in design through code you can do it on right side.
On top of the device its written My Application this is the name of the title which you can change. Just below is written page name. This also you can edit according to your application. In my application I have changed “My Application” to “Hello World Application” and similarly have changed “page name” to “Hello World”.
Step 3-
Next step we going to do is placing controls. I am going to use 1 textbox where we will take input from user (will take their name as input), 1 button on clicking of which will display output and 1 textblock (which is label in windows forms) to display output. In below screenshot you can see the alignment of these 3 controls. You can select these controls from toolbox which you can see on left side. If toolbox is not visible you can view it from View -> Toolbox.
Step 4-
We want to execute application when user clicks on button. So let’s write code on button click event.
Now what exactly we going to do in our application is, we will take name as input from user through textbox and once user clicks on button we will display “Hello ……” in textblock. So we are going to write the code as shown in below screenshot.
Step 5-
In this step I am just increasing the font size of textblock so that output is properly visible to the user.
Step 6-
Now press F5 to run your application and you will get a screen as shown in below screenshot. This is known as emulator. In your Visual Studio you can see 1 dropdown just below menubar which gives you options as Windows Phone 7 Emulator or Windows Phone 7 Device. If you have actually device you can connect it to your machine and run this application directly on your device. If you don’t have a device not to worry we have Emulator. You can run your application on Emulator by choosing Windows Phone 7 Emulator in that dropdown. Now back to your application running on emulator. You can see the UI which you had designed.
Once user clicks on textbox a keyboard will be popped up from below. If your machine has touch screen you can actually do typing by touching screen and get actual feel of device. If you don’t have touch screen to your machine simply click using mouse on the particular characters which you want to insert in textbox.
Once it’s done click on button and you will get your output below. You can see the output in below screenshot.
That’s it!!! Your application is ready!!! I will be back soon with more bogs on Windows Phone 7. Till that time. Good bye :-)
A 2 days workshop on .NET was held in Vishwakarma Institute of Information Technology (VIIT) College on 5-6 October 2010. This was on intercollegiate level and was supported by Microsoft. Almost 150 students from different colleges all over Pune attended this workshop. Students from FE-BE attended it. Workshop included basics of .Net, ADO.Net, ASP.Net, Cloud Computing, Windows Phone 7 etc. We also conducted practicals mainly on basics of .Net and also on ASP.Net and ADO.Net. Was a challenging job as FE and SE students were blank about all these things and had to make them understand each and everything including logic. But overall nice workshop. And being alumni of this college was nice experience to take training in same college.
A 2 days workshop on VB.NET was held in Indira College on 21-22 August 2010. This was held by Pune University for professors of TY BCA (Pune University). There were almost 40 professors from different colleges all over Pune. Workshop included basics of .Net, ADO.Net, etc. We also conducted practicals which were conducted by me. I performed all practicals which were included in their syllabus. Was a nice experience.
Microsoft’s Community Tech Days was held in Pune on 17th July 2010. It was another successful event in Pune volunteered by Pune User Group (PUG) members. Keynote was given by Mr. Daniel. Next sessions were presented by Vivek Venkatesh on Programming in right way, an exciting session on Windows Phone 7 by Mayur Tendulkar, Expression Blend 4 by Pravinkumar Dabade. Last session was given by me on Visual Studio Tools for Office (VSTO). I presented introductory session on VSTO. It included theory part also with 6-7 demos which included excel, word, outlook demos. Almost 80-90 people attended event. In all nice event!!!
Hello all. I am back with another interesting blog. This blog is on Bing Maps. We all use maps to find out any location anywhere in world. Suppose I want to find out location of Pune in India how will we search? Simple! Open maps put Pune, India in its search box and it will give you location of Pune. Now when we get Pune we also get some image on map which is known as pushpin which points out the location which you have searched. Now many of you must be thinking from where we get this. But it’s very simple. We can actually code for that using Bing Maps and get it done! Let’s see few things related to Bing Maps.
In this blog we will see following things related to Bing Maps:- 1) Add Pushpin 2) Delete Pushpin 3) Add Polyline Let’s start with 1st part Add Pushpin. Before that we need to include a script to get map in our browser.
var icon = "<div><img src='images/greenpushpin.png' alt='green pin' width='30px' height='30px'/></div>"; var infobox = "<div style='width:309px;'>This is green!!! Run!!!</div>";
function AddPushpin() { shape = new VEShape(VEShapeType.Pushpin, new VELatLong(19.0177, 72.8562,2272)); shape.SetCustomIcon(icon); map.ClearInfoBoxStyles(); shape.SetTitle("<h2>Pin</h2>"); shape.SetDescription(infobox); map.AddShape(shape); }
In this above function we have used method VEShape to create a shape to which we going to call pushpin. We have VEShapeType.Pushpin as its parameter to get shape pushpin on the map. VELatLong is a method which takes parameters latitude and longitude where by default that pushpin will be placed. We can also dynamically take latitude and longitude as parameters in AddPushpin() function. This will result into following,
We can see in this image above the result of AddPushpin(). We can see a spot marked in red which is pushpin of red color which is place on location Pune.
2) Delete Pushpin :-
Next we will see DeletePushpin.
function DeletePushpin() { if (shape) map.DeleteShape(shape); shape = null; }
This code is used to delete pushpin from Bing Maps. We have a specific function DeleteShape() to delete pushpins where we can call the shape which we had added using AddPushpin() and then set that shape to null.
3) Add Polyline :-
Lets now see how to add polylines. First we will see how to add button in body part clicking on which we can start adding polylines. For that we need to write following code,
<body> <input type="button" id="cmdDraw" value="Click to begin drawing" onclick="startDrawing();" /> <div>Drawing Mode: <span id="ModeIndicator">Disabled</span></div> </body>
var polyline = null; var polylineMask = null; var points = new Array(); var maskPoints = new Array(new VELatLong(0, 0), new VELatLong(0, 0)); var drawing = false;
function GetMap() { map = new VEMap('myMap'); map.LoadMap(new VELatLong(19.0177, 72.8562), 5, false); polylineMask = new VEShape(VEShapeType.Polyline, maskPoints); polylineMask.HideIcon(); polylineMask.Hide(); polylineMask.SetLineColor(new VEColor(0, 0, 255, 0.5)); polylineMask.Primitives[0].symbol.stroke_dashstyle = "Dash"; map.AddShape(polylineMask);
function mouseMoveHandler(e) { if (drawing) { var loc = map.PixelToLatLong(new VEPixel(e.mapX, e.mapY)); if (points.length > 0) { polylineMask.Show() }; maskPoints[1] = loc polylineMask.SetPoints(maskPoints); } }
function mouseDownHandler(e) { if (drawing) { currentLatLon = map.PixelToLatLong(new VEPixel(e.mapX, e.mapY)); points.push(currentLatLon); maskPoints[0] = currentLatLon;
if (points.length > 1) { if (!polyline) { polyline = new VEShape(VEShapeType.Polyline, points); polyline.HideIcon(); map.AddShape(polyline);
function keyPressHandler(e) { if (drawing && e.keyCode == 27) { drawing = false; map.vemapcontrol.EnableGeoCommunity(false); document.getElementById("ModeIndicator").innerHTML = 'Disabled'; document.getElementById("cmdDraw").value = 'Click to begin drawing'; document.getElementById("cmdDraw").disabled = false; polylineMask.Hide(); } }
In the above code we have given user his choice to choose locations and draw polyline. We have used a button on clicking of which user can start drawing polygon and once it press ESC button on keyboard he will stop drawing polygon. For drawing polyline we have set line width, its color etc using a method VEColor. For drawing polylines we have used mousehandlers and keypress handler events. We have used mousehandlers for clicking on location and start drawing polyline and keypresshandler to use ESC button once polylines drawing is finished. To check whether drawing is finished and user has pressed escaped or not we have used a boolean variable drawing.
Result we can show in below video.
This way we can add pushpins, delete pushpins and draw polylines.
Microsoft’s biggest event in India, TechEd, was held on 12-13-14 April 2010 in Bangalore. It was held in Lalit Hotel. Almost 2000-2500 people attended this event. I also got a chance to attend this event. Many dignitaries like S.Somasegar, Moorti Uppaluri, Stephanie Saad Cuthbertson, Sanjay Vyaas etc gave keynotes and sessions. It was in all a 3-day event which included 7 parallel tracks. All technologies for developers and IT Professionals was covered in this event. On 1st day after registrations, event started at 9:30 am with a welcome note of Mr. Moorthy Uppaluri which was continued by S.Somasegar with keynote and Visual Studio 2010. Launch of Visual Studio 2010 was a prime attraction of this event. Everyone was interested to know new features of Visual Studio 2010 which was shown by Stephanie Saad Cuthbertson and Paula Willis through interesting demos. Other sessions included ASP.Net, Cloud Computing, VS 10 programming, securing infrastructure etc. On 2nd day interesting sessions for me were Windows 7 phone development track. Awesome demos were showed by Mr. Vivek Dalvi. We also had sessions on Windows 7, Sharepoint 2010, Office 2010. Architect’s track included session like Concept Visualization by Mr. Sanjay Vyaas. On 3rd day there were individual tracks for Sharepoint Development, Azure, RIA (Silverlight) etc. Speakers like Mr. Nitin Paranjape, Mr. Raj Choudhary, Mr. Harish Ranganathan etc had their sessions on 3rd day. We also had Demo Extravaganza everyday after all sessions concluded. In this section many people got chance to show their talent. One of the most amazing demo was Buddy Home and Robo war and dance demonstrated by Ramaprasanna Chellamuthu. Also 2 college boys demonstrated their project of philontrophy which was one more amazing demo. There was another special section called Community track in which MVPs, Industry Experts gave sessions which were very deep technically and also were very understanding. For e.g. Mr. Dhaval Faria gave a session on F#. We had another section called Hands on which helped people to get practical knowledge of technologies. Event also included a Partner stalls in which parteners like Accenture, Telerik, Sapient etc had put their stalls. Many goodies were distributed there like tshirts, cds etc. We also had MTv VJ Mr. Nikhil Chinappa attending the event. We really had a nice time enjoying this event.
In WPF, we have 3 types of animations: 1) Color Animation – Used to change the color of the control. 2) Double Animation – Used to animate double values such as X/Y coordinate, Width and Height etc. 3) Key Frame Animation – This is a complex animation than color and double animation. In this animation we use key frames or a series of key frames.
Above we have seen just 1 line introduction of all types. We will learn more about them below along with their examples.
We all know that we have to write animation part in “Storyboard”. To begin storyboard we need to do “<BeginStoryBoard>”. It has two main properties – “TargetName” and “TargetProperty”. “TargetName” identifies the pbject and “TargetProperty” identifies the property of that oject. If we want to begin animation on some event like button click etc we can use “EventTrigger”. In animation there are two things – “To” and “From”. “To” specifies the start of animation and “From” specifies the end of animation. “TimeSpan” is 1 more keyword which specifies the time span for how much animation should run. These are few basic keywords which are necessary in our coding part for animation. We might come across few more keywords which I will explain them as they are used. Now let’s start with examples of animations.
Above is the code of color animation. In this example, we have a rectangle which is of yellow color which changes to blue color in time span of 1 second. In above code we have declared a rectangle which is already filled with yellow color. We have declared event on it as “MouseLeftButtonDown”. If we left single click on rectangle, animation will start. Now this animation we have declared below in StoryBoard in Color Animation. For this we have given TargetName the name of rectangle as that is our target for animation and TargetProperty we have declared as Fill.Color which fills the target with given color. Here we have also declared which color to fill which is blue. We have given duration as 0:0:1 which is 1 sec.
So after writing this code we will get the output as shown in below video.
Above is the code of double animation. In this example, we have a rectangle which is of red color of height 38 and width 200 which changes to height 100 in time span of 1.5 second and width 350. We have declared event on it as “MouseLeftButtonDown”. If we left single click on rectangle, animation will start. Now this animation we have declared below in StoryBoard in Double Animation. For this we have given TargetName the name of rectangle as that is our target for animation and TargetProperty we have declared as Height for change in height and Width for change in width. So after writing this code we will get the output as shown in below video.
Let’s see 1 more example of Double Animation in which we will write animation part in code.
In XAML you will have to write, <Grid> <Button Content="Animate" Height="33" HorizontalAlignment="Left" Margin="32,12,0,0" Name="btnRotate" VerticalAlignment="Top" Width="165" Click="btnRotate_Click" /> <Rectangle Height="200" HorizontalAlignment="Left" Margin="534,158,0,0" Name="rectangle1" Stroke="Black" VerticalAlignment="Top" Width="50" Fill="#FF166C0F" /> <Rectangle Fill="#FF166C0F" Height="50" HorizontalAlignment="Left" Margin="457,235,0,0" Name="rectangle2" Stroke="Black" VerticalAlignment="Top" Width="200" /> </Grid>
In code we need to write,
namespace WpfApplication1 { /// <summary> /// Interaction logic for MainWindow.xaml /// </summary> public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); }
private void btnRotate_Click(object sender, RoutedEventArgs e) { DoubleAnimation da =new DoubleAnimation(); da.From = 0; da.To = 90; da.Duration = new Duration(TimeSpan.FromSeconds(3)); DoubleAnimation da1 = new DoubleAnimation(); da1.From = 0; da1.To = -90; da1.Duration = new Duration(TimeSpan.FromSeconds(3)); //da.RepeatBehavior = RepeatBehavior.Forever; RotateTransform rt = new RotateTransform(); rectangle1.RenderTransform = rt; rt.BeginAnimation(RotateTransform.AngleProperty, da); RotateTransform rt1 = new RotateTransform(); rectangle2.RenderTransform = rt1; rt1.BeginAnimation(RotateTransform.AngleProperty, da1); }
} }
Here we have taken two similar rectangles. We have given angle property to each of them. To 1 rectangle we have given angle 90 and to other we have given angle -90 due to which both rectangle animate in opposite direction. We have included animation in the code. For writing this in our code we need to include namespace using System.Windows.Media.Animation.
So after writing this code we will get the output as shown in below video.
Here we have taken the combination of color and double animation. We have considered the same above example for this. Here as time passes and angle changes the color of rectangle also changes.
So after writing this code we will get the output as shown in below video.
Here we have taken a rectangle. It uses key frames to change the animation. Here we are using X value. We have changed it from 0 to 350 back to 50 and again to 200. We have used Linear key frame so it moves in Linear Fashion.
So after writing this code we will get the output as shown in below video.
Similarly we can do using spline double key frames as follows.
Here we have used spline double key frames using which we can animate in any way. So after writing this code we will get the output as shown in below video.
Microsoft Report is based on report definition which is an XML file that gives us the data of a report. It may have different extensions. For eg. We can create a client-side report definition language (*.rdlc) file using Visual Studio. Reports also include tables, aggregated and multidimensional data, charts etc as per users requirements.
Let us see a example of creating a report. In this we will have a table in our report which will shoe us details of students like name,roll no etc.. Lets start is step by step..
Step 1: We want to build a windows application so we will choose Windows Form Application. You can select any language you want according to your choice. May be it is VB or C#. Give it a name and move ahead by clicking ok. You can check it in screenshot given below. I have named it as SampleSQLReport.
Step 2: After creating Windows Form Application we will get a form which will be completely blank. Now we will ask user to enter his name who wants to generate a report. For this we will need a label on which we will ask user to enter name, then a textbox in which user will enter their name, and last a button on clicking of which will generate a report. We can also increase form size by going into its properties and changing size of it. All these things are shown in screenshot below.
Step 3: Now as we want to generate report we need to include a Microsoft ReportViewer. We can also use Crystal ReportViewer but here we will use Microsoft ReportViewer. We can get this from our toolbox which is on left side. In that we will get it from Reporting. So you can include Microsoft ReportViewer from there by dragging and dropping or by double clicking on it. You can see a report just below label, textbox etc. We can see all these things in screenshot below.
Step 4: After this we have to add a file named .rdlc creating report. For adding this we need to add new item Report. Name it. Here I have given its name as rptSample.rdlc. After adding it we get this in window as shown below.
Step 5: Next thing we will do is that the textbox which we had asked on main application we will display that name on report too.. For that we need to put textbox on report too which will display name. For displaying name on this from main page textbox we need to add report parameters. We can do this by going into Report tab in above navigation bar. Report Report Parameters. After you select this you will get a screen which is shown in below screenshot. In similar way you have to move ahead.
In above screenshot you can see we have added parameters. I have given its name as paraName. Similarly you can add your parameters.
In below screenshot we can see how to add parameters to textboxes so that its value gets displayed in textbox.
Step 6: As we see above we have to select (Category) Parameters (Item) All (Parameter) parameter name which you have declared before in your code. Then after clicking ok you will get below screen.
Till what we have done, its code is given in below screenshot.
Till what we have done lets run it. So that we will get to know whether wat we did atleast till that point how its working. So after running you get this.
Step 7: Now lets move ahead with database part as we want to display Student database in a tabular format in our report. So for that will add annother class in code which will include Student table format. We can see the code in below screenshot.
In above code DataTable Student is created with rows like rollno,name,div,marks and those columns are added in columns.
Step 8: Now we have created DataTable but we need to add DataSource also to this. For that we have an option on left hand named data source. When you click on that we get an option Add New Data Source. After clicking on that we get screen as shown below and in that we have to choose object.
After selecting object click Next. After that you will get screen as shown below.
Step 9: In aboce screenshot you can see options in which student option is included. It’s the same table name which we have created in our code. Select that and click Next. On left side you will see table and its columns which you had added in code. Now as we want to display this in tabular format we will dragand drop Table from toolbox on right side and we will get a table in our report page. Now we can see rows and columns in that table. We will select each column from left side and drag and drop it on particular column in the table. For eg. We will drag and drop rollno column and drag and drop it on 1st column of the table. Similarly we will do of remaining rows and this way we have added columns to our table. If you want to add more columns to the table you can right click on it and you will get option Insert column to right/left. So according to your needs you can add more columns to your table. Final output of this is shown in below screenshot.
Step 10: Now we have to add some data in Student table. We will have to add this in code itself. For that we have to write code written in below screenshot marked in red.
Final Output: After adding this data our work is finished. Now we will run our project and we will get output as shown in screenshot below.
