SF CC Award 2009

MediaPortal is nominated for 'Best Project for Multimedia' at the Sourceforge Community Choice Awards ! Dont forget to place your vote for us now!



Login Form



Awards

opcz_testsieger





Home arrow Blogs arrow Designing an opensource WPF engine
Designing an opensource WPF engine
Written by Akioika, on 02-01-2008

If you have read the news on the homepage you know i'm busy implementing an opensource WPF engine, which we will use in MediaPortal

Since the post i've got lots of questions, so i'll try to answer some of those here and give some more insight in the current state of the WPF engine


click here to read the full article

q1:Why implement an opensource WPF engine, and not use WPF itself ?
The reason i'm implementing my own WPF engine is that we simply run into problems which we cannot fix since Microsoft's WPF is closed source


q2:Are you reverse engineering WPF using tools like reflector ?
No.  Microsofts code is copyright so we cannot use reflector to 'copy' their code. Besides that, if you use reflector you will see that all the interesting WPF parts are implemented in native code (milcore.dll) so its impossible to read let alone copy those parts

q3:How compatible will the new WPF engine be with Microsofts xaml ?
We're aiming at 100% compatibility. At the moment our WPF engine can read & parse files which are 99% the same as Microsofts xaml
By aiming at 100% people will be able to use all xaml tools available like for example Microsoft Expression blend

q4:Will the new WPF engine support everything of WPF ?
Probably not. The reason is that we dont need all the stuff WPF provides in MediaPortal. But since its opensource we can always add 'missing' things later on.

Current state:

The last couple of weeks we made really nice progress. We're now at a point where we can parse & render most xaml files.
Things like events, storyboards, resources, shapes, buttons etc all work
Our next big tasks consist of adding (data)binding support and some more advanced controls like the listview & treeview

Here's a screenshot which shows the use of:
- styled buttons,
- panels like StackPanel, GridPanel and Canvas
- RadialGradientBrush & LinearGradientBrush
- Storyboard & events & triggers
- Shapes like Path, Polygon, Rectangle and Ellipse

Screenshot:

Since this is a screenshot, you wont see the animations :-(

xaml2.gif


And if you are interested in the .xaml files used to render this you can take a look in SVN here

XAML used:

The xaml file:   test.xml
The resource file xamlstyle.xml

the main xaml file looks like:
<?xml version="1.0" encoding="utf-8"?>
<MyXaml >
  <StackPanel Width="260" Background="Yellow">
    <StackPanel.Resources>
      <ResourceDictionary Source="XamlStyle.xml"/>
    </StackPanel.Resources>
    <Button Name="btn1" Width="200" Height="32"
        Style="{StaticResource MpButton}">hallo</Button>
    <Grid Width="128" Height="128">
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition  Width="Auto"/>
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
      </Grid.RowDefinitions>
      <Button Grid.Row="0" Grid.Column="0"
           Style="{StaticResource MpArrowButtonLeft}"/>
      <Button Grid.Row="0" Grid.Column="1"
           Style="{StaticResource MpArrowButtonRight}"/>
      <Button Grid.Row="1" Grid.Column="0"
           Style="{StaticResource MpArrowButtonDown}"/>
      <Button Grid.Row="1" Grid.Column="1"
           Style="{StaticResource MpArrowButtonUp}"/>
    </Grid>
    <CheckBox Width="200" Height="32" Style="{StaticResource MpCheckBox}"/>
    <CheckBox Width="200" Height="32" Style="{StaticResource MpRadioButton}"/>
    <Button Width="200" Height="32" Style="{StaticResource MpCloseButton}"/>
    <CheckBox Width="32" Height="32"  Style="{StaticResource MpPlusMinButton}"/>
    <Rectangle Width="200" Height="32" Margin="0,10,0,10"
          StrokeThickness="2" Stroke="Red" Fill="Blue"/>
    <Ellipse Width="200" Height="32" Margin="0,10,0,10" 
          StrokeThickness="2" Stroke="Red" Fill="Blue" />
    <Polygon  Stroke="Red" Fill="Blue" Margin="0,10,0,10"
          StrokeThickness="2" Points="0,0 30,0 60,30 60,60 30,60 0,30"/>
    <Path Stroke="Red" Stretch="Fill"  Fill="Blue" StrokeThickness="2"
       Width="41" Height="25" Data="M21.515036,0.10254623
       C33.858738,0.47503549   41.915491,7.5945522 43.263354,18.631958
       36.818281,25.975738 4.5835854,25.755277 0.75664204,18.690969
       1.592944,8.1747201 9.8216492,0.58923798 21.515036,0.10254623 z"/>
  </StackPanel>
</MyXaml>



Testing yourself:

If you want you can play with the current WPF engine.
Todo this you will  need to get the sourcecode from SVN and compile MP-II yourself. So.. this is for developers only

The WPF engine is disabled by default since its work-in-progress.
To enable it, open up skinengine/WindowManagement/window.cs
and un-comment the first line so it looks like:
#define TESTXAML


Now compile MP-II (make sure to set the platform from Any Cpu to x86)
and run it.. Mp-II will now open & render the skin/default/test.xml
which will show the above picture.



Frodo
Users' Comments (3) RSS feed comment
Posted by Michael, on 22-05-2008, , Guest
1. Doing everything on your own !?
I assume you know that XAML (with all it's data binding, etc.) is completely apart from WPF.You don't need to implement your own XAML to put a WPF engine on top of it.Even most WPF classes are GUI-Less.This is even true for controls like TreeViews which are composed of low level elements, so if you wanted to render everything by your own,you would only have to provide a style to the control which doesn't use WPF but your own engine - no need to re-implement everything. 
BTW: The new 3.5 SP1 Framework allows to directly integrate direct3D content into WPF - may this fix your original problem?
 
» Reply to this comment...

Posted by impaler, on 22-06-2008, , Registered
2. Animations?
This looks very impressive, from what you are saying there might be a way to use pre-rendered movies as transitions for parts of the interface. This opens a whole new world of design for skin artists. 
 
Best of luck with it all people!
 
» Reply to this comment...

Posted by Mike C, on 05-11-2008, , Guest
3. Media Player in WPF
Hi, 
 
It is interesting, but an Open source Media Player exist and it is based on WPF. 
 
Check the web sites : 
http://www.viewon.tv 
http://www.codeplex.com/ viewontv
 
» Reply to this comment...

Add your comment



mXcomment 1.0.5 © 2007-2009 - visualclinic.fr
License Creative Commons - Some rights reserved
Last Updated ( Wednesday, 02 January 2008 )
 






Status Overview

MediaPortal 1:
- Version: 1.0.2
- Status: in development
TV-Server:
- Version: 1.0.2
- Status: in development
MediaPortal 2:
- Version: tech-demo
- Status: in development
Changelogs:
- MediaPortal 
- TV-Server
- Installer - DeployTool
Roadmaps:
- MediaPortal
- TV-Server
- Installer - DeployTool 

New Plugins/Skins

Jul.04 pm3sexy
Jul.03 Polskastacja playlist
Jul.02 Blue3 Lite
Jul.02 Blue3wide Lite
Jul.02 One Button Music

MediaPortal supports tv-cards from  

  • Digital Everywhere
  • Hauppauge
  • AVerMedia
  • Pinnacle
  • Technotrend
  • Twinhan
  • KNC One
  • Technisat
  • Dvico
  • FlyTV
  • and many more
MediaPortal, your digital video recorder - 2008 media center computer