digitalnetbizz's WebLog : WPF

Given a point, how to get the element at that coordinate?

digitalnetbizz — Thu, 30 Aug 2007 20:02:00 GMT

UIElement.InputHitTest is a hidden function that could do just that,

public IInputElement InputHitTest (
Point point
)

Passing in the coordinate, and this function will look at the element subtree and get the element (IInputElement because it's a common interface between ContentElement and UIElement) that is at that location.

GetPointAtFractionLength

digitalnetbizz — Thu, 05 Apr 2007 08:33:00 GMT

This is such a cool API, this is one sample usage (ie. Drawing a clock). I could see things like manually tracing a PathGeometry which could contain complex Bezier segments.

double len = 0d;
Point pt, ptTan;
EllipseGeometry geo = new EllipseGeometry(new Point(50, 50), 50, 50);
PathGeometry pathGeo = geo.GetFlattenedPathGeometry();

for (int c = 0; c < 12; ++c)
{
    len += (double)(1 / 12d);
    pathGeo.GetPointAtFractionLength(len, out pt, out ptTan);
    Rectangle rect = new Rectangle();
    rect.Height = rect.Width = 2;
    rect.Fill = Brushes.Red;
    this.mainCanvas.Children.Add(rect);

    Canvas.SetTop(rect, pt.Y);
    Canvas.SetLeft(rect, pt.X);
}

PresentationSource

digitalnetbizz — Sat, 10 Mar 2007 06:16:00 GMT

System.Windows.PresentationSource

PresentationSource is such a useful class after digging deeper into it. I’ve use it from time to time and looking at its members, I can see more use of it in the future.

The purpose of PresentationSource is to handle interop scenarios. To begin using this, anytime you want to call into User32.dll, you need a HWND.

Then you need this to get hwnd:
IntPtr hwnd = ((HwndSource)PresentationSource.FromVisual(uielement)).Handle;

You can do a ton of work from a hwnd itself like calling SetWindowLong, SetParent, SetWindowRegion and hundreds more etc..

Next cool function of PresentationSource is to get HwndSource so that you can call AddHook which allows you to subclass by providing your own WndProc.

HwndSource hwndSource = PresentationSource.FromVisual(window) as HwndSource;

hwndSource.AddHook(…);

Then you can use PresentationSource to determined, if an element is rendered. If so it must be connected to PresentationSource.

PresentationSource.FromVisual(uielement); will return a PresentationSource object if connected, null otherwise.

PresentationSource.FromVisual(uielement).RootVisual is an alternate way to get to your Root UI like a Window without walking up the visual tree.

You can use PresentationSource.AddSourceChangedHandler to determined when the element are disconnected from it’s Parent.

Finally, you can also get CompositionTarget which is another cool class by presentationSource.CompositionTarget. By using CompositionTarget, you can do stuffs like this but don’t over-do it cause it’s expensive in performance. CompositionTarget.Rendering is an alternate way to get high fidelity (animation class) rendering. Here a summary of CompositionTarget.Rendering.

The CompositionTarget.Rendering event is fired when the animation system finishes applying animation related changes. The updated display information is then handed off to the rendering engine, which evaluates how many times per-second it can redisplay based on scene complexity and other factors. Depending on that, it may decide to skip a particular frame produced by the animation system. Putting it another way, the draw rate can easily be different from the rate of the CompositionTarget.Rendering events.

Get notification from WPF dependency system

digitalnetbizz — Thu, 08 Feb 2007 11:10:00 GMT

This is valuable information on hooking into DP system of WPF.

The answer is DependencyPropertyDescriptor. This is similar to PropertyDescriptor from WinForm.

http://msdn2.microsoft.com/en-us/library/system.componentmodel.dependencypropertydescriptor_members.aspx

For example, if you want to get notification whenever a property change but you don't own the code and you don't derive from the class and it does not expose SomethingChanged event. How can you get notification.

DependencyPropertyDescriptor dpDes = DependencyPropertyDescriptor.FromProperty(Control.BackgroundProperty);
dpDes.AddValueChanged(myElement, myEventHandler);

So whenever someone do a SetValue/ResetValue/ClearValue on myElement.Background, myEventHandler will be raised. When you are done listening to change notification, you can do RemoveValueChanged(..) to unsubscribe.

BenCon was talking about this as well :-)

Hmmm... WPF popup is always TOP_MOST

digitalnetbizz — Fri, 12 Jan 2007 06:05:00 GMT

Recently I have this bug inherited from my good intern that WPF <Popup/> will always be TOP_MOST in terms of z-index. The bug scenario is that when you have another application (eg. notepad.exe) going on top of my WPF application (with Popup launched), Popup will be top most even though notepad appears on top of my app. So to fix this, I'm using some old Win32 tricks :-)

