9 new XAML/SharpDx demos


image

[UPDATED : Demo code now works for FINAL RTM version of Windows 8 (9200) ]

I’m becoming more experienced with WinRT XAML and DirectX via SharpDx, and as such my demos are becoming more complex. This is all a learning process for me and the code reflects that. I hope you find something useful in the samples.

Here’s a quick video of the 9 new samples, I apologize upfront for the shaky camera work. If I try to screen capture on my tablet the CPU utilization negatively impacts the performance of the running app.. So I’m stuck with a hand held camera for now Sad smile

2000 bursting stars

- Rudimentary Sprite Batch – optimized and rendering 2000-4000+ sprites (stars) with some complex motion for each sprite. I easily got this painting up to 5000 sprites and with good frame rate. That’s simultaneously running sprites, you can create some pretty cool UX with that many independent sprites Smile

image

Icon Burst

- Sprite Batch + Sprite Sheet – This demo introduces the concept of a sprite sheet, a single sheet containing all your sprites that you cut up and draw on a surface. I wont go into the tool to create the sprite sheet, which is a work in progress, but the demo shows how to take that sprite sheet, push it to the GPU as a single texture and then render a clipped region of that texture via the sprite batch

image

Icon wall

– this takes the demo 2 above and renders a wall of icons . Very simple, I plan on doing more with this demo in the future.

image

Firework

– using SharpDx to get to Direct3D and Media Foundation this is taking the IE10 firework demo and doing it in XAML and DirectX. The result surprised me because it performed much better than the IE10 demo itself. I know its very rudimentary BUT it still does quite a lot of what the browser version does. Browser version was very choppy and was getting into the 20%+ CPU utilization, almost unplayable in some cases. The SharpDx/DirectX/XAML/Media Foundation version was very smooth!

image

Drop shadow Effect

– a simple Direct2D effect graph to draw a drop shadow on an image

image

Tilt-shift like Effect

– using only direct 2D supplied effects, several graphed effects to produce a tilt-shift like effect. Just shows that the supplied basic effects in Direct 2D when graphed can achieve some very complex effects, no need to create your own custom effect Smile

image

Tile Dashboard Editor

– A simple tile layout editor, I plan to use this to help layout my home screen tiles. Close to 80% of the apps in the win 8 app store use some form of tiled home screen, this tile editor will hopefully one day make creating these home pages very simple. The goal is to create a Windows Phone 8 like home screen layout of tiles.

image

3-Axis Grid

– this is a very basic introduction to the x,y,z axis in Direct3D and using matrix transforms to move the planes around. It also introduces the concept of Line-List to draw the lines, as opposed to the triangles I’ve been using to date.

image

Radial Control

– This is a very simple version of the OneNote Radial dial, the purpose is to introduce the concept of a curved menu and to show that drawing arcs in XAML is easy even without the Drawing.Shapes library that we are accustomed to from Blend Silverlight . This is all XAML and is very fluid. I plan to iterate this control many times, and hopefully one day it becomes a control I’d be happy to use in an app.

image

Demo Code

[please note that this will be updated when I have time to, I am quite busy and this is a side project. ]

image

image

Conclusion

Again please remember that these demo’s are the result of me learning these new technologies, they are very rough and I would expect you to re-architect them if you were to use it in your app.

I’m loving this new WinRT XAML SharpDx world and its pretty clear to me that MS are headed in the right direction with Windows 8.

I look forward to seeing what you build with this new application developer stack Smile

