VB Central community talk on WPF

Last Wednesday VB Central held another meeting at the pitoresque venue of Oosterkamp Training in Doorn, The Netherlands. The evening started of with Jacqueline van der Holst (senior developer at Avanade). She made her first public appearance with a talk on Linq. I think she did an excellent job covering Linq, given that Linq is a pretty hard and complex topic to learn, let alone talk about.

After the break I answered 5 common questions on Windows Presentation Foundation:

  1. Why?
  2. Is it difficult?
  3. XAML?
  4. Windows or Web?
  5. WPF/e?

As always I put everyone’s patience to the test by going a good half hour over my alotted time of 1 hour 15 minutes. I had the impressions everyone was enjoying the things they were hearing about WPF. Thanks again for sitting it out.

The slidedeck and demos are available from here, here and on VB Central. Jacqueline’s slides should be up there as well.

The demo featured a +/- 40 line demo of XAML that showed it all:

  • XAML syntax (property-element syntax, attached properties, markup extensions and so on)
  • layout (panels and grids)
  • resources (page and application level)
  • styling
  • templating (control templates, itempanel templates and datatemplates)
  • data binding
  • calling into CLR objects from XAML
  • typography
  • events (although I did not show this during the presentation)

I tried to squeeze in as much as possible. The end result, albeit simple in visuals, is shown as a Internet Explorer XBAP in the picture below.

Edwin Jongsma (also from Avanade) even challenged me to do a reflection of the whole button. I believe I did get close, but missed the Rectangle.Fill (stupid, stupid). Just to prove that it is easy, here is the completed result. A little more than the five lines of XAML I mentioned (those were just the Rectangle with a VisualBrush as the Fill), but this one has a transformation and opacity mask.

    <Button Grid.Row=0 Content=Quick &amp; Effective WPF

            Width=320 Height=150 HorizontalContentAlignment=Center

            Style={StaticResource Style1} x:Name=Button1>

      <Button.Template>

        <ControlTemplate TargetType={x:Type Button}>

          <StackPanel>

            <Image Source=class-a.jpg x:Name=image ></Image>

            <ContentPresenter />

          </StackPanel>

        </ControlTemplate>

      </Button.Template>

    </Button>

    <Rectangle Width=320 Height=150 Grid.Row=1>

      <Rectangle.Fill>

        <VisualBrush Visual={Binding ElementName=Button1}>

          <VisualBrush.Transform>

            <TransformGroup>

              <ScaleTransform ScaleY=-1 />

              <TranslateTransform Y=160 />

            </TransformGroup>

          </VisualBrush.Transform>

        </VisualBrush>

      </Rectangle.Fill>

      <Rectangle.OpacityMask>

        <LinearGradientBrush StartPoint=0,0 EndPoint=0,1>

          <GradientStop Color=Black Offset=0 />

          <GradientStop Color=Transparent Offset=1 />

        </LinearGradientBrush>

      </Rectangle.OpacityMask>

    </Rectangle>

 The fragment also shows the source of the Button control, but does not list the Style1 that is used. The bold part is the new code for the challenge.

Advertisements
This entry was posted in Uncategorized. Bookmark the permalink.

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s