[DllImport("user32", EntryPoint = "SetWindowPos")]
private static extern int SetWindowPos(IntPtr hwnd, int hwndInsertAfter, int x, int y, int cx, int cy, int wFlags);

public class MyPopup : Popup
{
...
  protected override void OnOpened(EventArgs e)
  {
    IntPtr hwnd = ((HwndSource)PresentationSource.FromVisual(this.Child)).Handle;
    SetWindowPos(hwnd, -2, posX, posY, (int)this.Width, (int)this.Height, 0);
  }
}

My WPF Hobby project for 2006 "Portfolio Delta"... a little late.

digitalnetbizz — Tue, 09 Jan 2007 20:49:00 GMT

It's been sometime since I last post here. This site even come with a new blog software. Very nice.

Every year during my OOF days, I worked on some hobby project that I will be using. Last year, I was doing a Stock reader for my own consumption. It comes with loads of features. Mostly for my personal use, to track my position at a given time, watch list for funds, stock to look out. Other features includes charting, per stock detail news, RSS viewer for financial/stock news, RSS player for financial/stock podcast, auto-complete for stock quote, streaming quotes, 4 viewing modes and a few more. It's still on-going because I am using this tool from time to time + I have 3 beta users to give me feedback :-)

This is done with the VS template for WPF. Total serious dev time is about 6 days. Developed for Microsoft Windows Vista plaform, it takes about 20MB. Can be deploy via xcopy or clickonce. Haven't experiment with browser inline hosting via IFRAME. Will test that next.

Still a few features to add in like sorting via column header, writing a chart chooser with nice effects etc..

1 line XAML challenge and Popup ....

digitalnetbizz — Sat, 19 Aug 2006 09:37:00 GMT

I saw Tim's challenge and thought about some interesting single element XAML. One of my markup which I thought will cover the whole screen does not do that anymore, it just covers about 80% of the screen MAX. I remember going thru the threat modeling and having Markup injection like this a concern. The following markup definitely covers the whole screen 12 months ago - and my application is running full-trust.

<Popup IsOpen="true" StaysOpen="true" Placement="Absolute" HorizontalOffset="0" VerticalOffset="0"
xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="2000" Height="2000"/>

This is all good, just signs that WPF is wrapping up and ready to ship :-).

Tiling with VisualBrush - WPF Beta 2

digitalnetbizz — Tue, 20 Jun 2006 10:17:00 GMT

It has been a while since I last blog about WPF (Avalon) related work. Well, here’s some updates on something I tried recently. I have some requirement lately to implement some GridLines for Diagrams. I first try to use OnRender and doing DrawLine inside of OnRender. I found that this is somehow slow when I have many shapes and lines around it.

So I want something similar to DrawLine and try setting Background property to a VisualBrush. XAML as follow:

And this will look like:

I found that this perform better than OnRender, this is solely based on my moving of many lines and shapes around the diagram. Of course this is not cheap either, a Visual is basically equivalent to an UIElement. So you can essentially do this:

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:sys="clr-namespace:System;assembly=mscorlib" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > <Grid>
<Grid.Background>
    <VisualBrush TileMode="Tile" Viewport="0,0,20,20" ViewportUnits="Absolute" Viewbox="0,0,20,20"
ViewboxUnits="Absolute">
          <VisualBrush.Visual>
                <Button/>
           </VisualBrush.Visual>
      </VisualBrush>
</Grid.Background>
</Grid>
</Page>

The above XAML will tile what it seems a bunch of Button. But in reality only 1 Button object is created then casting to Visual and repeat the same bits across the Grid as background. Of course you can also compose deeper XAML tree for the VisualBrush but according the PERF guidance document at www.designerslove.net/docs/ Optimizing%20Performance%20in%20the%20Windows%20Presentation%20Foundation.doc

If you are in Software Rendering Mode, either 16 bits, Hardware Acceleration turned off or using older graphics card (support DX7 and lower) then tiling can be very expensive. If your card supports DX9, you should be fine and running Hardware Acceleration unless you are trying to tile 3d rotating objects as background then it really depends on how much VRAM you have J.

The other thing to note about Visuals in VisualBrush is that there don’t have hittesting, no events, no focus and purely serve as an image to the Background. Finally remember to set TileMode property to Tile to enable tiling.

Calendar Printing Assistant for Outlook 2007

digitalnetbizz — Tue, 20 Jun 2006 07:54:00 GMT

If you have access to Microsoft Office 2007 Beta2, check out this new office program:
http://www.microsoft.com/office/preview/programs/outlook/cpa.mspx

This software has dependency on Windows Presentation Framework Beta 2 (codename: Avalon) and of course Office 2007 Beta2. This software also utilize the rendering/style power of WPF.

