Posts

  • Building a tree diagram in D3.js

    In the past few weeks, I have spent some time evaluating some visualization frameworks in Javascript. The most prominents ones include: Javascript InfoVis Tookit, D3 and Protovis. Each of them is feature rich and provides a varieties of configurable layouts. In particular I was impressed with D3 as it gives a nice balance of features and flexibility and allowed me to build just the visualizations I wanted. In this post, I want to take a quick dive into using D3 for building a tree diagram.

    image

    Continue reading...

  • Complex filtering in isotope.js

    Of late, I have been building some Html/Javascript apps and exploring a bunch of javascript libraries, including the usual suspects (jQuery, jQuery UI, jQuery template, underscore, etc). The more interesting ones are visualization libraries like d3, isotope, highcharts. In this post, I will focus on a specific scenario in the isotope.js library.

    Continue reading...

  • Blinking UI with a CaretBrush

    A few days back while I was busy designing some UI for a Silverlight app, I accidentally hit upon this fun hack.

    image

    Continue reading...

  • Its Consulting time!

    After having worked full-time for several years in the Corporate world, I have decided to make a career change and jump on to Consulting. I have joined my friends at
    image , where I’ll be working in the Financial district of New York, building solutions using Microsoft .Net, C\#, WPF, Silverlight, Html5 + JavaScript and others.

    Continue reading...

  • Building a CoverFlow visualization using Quartz Composer

    I have been playing around with Quartz Composer (included as part of the Developer tools installation on Mac OSX) for almost a year. It’s a great tool for creating screen savers, music visualizations and also for quick prototyping of some visual concepts. I personally find the patch-based approach to solving problems quite refreshing and offers a different perspective to looking at complex problems. It is very much like programming but with functional blocks (called patches) rather than real code.

    Continue reading...

  • Tokenizing control – convert text to tokens

    In this post I want to talk about some interesting ideas regarding a control called TokenizingControl? What is that you may ask, so lets start with the basics. A Tokenizing control takes in some text, delimited by some character and converts that text to a token, a token that is represented by some UI element other than the original text. For example, if you have text like “John Doe;” (note the ; acting as delimiter), then the tokenizing control will convert it to some UI Element like a Button, say.

    image

    Continue reading...

  • A DoubleBorderDecorator to simplify rounded-border decorations

    The designers in my team use a lot of nested double-Border elements to achieve a nice rounded border-effect around containers. In XAML this looks like so:

     1 <Border Background="#FF414141"
     2         Padding="3"
     3         Width="300"
     4         Height="200"
     5         CornerRadius="8">
     6     <Border Padding="3"
     7             CornerRadius="8">
     8         <Border.Background>
     9             <LinearGradientBrush EndPoint="0.5,1"
    10                                  StartPoint="0.5,0">
    11                 <GradientStop Color="#FF910000"
    12                               Offset="1" />
    13                 <GradientStop Color="#FFAF5959" />
    14             </LinearGradientBrush>
    15         </Border.Background>
    16     </Border>
    17 </Border>
    18 	
    
    image

    Continue reading...

  • Simple TriggerAction for docking using GridSplitters

    GridSplitters work great if you want to provide a split view between two views. By dragging the GridSplitter you can adjust the space allocated to each view. As one view grows in size, the other reduces by the same size. For most cases, this is exactly what is required. In my case, this wasn’t enough. In addition to adjusting the splitter, I also wanted a way to quickly collapse one view and allocate all the space to the other view (a.k.a. Docking). The views were arranged horizontally like so:

    image

    Continue reading...

  • The SpiderWebControl for Silverlight

    image

    Continue reading...

  • Quick tip about changing SketchFlow’s startup page name (Silverlight)

    When working in SketchFlow for SilverLight 3, the default file name of the test page is called TestPage.html. If this is not what you want, you can easily change it in the main SketchFlow project’s .csproj file. If you open up the <project-name\>.csproj file, at around line 27, you should see a tag called <TestPageFileName>. Change this to the filename you want. In my case I wanted index.html since I was hosting the prototypes on the intranet and wanted a simple url like

    http://sketch/

    Continue reading...

  • Chapter Excerpt in CODE magazine

    I received a mail from my publisher stating that one of the chapters from my book: WPF Control Development Unleashed, has been published as an article in the CODE magazine. Go have a look.

    Continue reading...

  • PyBinding now hosted on CodePlex

    Almost a year back, I posted about an interesting project I was involved in, called PyBinding. PyBinding gives you an easy way to write IronPython snippets inside Xaml Bindings and completely do away with value converters.

    Continue reading...

  • Sketching, painting and Figure drawing

    image

    On my recent vacation trip to India, I had some time to get back to my old hobby of sketching and painting. A hobby that I discontinued back in 2009. In fact I missed it so much that the feel of getting back to pencil and paper was great. Photoshop and Illustrator can definitely help you make some great illustrations but nothing can substitute the pure joy of using simple materials for drawing.

    Continue reading...

  • Bug fix in the sample on Virtualization in WPF Control Development Unleashed

    I recently received a mail from Marshall Price, one of the readers of my book WPF Control Development Unleashed, pointing at a bug in the sample from Chapter 8 (Virtualization). He had made some changes to the sample code in order to delete items from the StaggeredPanel. This caused a crash in the virtualized panel.

    Continue reading...

  • WPF Control development Unleashed, now in F#

    Wondering what would it look like if you built WPF controls using F# ? If yes, head over to Matt’s blog where he has translated almost all of the examples in my book WPF Control Development Unleashed to F# ! He is even starting a CodePlex project to host the source code.

    Kudos to Matt for starting the effort.

    Continue reading...

  • A panel that scrolls about a half-circle

    This post is inspired by an interesting idea sent by Bo Stilling, one of the readers of my book. It combines the ideas discussed in Chapter 4 “Custom Panels” and Chapter 7 “IScrollInfo” to create a panel that lays out the items about a half-circle. When you scroll the panel, the items move about a half-circle. I thought that was interesting because generally when you scroll, the items always move vertically up/down. This panel creates a distortion that makes the items move about a circle, as in the following figure:

    image

    Continue reading...

  • “WPF Control Development Unleashed” has been published

    The book is finally out. Go get your copy and start building some advanced controls ! Happy WPF Control programming! Amazon link
  • Creating a 3D logo from an image using Cinema 4D

    I have always enjoyed 3D modeling. The kind of tools you use and kind of thinking that is required is so different than my everyday job of writing code. That shift in mindset is quite challenging and also exciting. In fact, the only reason I keep coming back to 3D modeling is for this aspect: the shift in thinking! Of all the 3D modeling tools I’ve used so far, I like Cinema 4D (C4D), for its ease of use and the speed with which I can bring my ideas to life. Once past the initial learning curve, it is really refreshing and relaxing.

    Continue reading...

  • Source code for “WPF Control Development Unleashed”

    The website for my upcoming book is finally online, which also means the Source code is available for download ! Without further ado, here is the link to the website:

    Untitled-2

    Continue reading...

  • Source code of Simple 3D Engine, now part of FluidKit

    After much prodding from friends and readers of this blog, I have decided to release the source of the little 3D engine I wrote a long time back (here and here).

    image

    Continue reading...

  • A SilverLight TreeMap control

    Treemaps are space-filling visualizations of hierarchical data. Each node in the Treemap is represented as a rectangle, whose size depends on some attribute of the data. For example, if I am representing the high-volume trades in a day, I could have a Treemap that shows different sized rectangles based on the volume of each trade. Larger rectangles will represent the large trades and smaller rectangles, the not so large trades. The most popular of the treemap implementations use a squarified treemap algorithm that produces more squarish rectangles, resulting in better aspect ratios.

    Continue reading...

  • Using Attached Properties for view transitions, the ViewManager

    Attached Properties is a wonderful feature of WPF and I find myself using it in a variety of scenarios. The most recent one has to do with view-management and transitions. The app that I was building has many visual parts that can be swapped out and replaced with something else. Each part is actually a UserControl, also called the view. To make things interesting, the actual swap happens with a transition, using the TransitionPresenter from the FluidKit library.

    Continue reading...

  • A Design Pattern for communication between UI and ViewModel

    In the app that I am working on right now, there is a particular design pattern that I am using to communicate back and forth with the server side data. The app itself is structured into three distinct pieces:

    • A Service Model (SM), which is essentially a web-service with a bunch of data-contracts
    • A View Model (VM) which talks to the SM on a background thread and notifies the UI whenever an operation completes. The VM also stores a reference to the Dispatcher, which is used to communicate with the UI
    • …and finally the UI – the WPF powerhouse

    Continue reading...

  • Setting up XDebug on NetBeans 6.5 PHP IDE

    Recently I was doing a bit of PHP development for my blog and playing around with the WordPress APIs. After spending some time deciding on the IDE to use, I hit upon NetBeans 6.5, which I think is an awesome tool for PHP development. It has fantastic auto-completion, syntax-highlighting, code-folding and refactoring support unlike no other PHP IDE. It also has nice debugger support (XDebug) but setting it up can be a pain!

    image

    Continue reading...

  • Quick update on the WPF Control Development Unleashed book

    As many of you know my co-author Kevin Hoffman and I have been quite busy finishing up a book on WPF control development. We have few more chapters to finish and then we will be content ready for tech review. The first half of the book is already done and we are going through the tech review as I write. The tech review phase will add a lot of polish to the book and make it an enjoyable read. I am glad to have a master-writer like Kevin working with me, who is doing the part of “making it enjoyable” !

    Continue reading...