Monday, March 21, 2011

3D on Windows Phone 7 using Balder

This is not my first time to talk on 3D on Silverlight or Phone platform,In past I wrote decent amount of stuff including Kit3D,3D in Silverlight and recently I wrote 3D on Windows Phone 7 using capabilities of Silverlight framework sitting inside phone.

While surfing I came across this wonderful 3D engine for Silverlight and amazed to know that it is also available for Windows Phone 7. As usual I went ahead to try this out and as our blog’s tradition, whatever I explore I share with you people,so today I am going to do the same. Note here that,its 3rd Party and I do not have expertise over this 3D engine,so if you plan to use this for your apps in production environment for Silverlight or apps for Marketplace for Windows Phone 7, I advice you to spend more time with the bits and just don’t blindly follow.Most of the source code here what I am sharing is mostly from predefined Balder samples as I told this is very new to me as well.

You can check more on Balder at their Codeplex home :

http://balder.codeplex.com/

Once you download those Balder Bits for Windows Phone 7,you need to refer them like this :

RefBalder

ReferBalder

Note that once you start coding your XAML for Balder, Make sure you exclusively work in Code windows that having mix of design and code,why? Simple answer is with the current bits of Balder, it does not allow you to see/edit for that matter in your designer like this i.e No Design time support :

DesignerBalder

So if you see such screen like above, No need to get panic, this is normal for Balder,So even if designer not working,Code does work.So do not get panic and close project even if you see some design time errors in error list, just ignore them.

Like we have layouts like Grid, Balder provides Render layout with Balder.Execution namespace and we can add various shapes by Balder.Geometrics namespace which by default provides some basic shapes like ring and box which I am going to demonstrate here. Also it supports animation and light effects, Remember the lights from 3D Max? Omnilights etc? well, those are supported here and we can adjust them programmatically as well from code behind, Setting “x:Name” attribute will allow you to play with them via C# code.

You can associate namespace like this :

xmlns:Execution="clr-namespace:Balder.Execution;assembly=Balder"
    xmlns:Geometries="clr-namespace:Balder.Objects.Geometries;assembly=Balder"

You can simply add Ring or Box like this :

<Geometries:Box x:Name="MyBox" Dimension="5,5,5">

<Geometries:Ring x:Name="Ring"
                             Size="8"
                             Segments="30"
                             InnerRadius="6"
                             OuterRadius="8"/>

You can do further Material settings to Box like this :

<Geometries:Box.Material>
                        <Material:Material Ambient="Black" Diffuse="Green" Specular="White" Shade="Gouraud" />                                                   
                    </Geometries:Box.Material>

In Balder’s online demos, they have also added Images on Cube’s surface which you can check with more examples here :

http://www.ingebrigtsen.info/Balder/SampleBrowser/TestPage.html

Once you hit F5 you can see output like this :

BoxBalder          RingBalder

 

You can add your own background to make it more real like this :

finalBalder

With Timer, you can control camera from code behind like this :

void timer_Tick(object sender, EventArgs e)
{

           MyCamera.Position.X = x;
           MyCamera.Position.Z = z;
           MyCamera.Position.Y = y;
}

Here x,y,z you can set with Sin,Cos functions under System.Math so as to achieve various angles across space.In the exact same way you can use all above code base to your Silverlight application however bits for Silverlight (dlls of Balder) are different.But the same approach can be carried out for Silverlight.This is what I like most about Balder.I have uploaded a small video on this like how Balder output looks on Emulator once you have Animation+Objects+Lights in place,check this out :

3D on Windows Phone 7 using Balder

What I have shown I know is very basic,but this will be a good start to you to dig more into Balder. Balder is very much powerful and have lot of potential, I am in process of creating much more interesting stuff with it,but right now I can only share this much with you,I will be back with much more stuff as on when I make progress in the same.

So take out some time and give a try today to Balder :

http://balder.codeplex.com/

I know few of folks use XNA to create all these and may find it friendly but I want you to try this also,its worth exploring for sure.

Following result I get for above example which I am sharing with you,I am not sure about results what I got meet any kind of benchmark or not,nor I am much bother about at the moment,but here are some facts and figures for above Ring and Box 3D example :

Render Thread FPS (Average)

023-025
User Interface Thread FPS (Average) 024
Texture memory usage (Constant) 002656
Surface counter (Constant) 001
Intermediate texture count (Constant) 001
Screen Fill Rate (Constant) 00.8835

I hope you will give a try to Balder today,meanwhile I will finish up some interesting stuff and get back to you,stay tuned,soon I will be start talking on Silverlight.

Vikram.

2 comments:

Markettantrik said...

Interesting article. I just got my hands on a Samsung Omnia 7 and was marveling at "The Harvest". I also bemoan the lack of dev support for the platform with many new and useful apps being released for iOS and Android at the expense of WP7. Hopefully, some of your work will percolate into cool implementations.

twocs said...

Interesting read. It would be great if you could also provide a project that implements these ideas, since when I get an error for tags like I would like to be figure out where I'm going wrong.

Thanks.