This program allows you to use additional template for your Outlook appointments and data. This allows you to create view like this and more:

A Collection of useful Avalon tutorial

digitalnetbizz — Sun, 06 Nov 2005 11:43:00 GMT

While researching for information about Avalon [for play-n-learn sample app], I realized that I'm always going back to the same site/blog over and over again. I thought it is nice to just compile a list of information that I'm always using from time to time so that other users of Avalon can make find this easily. I can definately use all these information until more WPF books in the pipeline.

A Collection of useful WPF Avalon tutorial/info [:)]

Intro to WPF
Introduction to WPF

PDC 2005Webcast
Streaming Site [many sessions within]

Avalon 3d [some math/physics required :)]
Halfbrite
kindohm.com Avalon 3D tutorial
karstenj's blog
Andrej's blog

Avalon Core concepts [must read !!!]
Ian's Graphical Composition in Avalon [why Avalon diff from Win32]
Avalon Dissected Part 1 Part 2
Joe Beda on Avalon Visuals [old but good]
Avalon and hwnd
Understanding DependencyObject, DepedencyProperty
Logical and Visual Tree
Avalon Threading

Avalon Media / MIL
Basics
Greg Schechter's Blog
VisualBrush
Avalon Brushes

Avalon Data Binding [code bloat -> compact]
Chris Sells MSDN Data Binding #1 #2 #3
Beatriz's Data Binding Blog
joemarini.com
Multicolumn Listbox binding
Namita's WPF blog

Avalon Controls
Avalon Content Model
Kevin Moore's blog