18 responses to “9 new XAML/SharpDx demos

  1. Pingback: 9 new XAML/SharpDx demos | Silverlight and other cool things …

  2. Pingback: Windows 8 Developer Links – 2012-07-24Dan Rigby | Dan Rigby

  3. I connected an accelerometer to Win8 (using an embedded system) and was able to use your sample as the demonstration UI:
    http://gotoloop.wordpress.com/2012/08/06/adding-an-accelerometer-to-the-windows-8-simulator/

    Thanks for the samples. That really helped.

    • very cool demo yourself, just checking yours out now.. Im so excited about all these new mutisensor/gesture apps that we can now create easily with WinRT .. will tweet you demo…

      thx

  4. Great job !!

    Very exciting stuff.

  5. The download button dont work. Could you fix it or leave here the download link please? Thanks

  6. Hi, I tryed your demo on the last windows 8 x64 rtm and when i try to open an examples from the main panel the app crashes. Any easy solution to fix it or could you update the code to don’t crash? Thanks

  7. Insanely great Work. Where can I find the code for the radial control? It’s amazing! :-)

  8. Sorry guys … the demo code has been updated and should compile/run on Win8 final (RTM 9200)

  9. Some demos don’t work for me :( I’m RTM on everything, download the samples, upgrade the references so that it uses SQLite 3.7.14. Then, I successfully build but several demos are not running. For instance, the “Custom” throws a “SharpDXException” at _pixelateEffect.SetValue((int)PixelateEffect.PixelateProperties.HorizontalPixelCounts, 400f);
    with a message HRESULT: [0x80004001], Module: [Unknown], ApiCode: [Unknown/Unknown], Message: Not implemented
    the “Bursting Circles” throws a Incorrect Parameter here: sampler = new SamplerState(d3dDevice, new SamplerStateDescription()

    the “Icon Wall” throws a incorrect parameter on Spritebatch.cs here: m_sampler = new SamplerState(d3dDevice, new SamplerStateDescription()

    Some others, such as Interpolation Modes, Ribbon and Data Entry work fine. Any hints?

  10. I think I found what’s (probably) wrong, we’re using different SharpDX versions probably… I updated CommonDX to the latest one from SharpDX website samples, and downloaded via Nuget the latest SharpDX packages. Now I see errors during build such as

    Error 304 ‘SharpDX.WIC.GifBitmapDecoder’ does not contain a constructor that takes 4 arguments C:\Users\Dimitris-Ilias\Desktop\SumoNinjaMonkey\trunk\Apps\Sandbox\Libraries\DxRenderer.AnimatedGIF.cs 123 58 Sandbox

    Error 309 ‘SharpDX.Direct2D1.D2D1′ is inaccessible due to its protection level C:\Users\Dimitris-Ilias\Desktop\SumoNinjaMonkey\trunk\Apps\Sandbox\Libraries\DxRenderer.InterpolationModes.cs 450 13 Sandbox

    Error 313 Operator ‘*’ cannot be applied to operands of type ‘SharpDX.Matrix3x2′ and ‘SharpDX.Matrix3x2′ C:\Users\Dimitris-Ilias\Desktop\SumoNinjaMonkey\trunk\Apps\Sandbox\Libraries\DxRenderer.InterpolationModes.cs 374 41 Sandbox

    Error 317 ‘CommonDX.MediaPlayer’ does not contain a definition for ‘SetBytestream’ and no extension method ‘SetBytestream’ accepting a first argument of type ‘CommonDX.MediaPlayer’ could be found (are you missing a using directive or an assembly reference?) C:\Users\Dimitris-Ilias\Desktop\SumoNinjaMonkey\trunk\Apps\Sandbox\Libraries\DxRenderer.Firework.cs 345 30 Sandbox

  11. Yeah unfortunately I have my own branch of SharpDx that I maintain with my own bits … I’ll upload the latest demo code with latest dll bits from SharpDx

  12. @Jose, you should really take some time to log issues on SharpDX google code instead of modifying the code only on your side. This is confusing for people that are trying your samples and that also doesn’t help SharpDX. ;)

  13. Thanks for the cool demos.

    Would it be possible to post a version of the Lighting Effect that works with the latest release of SharpDX and the final release of Windows 8. The other samples work for me but this one doesn’t and I would really like to use it in a project of mine.

    Thanks.

  14. Whew!.. thanks for the 3-Axis Grid demo… I really wish SharpDX had better examples / samples in their documentation!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s