Avalon Layout System [don't think you can build WPF app without this]
Authoring a custom layout in Avalon
RenderTransform and LayoutTransform

Avalon Inputs
Input, Commands and handlers

Avalon Performance [make it slim and fast]
Avalon Performance Whitepaper
mmielke's blog

Avalon Property System
Properties, Commands and Events
Attached Property
Property order precedence

Text/Typography/Document and Decorators
Fortes Work

Design [inspiration]
notstatic.com
nathan's blog
rdawson's blog

XAML [the syntax]
Rob Relyea xaml:Blog
Inside XAML [old syntax, concept ok]
Comparing XAML with CSS2 [ great for web dev]
Handling Resource in WPF [every app needs resource !!]

Avalon Styles [used to be VisualTree]
Styles and Control Templates sample chapter

Cool WPF Apps
WinFX Hearts [creator]
Microsoft Max
Microsoft Expression
Calendar Printing Assistant for Outlook 2007 [updated]

Experimental US weather service exposed via XML web service

digitalnetbizz — Thu, 03 Nov 2005 18:32:00 GMT

Found out yesterday that this information is available. I'm adding to my sample app (virtual earth) to enrich user experience.

For more information, refer to National Oceanic and Atmospheric Administration:

http://www.weather.gov/xml/

New and improved Nntp [dude] for Avalon March CTP ...

digitalnetbizz — Mon, 28 Mar 2005 06:57:00 GMT

I read Chris Sell’s blog and found out that the new Avalon CTP is available to public. As a member of the public I was too excited and decided to download and play with the CTP, CLR beta 2 and Visual C# Express. I was a bit worried as I have all kinds of VS installations, Avalon and CLR bits on my laptop. Following the advice from the download page, I managed to get everything working together very quick [be sure to do some reboots].

I need to dev something with it so I decided to revive my NNTP dude sample which definitely won’t work with current build (when I compiled the project I got almost ½ the source code lines giving error) and needed to screen redo. If you have looked at the source code before, it is all done programmatically in C#, nothing fancy.

I decided to only use my old Nntp library and redo all the UI with XAML. The original Avalon part of source code is 1124 lines. With my new code I am getting more with:

118 lines of XAML

250 lines of C# code for partial class event handling and init.

Wow, that’s a lot of reduction. Definitely increase productivity and making my whole UI more flexible to change. I can’t imagine changing some of my view in the old C# code but now I’ve already change a view Visual Styling and all done declaratively.

New NNTP dude Screenshot

I still like 2d vector graphics as you can see. I am learning 3d elements and hopefully can utilize them next time. I felt that 3d is only for presentation like charting and special transitions [this is my personal opinion].

The one problem I faced with all these downloads (VC# express) is that it cannot start a Avalon/XAML project [maybe just me :-(]. What I did is to download a cool AvPad sample from ChrisAn’s SimpleGeek site [downloading this source code is highly recommended, be sure to look at his MyApp.xaml] and modify that csproj and get it launched with VC# express. This samples I got there comes with some very exciting styles and I reuse some of them. Also, this project is my reference to some new XAML syntax.

With just 10-12 hours (the last time was 3-4 days), I managed to get my Nntp app revived (with all XAML syntax). I did use some GDI calls to make my app look as like Windows Media Player (custom geometry clipping).

internal static void MakeIrregularWindow(Window win)

{

WindowInteropHelper interopWin = new WindowInteropHelper(win);

int handleRegion = CreateRoundRectRgn(0, 0,

AppWidth,AppHeight,AppRadius,AppRadius);

SetWindowRgn(interopWin.Handle, handleRegion, true);

}

Don’t get me wrong, I like default Windows Styles/Themes. Just that I want to expose more of Avalon flexibility and Styling capabilities in my sample App.

Most of my Xaml code goes to defining the layout and having some custom ItemStyle and VisualTree to make things look good. Setting ItemsSource in event handlers. I did have an inline Master-Detail list which I define a ListBox having another ListBox in the VisualTree – which I thought is cool.

I really like to share my project files but I can’t do that as I don’t have external website to host a .zip file [any recommendation?]. I am use MSN Spaces to store my screen shot image.

I might blog more and dissecting the XAML in my sample and explaining my findings when I have time next week.

- Kenny

Content is provided "AS IS" with no warranties, and confers no rights.

Avalon DrawingContext ...

digitalnetbizz — Fri, 11 Jun 2004 07:11:00 GMT

DrawingContext is Avalon's equivalent of hdc (handle to device context) in Win32 programming or Graphics in GDI+. It provides us with low level calls to render/draw on the surface (screen/print/other visuals).

Here's a list of useful draw method in DrawingContext:

1. DrawDrawing
2. DrawEllipse
3. DrawGeometry
4. DrawGlyphs
5. DrawImage
6. DrawLine
7. DrawRectangle
8. DrawRoundedRectangle
9. DrawSubLineCollection
10. DrawText
11. DrawVideo

Most of the time, DrawingContext will be used within Render(DrawingContext dc). This is a method that custom control can override and do customize drawing. Render() will be invoked whenever the screen area is dirty. You can also imagine that certain controls like Image will make use of DrawImage, while Typography uses DrawGlyphs/DrawText and Border will use DrawRectangle. It's really up to your imagination to mix and match these capabilities to come out with something slick.

DrawVideo is definitely something fresh considering we are looking at the equivalent of HDC. IMO, this shows that Avalon is really making it easier and easier for UI developer like me :).

Finally, Transform, Clip and Opacity are also controllable from this class. What a powerful class!!!

Avalon Property Invalidation

digitalnetbizz — Mon, 15 Mar 2004 05:56:00 GMT

If you are writing custom control. You sometimes need to know if your property change so that you
can do something about it. For example, your control is CustomControl and have Size property.
If the Size property change, you need to Invalidate Measure so that it will go back and call your
MeasureCore() again.

For those who are new to writing control. MeasureCore is one of the method that you can override to add your custom measurement code. Other than MeasureCore, there are ArrangeCore, EnsureVisuals, Render and a whole a list of other overrides. The method will be invoked in this sequence:

OnPropertyInvalidated
EnsureVisuals
MeasureCore
ArrangeCore
Render

Back to Property Invalidation. Recently I found out that there are 2 ways to receive notification when your property change. There are as follow:

1. Do it in OnPropertyInvalidated override“

protected override void OnPropertyInvalidated
   (MSAvalon.Windows.DependencyProperty dp,
    MSAvalon.Windows.PropertyMetadata metadata)
{
// dp can be null, when invalidate all.
if(dp != null)
    if(dp.Name == "Size")
    {
      // ok - this means my Size property is changed.
      // in my case, I want to do MeasureCore again.
      // you can do other stuff like InvalidateRender etc..
      if(this.oldSize != this.Size)
         this.InvalidateMeasure();
    }
}

2. Register for propertyInvalidatedCallback when you register your Property:

public static readonly DependencyProperty SizeProperty =
DependencyProperty.RegisterAttached("Size", typeof(int),
typeof(CustomControl),
new FrameworkPropertyMetadata(0, false, SysWindows.MetadataFlags.None,
new PropertyInvalidatedCallback(OnSizeInvalidated), null));

In the event when Size property is changed, your callback method "OnSizeInvalidated" will be invoked.

You can use the FrameworkPropertyMetadata class to control what will this property affect. For example, the following FrameworkPropertyMetadata will tell the subsystem that when this property change, it will affect the measurement and this will ensure MeasureCore to be invoked.

FrameworkPropertyMetadata(null, false, MetadataFlags.AffectsMeasure, null, null)

There are other richer MetadataFlags, that allow you to control other things like when this property change,it will affect my parent's Arrange. This is definitely a class to explore.

Avalon webcast ...

digitalnetbizz — Thu, 29 Jan 2004 08:06:00 GMT

Excellent Avalon/WinFX information (slides, webcasts + source code) from PDC2003 available online right now at MSDN.