jump to navigation

Pasting Code into Blog Entries using Windows Live Writer April 1, 2007

Posted by Karl Hulme in .Net, C#, Windows Live Writer.
3 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

I’ve tried a couple of different ways of getting code from Visual Studio onto a blog post using Windows Live Writer.  Unfortunately something has nearly always been lost on route.  I’m trying out a new method which seems to be working ok on my local machine, but the only way to test it properly is to upload something -so here goes!

First download the CopySourceAsHTML plugin for Visual Studio.  It’s written by Colin Coller, who I gather now works for Avanade.  This plugin adds a ‘Copy as HTML’ command.  Simply right-click on some selected text, hit the command, and it will convert the code to an HTML representation and place it on the clipboard.  It uses the colors as defined in Visual Studio which is much more useful than anything else I’ve seen before.

You can configure the css produced by the plugin at the file, line and block level. However for this to work properly you may need the CSS Upgrade from wordpress, otherwise it seems to strip out some of the styling on upload.  This $15 for the year.  Since WordPress has a maximum column width of 450px, I’ve specified this as a file level css rule.  So my code should sit in a scrollable DIV element.  I’ve limited the height too so that long scripts don’t disappear off the page.  I’ve also set the padding on the lines to be zero, because otherwise it spaces out the lines of code massively, this is probably specific my current theme. The finished settings that work for me are below.

Once the HTML is on the clipboard you can then flick to the HTML view in Windows Live Writer, paste, and then flick back to normal view.  This requires 6 mouse clicks in WLW, but you can get it down to 1 if (like me) you want it to be really quick.  To do this, create a trivial WLW Addin that inserts the clipboard contents directly into the HTML of the post.  You can get a built version of the plugin from here, but it’s just as quick to compile it yourself.  The source code is below.

using System;
using System.Collections.Generic;
using System.Text;
using System.Windows.Forms;
using WindowsLive.Writer.Api;
 
namespace InsertHtmlPlugin
{
    [WriterPlugin("58409179-ECA9-4BE4-8F4A-45F2D0DD79A6", "Insert Clipboard Contents as HTML", 
            HasEditableOptions = false, ImagePath = "SmallHtml.png",
            PublisherUrl = "https://karlhulme.wordpress.com",
            Description = "Plugin for quickly insterting HTML from the clipboard.")]
    [InsertableContentSource("Insert Clipboard as HTML", SidebarText="Clipboard as HTML")]
    [CLSCompliant(false)]
    public class InsertHtmlPlugin : ContentSource
    {
        public override DialogResult CreateContent(IWin32Window dialogOwner, ref string newContent)
        {
            newContent = Clipboard.GetText();
            return DialogResult.OK;
        }
    }
}

The code should look reasonable on RSS feeds too.

Hopefully WordPress will get the missing pictures problem sorted very soon.  The lack of pictures makes everything look very bland. 

Advertisements

AggregateCollection March 31, 2007

Posted by Karl Hulme in .Net, C#, WPF, XAML.
6 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

My apparent obsession with collection classes continues, and hopefully reaches it’s conclusion, with the AggregateCollection class.  Simply put, it allows you to access multiple collections from a single collection object.  A basic usage would be something like…

        private void TestAggregate()
        {
            List<Int32> listOne = new List<Int32>();
            List<String> listTwo = new List<String>();
            for (int i = 0; i < 10; i += 2)
            {
                listOne.Add(i + 1);
                listTwo.Add(i.ToString());
            }
 
            AggregateCollection agg = new AggregateCollection(listOne, listTwo);
            foreach (Object o in agg)
            {
                Console.WriteLine(o.ToString());
            }
        }

And the output is as you might expect…

The lists passed to the constructor need only support IEnumerable, but if they also support INotifyCollectionChanged then you’ll get a better WPF binding experience.  I wrote this class for WPF in the first place, because I want to be able to pull information together from different lists into the UI and I don’t want to be monitoring for the change events myself.

The AggregateCollection class itself supports the IEnumerable interface of course, and it also implements IList (which thus brings ICollection into the fray).  The fact that it implements IList, means that even if the constituent lists don’t support IList, you can still access all the objects in the aggregate collection via a single index (from 0 to “count of all the lists”).  I think this is quite cool, but it serves a greater purpose…

When you bind to a collection class in WPF, a CollectionView (or derivative) is created as a wrapper around your collection, and WPF will bind to that instead.  This allows items to be sorted, grouped, etc, without affecting the underlying data.  Bea Costa (data binding supremo) explains this very well (post November 22nd ’06).  The AggregateCollection class supports IList, so that at binding-time WPF will instantiate a ListCollectionView, instead of a CollectionView – which is necessary to support sorting.

The example app below demonstrates the AggregateCollection class in action in WPF, and shows how, with sorting, this can be helpful.  The first and second columns show the contents of two seperate ObservableCollections.  There’s also some buttons for adding and removing objects from those collections, and for moving those items around.  The ListBox in the third column is bound to an AggregateCollection containing the first 2 lists.  The ListBox in the fourth column is bound to a sorted CollectionViewSource which references the same AggregateCollection.  As the items in the first two collections change the ListBoxes in columns 3 and 4 will update automatically.

Example application exe  (save to your local machine first, then run)
Example application solution

The AggregateCollection class can’t be synchronised, because I only intended for it to be used in the UI layer, but I guess there would be a way to make this work.  I also made it read-only because I couldn’t determine a satisfactory strategy for which constituent list a new item should be added to.  Finally, you can’t add or remove constituent lists after it’s been created, but there’s no fundamental obstacle to implementing this.  The code for the AggregateCollection class is below.

using System;
using System.Collections.Generic;
using System.Text;
using System.Collections.Specialized;
using System.ComponentModel;
using System.Windows.Threading;
using System.Collections;
using System.Collections.ObjectModel;
 
namespace AggCollectionTest
{
    public class AggregateCollection : IEnumerable, IList, INotifyCollectionChanged
    {
        private IEnumerable[] lists;
        private List<Object> cache = new List<Object>();
        private Boolean cacheValid = false;
        private Object syncRoot = new Object();
 
        public AggregateCollection(params IEnumerable[] lists)
        {
            if (lists == null) throw new ArgumentNullException("lists");
 
            this.lists = lists;
            foreach (IEnumerable list in lists)
            {
                if (list is INotifyCollectionChanged)
                {
                    ((INotifyCollectionChanged)list).CollectionChanged +=
                        delegate(Object sender, NotifyCollectionChangedEventArgs e)
                        {
                            cacheValid = false;
                            NotifyCollectionChangedEventArgs eventArgs;
                            switch (e.Action)
                            {
                                case NotifyCollectionChangedAction.Add:
                                    eventArgs = new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Add,
                                        e.NewItems, DetermineIndexInAggregateCollection(sender as IEnumerable, e.NewStartingIndex));
                                    break;
                                case NotifyCollectionChangedAction.Move:
                                    eventArgs = new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Move,
                                        e.NewItems, DetermineIndexInAggregateCollection(sender as IEnumerable, e.NewStartingIndex),
                                        DetermineIndexInAggregateCollection(sender as IEnumerable, e.OldStartingIndex));
                                    break;
                                case NotifyCollectionChangedAction.Remove:
                                    eventArgs = new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Remove,
                                        e.OldItems, DetermineIndexInAggregateCollection(sender as IEnumerable, e.OldStartingIndex));
                                    break;
                                case NotifyCollectionChangedAction.Replace:
                                    eventArgs = new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Replace,
                                        e.NewItems, e.OldItems, DetermineIndexInAggregateCollection(sender as IEnumerable, e.OldStartingIndex));
                                    break;
                                default:
                                case NotifyCollectionChangedAction.Reset:
                                    eventArgs = new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Reset);
                                    break;
                            }
 
                            OnCollectionChanged(eventArgs);
                        };
                }
            }
        }
 
        private int DetermineIndexInAggregateCollection(IEnumerable list, int index)
        {
            if(list == null) throw new ArgumentNullException("list");
            if (index == -1) return -1;
 
            Int32 adjustedIndex = -1;
            for (int i = 0; i < lists.Length; i++)
            {
                IEnumerable l = lists[i];
                if (l == list) { break; }
                    else adjustedIndex++;
 
                foreach (Object o in l)
                    adjustedIndex++;
            }
 
            return list == lists[0] ? adjustedIndex + index + 1 :
                adjustedIndex + index;
        }
 
        #region IEnumerable Members
 
        public IEnumerator GetEnumerator()
        {
            return new Enumerator(lists);
        }
 
        private class Enumerator : IEnumerator
        {
            private Int32 listIndex = -1;
            private IEnumerator[] enumerators;
 
            public Enumerator(IEnumerable[] lists)
            {
                enumerators = new IEnumerator[lists.Length];
 
                for (int i = 0; i < lists.Length; i++) 
                    enumerators[i] = lists[i].GetEnumerator();
            }
 
            public object Current
            {
                get
                {
                    try
                    {
                        return enumerators[listIndex].Current;
                    }
                    catch (IndexOutOfRangeException)
                    {
                        throw new InvalidOperationException();
                    }
                }
            }
 
            public bool MoveNext()
            {
 
                if (listIndex > -1 && listIndex < enumerators.Length && 
                    enumerators[listIndex].MoveNext())
                {
                    return true;
                }
                else
                {
                    listIndex++;
                    if (listIndex < enumerators.Length)
                    {
                        try
                        {
                            enumerators[listIndex].Reset();
                        }
                        catch (InvalidOperationException)
                        {
                            return false;
                        }
 
                        return MoveNext();
                    }
                    else return false;
                }
            }
 
            public void Reset()
            {
                listIndex = -1;
            }
        }
 
        #endregion
 
        #region INotifyCollectionChanged Members
 
        protected virtual void OnCollectionChanged(NotifyCollectionChangedEventArgs e)
        {
            if (e == null) throw new ArgumentNullException("e");
 
            if (CollectionChanged != null) 
                CollectionChanged(this, e);
        }
 
        public event NotifyCollectionChangedEventHandler CollectionChanged;
 
        #endregion
 
        #region IList Members
 
        public int Add(object value)
        {
            throw new NotSupportedException();
        }
 
        public void Clear()
        {
            throw new NotSupportedException();
        }
 
        public bool Contains(object value)
        {
            return IndexOf(value) != -1;
        }
 
        public int IndexOf(object value)
        {
            Int32 i = -1;
            foreach (Object o in this)
            {
                i++;
                if ((value == null && o == null) | (value != null && value.Equals(o)))
                {
                    return i;
                }
            }
 
            return -1;
        }
 
        public void Insert(int index, object value)
        {
            throw new NotSupportedException();
        }
 
        public bool IsFixedSize
        {
            get { return false; }
        }
 
        public bool IsReadOnly
        {
            get { return true; }
        }
 
        public void Remove(object value)
        {
            throw new NotSupportedException();
        }
 
        public void RemoveAt(int index)
        {
            throw new NotSupportedException();
        }
 
        public object this[int index]
        {
            get
            {
                if (!cacheValid)
                {
                    cache.Clear();
                    foreach (Object o in this)
                    {
                        cache.Add(o);
                    }
                    cacheValid = true;
                }
 
                return cache[index];
            }
            set
            {
                throw new NotSupportedException();
            }
        }
 
        #endregion
 
        #region ICollection Members
 
        public void CopyTo(Array array, int index)
        {
            Int32 i = -1;
            foreach (Object o in this)
                array.SetValue(o, index + ++i);
        }
 
        public int Count
        {
            get
            {
                Int32 count = 0;
                foreach (Object o in this) count++;
                return count;
            }
        }
 
        public bool IsSynchronized
        {
            get { return false; }
        }
 
        public object SyncRoot
        {
            get { return syncRoot; }
        }
 
        #endregion
    }
}

Using a ContentControl and DataTemplate to indicate new and/or modified data March 6, 2007

Posted by Karl Hulme in .Net, C#, WPF, XAML.
10 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

I was familiar with using DataTemplate’s for multiple items, say for items in a ListBox, but what if you want to use a DataTemplate for a single item? 

Why would I want to do that?  I can declare the UIElements I want, and bind the properties that I want.  You don’t need a DataTemplate here!!

Well, not strictly true!  If you want to be able to use properties of your business object within conditions that control the layout, then you’re going to need the services of DataTrigger’s. And although most UIElements have a Triggers property, DataTriggers are only supported on a DataTemplate.  So this blog entry is an example of how to set that up…

 

Think about Visual Studio tabs for a second.  Whenever you change the content of a document, a small asterisk appears after the filename to indicate to you that it’s been changed, as illustrated below.

I wanted to do a similar thing in my application.  I wanted to..

  • Show an asterisk whenever the data has been changed since the last save, and
  • Show if an item was new (that is has never been saved.

For me, the second point is particularly important because my application deals with Customer entities, and until the customer is saved they don’t have the all-important customer number.

The first step is to add the required properties to the business object being bound to, and implement INotifyPropertyChanged so that we know when they’re changing.  A heavily abridged/shell-like version of my Entity class is below.  (Please note, the code below is only intended to highlight the need to define the properties and inplement INotifyPropertyChanged on the business object in use.)

using System; using System.Collections.Generic; using System.Text; using System.Xml; using System.Collections.ObjectModel; using System.Collections.Specialized; using System.ComponentModel; namespace MyNamespace { /// <summary> /// Represents an entity loaded from the database. /// </summary> public class Entity: INotifyPropertyChanged { #region properties private Int32? id; /// <summary> /// Gets the unique id of the entity. /// </summary> public Int32? Id { get { return id; } internal set { id = value; OnPropertyChanged("Id"); OnPropertyChanged("IsNew"); } } private EntityDefinition definition; /// <summary> /// Gets the type of the entity. /// </summary> public EntityDefinition Definition { get { return definition; } } /// <summary> /// Gets a value that indicates if the entity has been modified /// since it was loaded. /// </summary> public Boolean IsModified { get { return changeHistory.Count > 0; } } private EntityDataFieldChangeCollection changeHistory = new EntityDataFieldChangeCollection(); public EntityDataFieldChangeCollection ChangeHistory { get { return changeHistory; } } #endregion #region INotifyPropertyChanged public event PropertyChangedEventHandler PropertyChanged; protected virtual void OnPropertyChanged(String propertyName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); } } #endregion } }

Then in XAML, define a ContentControl and set the Content of that control to be an instance of your business object.  Clearly the ContentControl doesn’t know how to render said business object, so I’ve provided a DataTemplate.  This DataTemplate uses a horizontal StackPanel to lay out a series of TextBlock elements.  I then use the Triggers to turn the visibility on and off, dependent upon the IsNew and IsModified properties. 

<ContentControl Grid.Row="0" Content="{Binding Source={StaticResource entity}}"> <ContentControl.ContentTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <TextBlock Name="newBlock" Text="New " Visibility="Visible"/> <TextBlock Name="nameBlock" Text="{Binding Path=Definition.Name}" Visibility="Visible"/> <TextBlock Name="spacer" Text=" " Visibility="Collapsed"/> <TextBlock Name="idBlock" Text="{Binding Path=Id}" Visibility="Collapsed" /> <TextBlock Name="modifiedBlock" Text="*" Visibility="Collapsed"/> </StackPanel> <DataTemplate.Triggers> <DataTrigger Binding="{Binding Path=IsNew}" Value="False"> <DataTrigger.Setters> <Setter TargetName="newBlock" Property="UIElement.Visibility" Value="Collapsed" /> <Setter TargetName="idBlock" Property="UIElement.Visibility" Value="Visible" /> <Setter TargetName="spacer" Property="UIElement.Visibility" Value="Visible" /> </DataTrigger.Setters> </DataTrigger> <DataTrigger Binding="{Binding Path=IsModified}" Value="True"> <DataTrigger.Setters> <Setter TargetName="modifiedBlock" Property="UIElement.Visibility" Value="Visible" /> </DataTrigger.Setters> </DataTrigger> </DataTemplate.Triggers> </DataTemplate> </ContentControl.ContentTemplate> </ContentControl>

So the tab headers throughout the life of one of my Customer entities would start out as follows…

Then, I would expect something to be changed…

Once the first set of changes can be made, it should be saved.  This will result in an Id being returned from the database…

Obviously the data could be modified again at this point…

I originally implemented this feature using IValueConverters (and the like) but I believe the XAML solution is much nicer. 

So if you need to display information related to a business object and you have some conditions associated with the display, then you could try using a data-templated content control.

SynchronizedObservableCollection and BindableCollection March 4, 2007

Posted by Karl Hulme in .Net, WPF.
25 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

Yesterday I posted some code that marshals the events raised by an ObservableCollection onto the same thread as is running the UI layer.  I called it a SynchronizedObservableCollection but said at the end of the post that I was unhappy with the name.  Well, while continuing to work on my project I’ve found need for a genuinely synchronized version of the ObservableCollection class. I also need a ReadOnly version – predominately as a base class so that I can add the methods I want for altering the collection, rather than the standard Add/Remove.  On top of these two, I still need to be able to bind them both to controls in WPF and not worry about which thread is causing the collections to change.

Therefore, the classes I need are:

  • SynchronizedObservableCollection
  • ReadOnlySynchronizedObservableCollection
  • BindableCollection

The SynchronizedObservableCollection is a collection that will accept updates and changes from lot’s of different threads without complaining.  It’s implemented the same way as the SynchronizedCollection class provided in the framework, e.g. you can provide your own syncRoot or one will be created.  You can also provide an existing list if you wish, but this is not a wrapper class, so if you do pass a list to the constructor it will be copied and any changes made to one list will not be reflected in the other.

[ComVisible(false)] public class SynchronizedObservableCollection<T> : IList<T>, ICollection<T>, IEnumerable<T>, IList, ICollection, IEnumerable, INotifyPropertyChanged, INotifyCollectionChanged { private ObservableCollection<T> items; private Object sync; #region Constructors public SynchronizedObservableCollection(Object syncRoot, IEnumerable<T> list) { this.sync = (syncRoot == null) ? new Object() : syncRoot; this.items = (list == null) ? new ObservableCollection<T>() : new ObservableCollection<T>(new List<T>(list)); items.CollectionChanged += delegate(Object sender, NotifyCollectionChangedEventArgs e) { OnCollectionChanged(e); }; INotifyPropertyChanged propertyChangedInterface = items as INotifyPropertyChanged; propertyChangedInterface.PropertyChanged += delegate(Object sender, PropertyChangedEventArgs e) { OnPropertyChanged(e); }; } public SynchronizedObservableCollection(object syncRoot) : this(syncRoot, null) { } public SynchronizedObservableCollection(): this(null, null) { } #endregion #region Methods public void Add(T item) { lock (this.sync) { int index = this.items.Count; this.InsertItem(index, item); } } public void Clear() { lock (this.sync) { this.ClearItems(); } } protected virtual void ClearItems() { this.items.Clear(); } public bool Contains(T item) { lock (this.sync) { return this.items.Contains(item); } } public void CopyTo(T[] array, int index) { lock (this.sync) { this.items.CopyTo(array, index); } } public IEnumerator<T> GetEnumerator() { lock (this.sync) { return this.items.GetEnumerator(); } } public int IndexOf(T item) { lock (this.sync) { return this.InternalIndexOf(item); } } public void Insert(int index, T item) { lock (this.sync) { if ((index < 0) || (index > this.items.Count)) { throw new ArgumentOutOfRangeException("index", index, "Value must be in range."); } this.InsertItem(index, item); } } protected virtual void InsertItem(int index, T item) { this.items.Insert(index, item); } private int InternalIndexOf(T item) { int count = this.items.Count; for (int i = 0; i < count; i++) { if (object.Equals(this.items[i], item)) { return i; } } return -1; } public bool Remove(T item) { lock (this.sync) { int index = this.InternalIndexOf(item); if (index < 0) { return false; } this.RemoveItem(index); return true; } } public void RemoveAt(int index) { lock (this.sync) { if ((index < 0) || (index >= this.items.Count)) { throw new ArgumentOutOfRangeException("index", index, "Value must be in range."); } this.RemoveItem(index); } } protected virtual void RemoveItem(int index) { this.items.RemoveAt(index); } protected virtual void SetItem(int index, T item) { this.items[index] = item; } void ICollection.CopyTo(Array array, int index) { lock (this.sync) { for (int i = 0; i < items.Count; i++) { array.SetValue(items[i], index + i); } } } IEnumerator IEnumerable.GetEnumerator() { return this.items.GetEnumerator(); } int IList.Add(object value) { VerifyValueType(value); lock (this.sync) { this.Add((T)value); return (this.Count - 1); } } bool IList.Contains(object value) { VerifyValueType(value); return this.Contains((T)value); } int IList.IndexOf(object value) { VerifyValueType(value); return this.IndexOf((T)value); } void IList.Insert(int index, object value) { VerifyValueType(value); this.Insert(index, (T)value); } void IList.Remove(object value) { VerifyValueType(value); this.Remove((T)value); } private static void VerifyValueType(object value) { if (value == null) { if (typeof(T).IsValueType) { throw new ArgumentException("Synchronized collection wrong type null."); } } else if (!(value is T)) { throw new ArgumentException("Synchronized collection wrong type."); } } #endregion #region Properties public int Count { get { lock (this.sync) { return this.items.Count; } } } public T this[int index] { get { lock (this.sync) { return this.items[index]; } } set { lock (this.sync) { if ((index < 0) || (index >= this.items.Count)) { throw new ArgumentOutOfRangeException("index", index, "Value must be in range."); } this.SetItem(index, value); } } } protected ObservableCollection<T> Items { get { return this.items; } } public object SyncRoot { get { return this.sync; } } bool ICollection<T>.IsReadOnly { get { return false; } } bool ICollection.IsSynchronized { get { return true; } } object ICollection.SyncRoot { get { return this.sync; } } bool IList.IsFixedSize { get { return false; } } bool IList.IsReadOnly { get { return false; } } object IList.this[int index] { get { return this[index]; } set { VerifyValueType(value); this[index] = (T)value; } } #endregion #region INotifyPropertyChanged Members public event PropertyChangedEventHandler PropertyChanged; protected virtual void OnPropertyChanged(PropertyChangedEventArgs e) { if (PropertyChanged != null) PropertyChanged(this, e); } #endregion #region INotifyCollectionChanged Members public event NotifyCollectionChangedEventHandler CollectionChanged; protected virtual void OnCollectionChanged(NotifyCollectionChangedEventArgs e) { if (CollectionChanged != null) CollectionChanged(this, e); } #endregion }

The ReadOnlySynchronizedObservableCollection is a wrapper class that expects a SynchronizedObservableCollection as the only constructor parameter.  Because it’s a wrapper class, you could maintain a SynchronizedObservableCollection in one layer of your app, and just expose a ReadOnlySynchronizedObservableCollection to  the other layers.  Similarly, as a read only class you wouldn’t expect change events, hence the INotifyPropertyChanged and INotifyCollectionChanged interfaces are implemented explicitly (again following the pattern of the ReadOnlyObservableCollection).  Don’t forget you can always consume the events by casting the object to the interfaces of course, and for this reason, it doesn’t affect WPF binding. 

[ComVisible(false)] public class ReadOnlySynchronizedObservableCollection<T> : ReadOnlyCollection<T>, INotifyPropertyChanged, INotifyCollectionChanged { #region Constructor public ReadOnlySynchronizedObservableCollection(SynchronizedObservableCollection<T> list): base(list) { list.PropertyChanged += delegate(Object sender, PropertyChangedEventArgs e) { OnPropertyChanged(e); }; list.CollectionChanged += delegate(Object sender, NotifyCollectionChangedEventArgs e) { OnCollectionChanged(e); }; } #endregion #region Event Handling private NotifyCollectionChangedEventHandler collectionChanged; private PropertyChangedEventHandler propertyChanged; protected event NotifyCollectionChangedEventHandler CollectionChanged { add { collectionChanged += value; } remove { collectionChanged -= value; } } protected event PropertyChangedEventHandler PropertyChanged { add { propertyChanged += value; } remove { propertyChanged -= value; } } event NotifyCollectionChangedEventHandler INotifyCollectionChanged.CollectionChanged { add { collectionChanged += value; } remove { collectionChanged -= value; } } event PropertyChangedEventHandler INotifyPropertyChanged.PropertyChanged { add { propertyChanged += value; } remove { propertyChanged -= value; } } protected virtual void OnPropertyChanged(PropertyChangedEventArgs e) { if (propertyChanged != null) { propertyChanged(this, e); } } protected virtual void OnCollectionChanged(NotifyCollectionChangedEventArgs e) { if (collectionChanged != null) { collectionChanged(this, e); } } #endregion }

Finally, the BindableCollection is the class I started building yesterday. This class can be bound to a WPF ItemsControl (or similar) and then be updated on any thread.  Among some minor coding changes, I’ve added support for the non-generic interfaces (e.g. IList as well as IList<T>) and I’ve allowed the Dispatcher to be passed in.  This is necessary if the BindableCollection is not created on the UI thread.  I’ve also dropped the word ‘Observable’ from the class name on the grounds that the class must be Observable if it is to be Bindable, making that bit superflous.  The BindableCollection is a wrapper class and will accept anything that implements IList<T>, INotifyCollectionChanged and INotifyPropertyChanged.  However, most commonly it will be fed an ObservableCollection, ReadOnlyObservableCollection, SynchronizedObservableCollection, ReadOnlySynchronizedObservableCollection or a class derived from one of these.

public class BindableCollection<T>: ICollection<T>, IList<T>, IEnumerable<T>, ICollection, IList, IEnumerable, INotifyCollectionChanged, INotifyPropertyChanged { private IList<T> list; private Dispatcher dispatcher; #region Constructor public BindableCollection(IList<T> list) : this(list, null) { } public BindableCollection(IList<T> list, Dispatcher dispatcher) { if (list == null || list as INotifyCollectionChanged == null || list as INotifyPropertyChanged == null) { throw new ArgumentNullException("The list must support IList, INotifyCollectionChanged " + "and INotifyPropertyChanged."); } this.list = list; this.dispatcher = (dispatcher == null) ? Dispatcher.CurrentDispatcher : dispatcher; INotifyCollectionChanged collectionChanged = list as INotifyCollectionChanged; collectionChanged.CollectionChanged += delegate(Object sender, NotifyCollectionChangedEventArgs e) { this.dispatcher.Invoke(DispatcherPriority.Normal, new RaiseCollectionChangedEventHandler(RaiseCollectionChangedEvent), e); }; INotifyPropertyChanged propertyChanged = list as INotifyPropertyChanged; propertyChanged.PropertyChanged += delegate(Object sender, PropertyChangedEventArgs e) { this.dispatcher.Invoke(DispatcherPriority.Normal, new RaisePropertyChangedEventHandler(RaisePropertyChangedEvent), e); }; } #endregion #region INotifyCollectionChanged Members public event NotifyCollectionChangedEventHandler CollectionChanged; private void RaiseCollectionChangedEvent(NotifyCollectionChangedEventArgs e) { if (CollectionChanged != null) { CollectionChanged(this, e); } } private delegate void RaiseCollectionChangedEventHandler(NotifyCollectionChangedEventArgs e); #endregion #region INotifyPropertyChanged Members public event PropertyChangedEventHandler PropertyChanged; private void RaisePropertyChangedEvent(PropertyChangedEventArgs e) { if (PropertyChanged != null) { PropertyChanged(this, e); } } private delegate void RaisePropertyChangedEventHandler(PropertyChangedEventArgs e); #endregion #region ICollection<T> Members public void Add(T item) { list.Add(item); } public void Clear() { list.Clear(); } public bool Contains(T item) { return list.Contains(item); } public void CopyTo(T[] array, int arrayIndex) { list.CopyTo(array, arrayIndex); } public int Count { get { return list.Count; } } public bool IsReadOnly { get { return list.IsReadOnly; } } public bool Remove(T item) { return list.Remove(item); } #endregion #region IList<T> Members public int IndexOf(T item) { return list.IndexOf(item); } public void Insert(int index, T item) { list.Insert(index, item); } public void RemoveAt(int index) { list.RemoveAt(index); } public T this[int index] { get { return list[index]; } set { list[index] = value; } } #endregion #region IEnumerable<T> Members public IEnumerator<T> GetEnumerator() { return list.GetEnumerator(); } #endregion #region ICollection Members void ICollection.CopyTo(Array array, int index) { ((ICollection)list).CopyTo(array, index); } int ICollection.Count { get { return ((ICollection)list).Count; } } bool ICollection.IsSynchronized { get { return ((ICollection)list).IsSynchronized; } } object ICollection.SyncRoot { get { return ((ICollection)list).SyncRoot; } } #endregion #region IList Members int IList.Add(object value) { return ((IList)list).Add(value); } void IList.Clear() { ((IList)list).Clear(); } bool IList.Contains(object value) { return ((IList)list).Contains(value); } int IList.IndexOf(object value) { return ((IList)list).IndexOf(value); } void IList.Insert(int index, object value) { ((IList)list).Insert(index, value); } bool IList.IsFixedSize { get { return ((IList)list).IsFixedSize; } } bool IList.IsReadOnly { get { return ((IList)list).IsReadOnly; } } void IList.Remove(object value) { ((IList)list).Remove(value); } void IList.RemoveAt(int index) { ((IList)list).RemoveAt(index); } object IList.this[int index] { get { return ((IList)list)[index]; } set { ((IList)list)[index] = value; } } #endregion #region IEnumerable Members System.Collections.IEnumerator System.Collections.IEnumerable.GetEnumerator() { return ((System.Collections.IEnumerable)list).GetEnumerator(); } #endregion }

If anyone can make use of the above classes then you’re very welcome to use them, although you do so at your own risk! 

ObservableCollection events and WPF Window/UI on Different Threads March 3, 2007

Posted by Karl Hulme in .Net, WPF.
10 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

Warning: There’s an improved version of the class outlined in a subsequent blog post.

When binding ObservableCollection’s using WPF you’ll probably encounter the following error, ‘This type of CollectionView does not support changes to its SourceCollection from a thread different from the Dispatcher thread.’

This is simply telling you that the CollectionChanged event was not raised on the thread that the Window was created on.  It’s an easy problem to fix, we just need to wrap the collection so that any events raised on the source collection will be raised on the same thread as the UI.  My complete implementation is below which can be copy/pasted and the namespace renamed.

using System; using System.Collections.Generic; using System.Text; using System.Collections.Specialized; using System.ComponentModel; using System.Windows.Threading; namespace MyNamespace { public class SynchronisedObservableCollection<T>: ICollection<T>, INotifyCollectionChanged, INotifyPropertyChanged { private ICollection<T> collection; private Dispatcher dispatcher; public SynchronisedObservableCollection(ICollection<T> collection) { if (collection == null || collection as INotifyCollectionChanged == null || collection as INotifyPropertyChanged == null) { throw new ArgumentException("Collection must support ICollection, INotifyCollectionChanged " + " and INotifyPropertyChanged interfaces."); } this.collection = collection; this.dispatcher = Dispatcher.CurrentDispatcher; INotifyCollectionChanged collectionChanged = collection as INotifyCollectionChanged; collectionChanged.CollectionChanged += delegate(Object sender, NotifyCollectionChangedEventArgs e) { dispatcher.Invoke(DispatcherPriority.Normal, new RaiseCollectionChangedEventHandler(RaiseCollectionChangedEvent), e); }; INotifyPropertyChanged propertyChanged = collection as INotifyPropertyChanged; propertyChanged.PropertyChanged += delegate(Object sender, PropertyChangedEventArgs e) { dispatcher.Invoke(DispatcherPriority.Normal, new RaisePropertyChangedEventHandler(RaisePropertyChangedEvent), e); }; } #region INotifyCollectionChanged Members public event NotifyCollectionChangedEventHandler CollectionChanged; private void RaiseCollectionChangedEvent(NotifyCollectionChangedEventArgs e) { if (CollectionChanged != null) { CollectionChanged(this, e); } } private delegate void RaiseCollectionChangedEventHandler(NotifyCollectionChangedEventArgs e); #endregion #region INotifyPropertyChanged Members public event PropertyChangedEventHandler PropertyChanged; private void RaisePropertyChangedEvent(PropertyChangedEventArgs e) { if (PropertyChanged != null) { PropertyChanged(this, e); } } private delegate void RaisePropertyChangedEventHandler(PropertyChangedEventArgs e); #endregion #region ICollection<T> Members public void Add(T item) { collection.Add(item); } public void Clear() { collection.Clear(); } public bool Contains(T item) { return collection.Contains(item); } public void CopyTo(T[] array, int arrayIndex) { collection.CopyTo(array, arrayIndex); } public int Count { get { return collection.Count; } } public bool IsReadOnly { get { return collection.IsReadOnly; } } public bool Remove(T item) { return collection.Remove(item); } #endregion #region IEnumerable<T> Members public IEnumerator<T> GetEnumerator() { return collection.GetEnumerator(); } #endregion #region IEnumerable Members System.Collections.IEnumerator System.Collections.IEnumerable.GetEnumerator() { return ((System.Collections.IEnumerable)collection).GetEnumerator(); } #endregion } }

The wrapper above accepts any ICollection<T> that also supports INotifyCollectionChanges and INotifyPropertyChanged.  Best candidates for this are the ObservableCollection<T> and ReadOnlyObservableCollection<T> classes.  You use the wrapper inbetween your business layer (the original collection) and the UI classes that will consume it.  For me, this means it sits in class that provides central access to all Model data (thinking MVC/MVP)

public static class AppModel { public static SynchronisedObservableCollection<String> GetSyncCollection() { ObservableCollection<String> innerCollection = new ObservableCollection<String>(); return new SynchronisedObservableCollection<String>(innerCollection); } }

You can now bind to the collection using an ObjectDataProvider that calls the GetSyncCollection method.  Note that my implementation doesn’t require you to pass in the Dispatcher of the UI thread.  That’s because I assume that the UI thread will be the one creating the wrapper.  Since this class forms part of the UI layer and not the business layer, then it’s a fair assumption, but if it doesn’t work for you then you can always pass a Dispatcher into the constructor.

<Window x:Class="MyApplication.Host" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:model="clr-namespace:MyNamespace.Model;assembly=MyAssembly.Model" Width="800" Height="600" > <Window.Resources> <ObjectDataProvider x:Key="myList" ObjectType="model:AppModel" MethodName="GetSyncCollection"/> </Window.Resources> <ListBox ItemsSource="{Binding Source={StaticResource myList}}"> </Window>

Incidently, I’m not particularly happy with SynchronisedObservableCollection as the class name.  It implies that the collection is thread-safe, and although in one way it is, it many others it isn’t!

Masking input to a WPF TextBox February 15, 2007

Posted by Karl Hulme in .Net, C#, WPF, XAML.
16 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

How do you go about masking the input to a textbox.  Say you wanted to allow numbers but not letters or any punctuation, how would you do it?  Well the simplest way is to trap the TextChanged event…

        private void TextChangedEventHandler(Object sender, EventArgs e) 
        { 
            TextBox textBox = sender as TextBox; 
            Int32 selectionStart = textBox.SelectionStart; 
            Int32 selectionLength = textBox.SelectionLength; 

            String newText = String.Empty; 
            foreach (Char c in textBox.Text.ToCharArray()) 
            { 
                if(Char.IsDigit(c) || Char.IsControl(c)) newText += c; 
            } 

            textBox.Text = newText; 

            textBox.SelectionStart = selectionStart <= textBox.Text.Length ? 
                selectionStart : textBox.Text.Length; 
        }

This method is simple to understand (always a positive) but there are a few problems with this as I see it, namely..

  • An additional TextChanged event is raised when input is rejected
  • You can’t tell what the change was, you can only inspect the end result
  • You have to re-implement the code that determines the correct caret position

This is not a great way to solve the original problem, because we’re basically hacking at the input after it’s already been accepted.  Leaving us trying to fix the text and compensate for the changes in caret position.  It’s easier to reject invalid characters as they’re presented.  Let’s start by defining a very simple method for stripping out the input we don’t want..  

        private Boolean IsTextAllowed(String text) 
        { 
            foreach (Char c in text.ToCharArray()) 
            { 
                if (Char.IsDigit(c) || Char.IsControl(c)) continue; 
                    else return false; 
            } 
            return true; 
        }

This could be defined slightly more elegantly using a predicate..

        private Boolean IsTextAllowed(String text) 
        { 
            return Array.TrueForAll<Char>(text.ToCharArray(), 
                delegate(Char c) { return Char.IsDigit(c) || Char.IsControl(c); }); 
        }

We then need to identify the entry points to the control and for each one, identify how we will be notified about it’s use.  For typical a TextBox these entry points might be:

  • Typing into the TextBox
    • Hook up to the PreviewTextInput event
  • Copy/Pasting into the TextBox
    • Hook up to the DataObject.Pasting event

It’s easy to implement and hook up the handlers for these events..

      <TextBox PreviewTextInput="PreviewTextInputHandler" 
               DataObject.Pasting="PastingHandler" />

        // Use the PreviewTextInputHandler to respond to key presses 
        private void PreviewTextInputHandler(Object sender, TextCompositionEventArgs e) 
        { 
            e.Handled = !IsTextAllowed(e.Text); 
        } 

        // Use the DataObject.Pasting Handler  
        private void PastingHandler(object sender, DataObjectPastingEventArgs e) 
        { 
            if (e.DataObject.GetDataPresent(typeof(String))) 
            { 
                String text = (String)e.DataObject.GetData(typeof(String)); 
                if (!IsTextAllowed(text)) e.CancelCommand(); 
            } 
            else e.CancelCommand(); 
        }

In some cases, you may need to support other scenarios (such as allowing users to Drag-and-Drop text onto it) and these can be dealt with in a similar fashion – identify an appropriate event, check the input, and if it’s invalid then prevent any further processing.

I hope this information serves as a starting point for implementing a masked textbox.  That is, display an actual mask (using underlines) and rigidly control the input of the user.  One immediate change is that you’d look to subclass TextBox (or base class) and override the protected handlers (e.g. OnPreviewTextInput) rather than hook up directly to the events.  The underlines are also important because without them the user has little clue what is expected of them.  Infact, in a basic validation scenario I think it better to accept dodgy input and then provide UI cues as to why it isn’t acceptable.  I’m holding off doing this myself just in case it turns up in the standard library, perhaps when Orcas ships?  If it doesn’t, I’ll post animplementation because my project needs one. 

XPath Variable/Dynamic Parameters in WPF Binding February 14, 2007

Posted by Karl Hulme in .Net, WPF.
11 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

The XML binding support in WPF is excellent and just about anything you’ve ever wanted to know about it’s binding support can be found on Beatriz Costa’s blog.  However, as raised by Grae Foster in a recent WPF Forum posting the Binding support is not without limitations such as the lack of support for parameterising an XPath expression.  Let’s just confirm what it can do..

<Binding XPath="root/reports/report[key='5']" />

If you want to parameterize your XPath expression with literal values, in this case ‘5’, then you can do it with little bother.  This would be useful if you had a button which filtered your xml source based on specific well known values, say enum values, but it’s no good if the value comes from somewhere else in the app.  Unfortunately this second scenario is very common. 

Another, unsupported scenario that causes problems is if you want to allow the user to make a selection from one part of the xml, and use it to select a separate section from the xml.  Sounds a bit specialist?  It’s not, and better explained by example..

 

<root xmlns=""> <categories> <category name="cat1"> <reports> <report key="rep1" /> <report key="rep2" /> </reports> </category> <category name="cat2"> <reports> <report key="rep1" /> </reports> </category> </categories> <reportdefinitions> <reportdef defkey="rep1" name="Report1" Description="This first report has the following prop..." /> <reportdef defkey="rep2" name="Report2" Description="For the second report I decided to..." /> </reportdefinitions> </root>

In the xml above, the categories would be bound to a ComboBox so that the user can select one.  Below this would be a ListBox, which would display the name of the reports in that category.  The finished app is shown below.

The difficulty in getting this (apparently simple) master-detail app to work is that the ‘master’ xml is in a separate part of the document to the ‘detail’ xml.  This post explains how you can resolve this issue.

First wrap the xml data island up in an XmlDataProvider, and key it as xmlData.  Then bind the category elements to a ComboBox.  Finally define a template so that the category name is displayed for the user.  All straight forward..

<ComboBox Name="combo" DataContext="{StaticResource xmlData}" ItemsSource="{Binding XPath=root/categories/category}"> <ComboBox.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding XPath=@name}" /> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox>

Now we need to bind the ListBox.  We know that the contents of the ListBox has to depend on the user selection in the ComboBox, so represent this by binding the DataContext of the ListBox to the SelectedItem of the ComboBox.  The ListBox.DataContext will now be a category element (or null).  Then create bindings on the ListBox ItemTemplate which will pull out the name and description of the reports that correspond to the selected category.  All sounds fine, but there’s no XPath statement defined.

<ListBox DataContext="{Binding ElementName=combo, Path=SelectedItem}"> <ListBox.ItemsSource> <Binding XPath="what goes here??" /> </ListBox.ItemsSource> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding XPath=@name}" /> <TextBlock Text=": " /> <TextBlock Text="{Binding XPath=@Description}" /> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox>

From the perspective of the ListBox, our DataContext will be a category element but we need a set of report elements.  Thankfully the Binding class has a Converter parameter, which can be used to convert the input values of a binding.  Bingo – that’s exactly what we want to do.  I’ve defined an XmlConverter class that can be used to perform that conversion, which would be used as follows..

<ListBox DataContext="{Binding ElementName=combo, Path=SelectedItem}"> <ListBox.ItemsSource> <Binding XPath="reports/report/@key" Converter="{StaticResource xmlConverter}" > <Binding.ConverterParameter> <this:XmlConverterParameter XPathTemplate="/root/reportdefinitions/reportdef[{0}]" XPathCondition="@defkey='{0}'" /> </Binding.ConverterParameter> </Binding> </ListBox.ItemsSource>

The XPath property of the ListBox Binding is used to select the specific @key values that uniquely identify the report elements that we want from the other part of the xml.  So the input to the conversion is now a collection of XmlAttributes.  Ok, but let’s imagine for a second that we had literal values, instead of XmlAttributes.  What would the XPath look like?

/root/reportdefinitions/reportdef[@defkey=’rep1‘ or @defkey=’rep2]

We don’t have literal values, so this needs to be broken down into 3 parts.  An XPath template, an XPath condition and the XPath condition values.  The XPath template (shown in red) is the bit that identifies what should be bound to the control, in our case we want the reportdef elements.  The XPath condition (shown in blue) will be evaluated to determine which of the elements identified by the XPath template will be included, in this case the ones for the chosen category.  In our case above the condition appears twice because there’s two condition values (shown in green) in the current category.  The XPath template and XPath condition are declared in the xaml as shown above.

So that’s all there is to it, in terms of xaml.  Just need to explain what the XmlConverter and XmlConverterParameter classes actually do.  The XmlConverterParameter class is just a DependencyObject with 2 DependencyProperties declared.  (Bear in mind this means that these values can also be data bound.)

public class XmlConverterParameter: DependencyObject { // An XPath statement that contains a {0} where the condition is to be inserted public String XPathTemplate { get { return (String)this.GetValue(XPathTemplateProperty); } set { this.SetValue(XPathTemplateProperty, value); } } public static readonly DependencyProperty XPathTemplateProperty = DependencyProperty.Register( "XPathTemplate", typeof(String), typeof(XmlConverterParameter), new PropertyMetadata(null)); // An XPath condition that contains a {0} where the value from the source XmlNode's will be placed public String XPathCondition { get { return (String)this.GetValue(XPathConditionProperty); } set { this.SetValue(XPathConditionProperty, value); } } public static readonly DependencyProperty XPathConditionProperty = DependencyProperty.Register( "XPathCondition", typeof(String), typeof(XmlConverterParameter), new PropertyMetadata(null)); }

And the XmlConverter?  Well that’s pretty simple too, it just implements IValueConverter.Convert.  This method checks the input, it then builds up the condition using the given XmlNode array (in our case the @key values) and then executes the XPath statement against the xml to find the resultant xml (in our case the reportdef elements).

public class XmlConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { // check that we've got all the inputs we need if (value as IEnumerable == null) return null; if (parameter as XmlConverterParameter == null) return null; XmlConverterParameter cp = parameter as XmlConverterParameter; if (cp.XPathTemplate == null || cp.XPathCondition == null) return null; // build the condition part of the xpath statement using the given XmlNode[] XmlDocument doc = null; List<String> compoundCondition = new List<String>(); foreach (XmlNode node in (IEnumerable)value) { if (doc == null) doc = node.OwnerDocument; compoundCondition.Add(String.Format(cp.XPathCondition, node.InnerText)); } // select the node set if (doc == null) { return null; } else { String select = String.Format(cp.XPathTemplate, String.Join(" or ", compoundCondition.ToArray())); return doc.SelectNodes(select); } } public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { throw new Exception("The method or operation is not implemented."); } }

The XmlConverter class clearly won’t support every scenario.  If you have another common scenario, you could create a different XmlConverterParameter object which allows the XPath query to be built up in a different way.  But what if you want a complete solution?  Well then you need to address the fundamental problem… you need a powerful expressive way of selecting one set of nodes given another set of nodes.  Three methods spring to mind…

First you could use XSL.  You could implement an XslConverter, to replace the XmlConverter class which accepts an XSL fragment to perform the select.  However XSL uses XPath and so you’re likely to run into the same problems, specifically, finding a way to merge the source multiple input XmlNodes with the ‘select’ statement.  An XSL solution also presents problem of producing a new XmlDocument as the output, which would probably have to be related back to the original xml data.  Second thoughts, this isn’t a solution at all.

Second, you could use XQuery.  This is a much better tool for the job, although it’s been cooking for so long that the world has moved on.  In addition, Microsoft dropped support for XQuery along time ago (Microsoft.Xml.XQuery).  You can still get their implementation of it from 4guysfromrolla, and it seems to work fairly well, but obviously this is a non-supported approach.  Microsoft did include an implementation in Sql Server 2005, so you could (in theory) off-load the processing to it, but there’s far more drawbacks than benefits to this approach.  XQuery support may re-appear but i believe the architect on this project, Michael Brundage, is now working on the XBox – so I wouldn’t hold your breath.

Thirdly, you could use XLinq, and you can get an overview here.  It provides all the expressiveness of XQuery, along with countless other advantages.  This is the best solution, and will kill the parameterized XPath problem dead, by allowing you to perform a join on the xml.  I suspect that’s why the XPath parameterization problem has been overlooked for now.  It simple wasn’t worth producing a half way house solution.  You can download the May 2006 CTP to create your own Binding Converter that uses XLinq to do the work.  If you can wait though, the necessary functionality will probably appear natively, e.g. in the Binding class, or probably something much better that I never would have thought of. 

Tweaking the CodeFormatter plugin for Windows Live Writer February 13, 2007

Posted by Karl Hulme in .Net, Windows Live Writer.
2 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

I downloaded the binaries of the CodeFormatter plugin for Windows Live Writer (the blogging tool) from Steve Dunn’s blog.  He’s provided the plugin in binary form so you can just extract the contents to your \Windows Live Writer\Plugins directory.

One small problem with it though, is that the code it produces is enormous.  I’m not talking about code bloat, i mean physically on the screen it’s huge.  To make matters worse it doesn’t scroll, which means you can end up losing half of the code.  Luckily the source is also available. 

Using the source you can easily edit the HTML that’s produced.  For some strange reason I can’t get it to pick up the font-family correct in the end result, but it looks ok in the editor so i think that’s something to do with the template i’m using on word press.

sb.Append(@"<div style=""width: 430px; max-height: 500px; overflow: scroll; font-family: 'Courier New', monospace; font-size: 7pt;""><pre style="""); if ( this.BackgroundColor != Color.Empty ) sb.AppendFormat( @"background-color:{0};", ColorTranslator.ToHtml( this.BackgroundColor) ); if ( this.WordWrap ) sb.Append( @"white-space:-moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; word-wrap: break-word;" ); sb.AppendFormat( @""">{0}</pre></div>", s );

If you don’t have time to edit the files yourself then you can grab the binaries that I rebuilt.  If anyone has a problem with me reposting here then let me know and i’ll take them down.

There’s more plugins on the codeplex site here, which includes a PasteAsHtml plugin by Bryant Likes.  It installed easy enough but I didn’t have much luck with it.

Easy Sci-fi Style Screen Readout February 12, 2007

Posted by Karl Hulme in .Net, WPF.
3 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

I’m working on a sci-fi style screen readout control in WPF. Basically you can throw strings at it, and it will print them on the screen one character at a time. When you add the next, the first one slides down the page to make room for it. Nice 😉 I’ve got a lot more work to do on it, but I thought it best to share some of the code before it becomes a 20,000 line opus. Sadly the screen shot doesn’t do it justice – not least because I don’t want to bloat the xaml yet with gradient fill overload.

First I need a class to represent the individual readouts. I’ll be binding to it so it’ll need to subclass DependencyObject and all the properties will need to be of a DependencyProperty type.

public class LineItem: DependencyObject { public String Text { get { return (String)this.GetValue(TextProperty); } set { this.SetValue(TextProperty, value); } } public static readonly DependencyProperty TextProperty = DependencyProperty.Register( "Text", typeof(String), typeof(LineItem), new PropertyMetadata(null)); public LineItem(String text) { Text = text; } }

For most of my apps these days I centralise the data. It makes it much easier to introduce caching and performing optimisations later. I’m clearly over-selling here, all we need is a class that we can hook an ObjectDataProvider up to.

 

public static class Model { private static ObservableCollection<LineItem> lineItems = new ObservableCollection<LineItem>(); public static ObservableCollection<LineItem> GetTickerItems() { return lineItems; } }

Next we need to add an event handler for a button we’re going to hook up later. This is placed into the partial class for the WPF window.

public partial class Window1 : System.Windows.Window { public Window1() { InitializeComponent(); } private void ButtonClick(Object sender, RoutedEventArgs e) { LineItem item = new LineItem("Item " + Model.GetTickerItems().Count.ToString()); Model.GetTickerItems().Insert(0, item); } }

The button click handler will create a new instance of our LineItem class and add it to the model. Since the model encompasses an ObservableCollection class, the WPF controls will be notified of the changes automatically.

Ok, that’s the easy bit. Now comes the other easy bit. The basic idea is that the when a new LineItem is added to the collection a new control will be created for it automatically in the StackPanel using the DataTemplate provided. I will use the FrameworkElement.Loaded event to provide the animation. This animation is achieved by sizing the control height from 0 to 15 pixels, and then sizing it from 0 to 100 pixels in width. This is done using key frames. To spice things up, I added a LinearGradientBrush which is used to fade the child controls out at the bottom of the StackPanel.

 

<Window x:Class="Ticker.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:this="clr-namespace:Ticker" Title="Ticker" Height="300" Width="300"> <Window.Resources> <ObjectDataProvider x:Key="tickerLines" ObjectType="{x:Type this:Model}" MethodName="GetTickerItems" /> <LinearGradientBrush x:Key="VerticalGrayScale" StartPoint="0.5,0" EndPoint="0.5,1"> <GradientStop Color="Black" Offset="0.6" /> <GradientStop Color="Transparent" Offset="1.0" /> </LinearGradientBrush> </Window.Resources> <Grid> <Grid.RowDefinitions> <RowDefinition Height="0.2*" /> <RowDefinition /> </Grid.RowDefinitions> <Button Grid.Row="0" Content="Add New Message" Click="ButtonClick" /> <ListBox Grid.Row="1" ItemsSource="{Binding Source={StaticResource tickerLines}}" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollBarVisibility="Hidden" OpacityMask="{StaticResource VerticalGrayScale}"> <ListBox.ItemTemplate> <DataTemplate> <TextBlock Name="block" Text="{Binding Path=Text}"> <TextBlock.Triggers> <EventTrigger RoutedEvent="TextBlock.Loaded"> <EventTrigger.Actions> <BeginStoryboard> <Storyboard> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="block" Storyboard.TargetProperty="(FrameworkElement.Height)" Duration="0:0:0.5" AutoReverse="False"> <LinearDoubleKeyFrame Value="0" KeyTime="0:0:0" /> <LinearDoubleKeyFrame Value="15" KeyTime="0:0:0.5" /> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="block" Storyboard.TargetProperty="(FrameworkElement.Width)" Duration="0:0:1.5" AutoReverse="False"> <LinearDoubleKeyFrame Value="0" KeyTime="0:0:0" /> <LinearDoubleKeyFrame Value="0" KeyTime="0:0:0.5" /> <LinearDoubleKeyFrame Value="100" KeyTime="0:0:1.5" /> </DoubleAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> </EventTrigger.Actions> </EventTrigger> </TextBlock.Triggers> </TextBlock> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid> </Window>

I’ll endeavour to post some screen shots of the pretty version when it’s finished.

Hello, World! February 12, 2007

Posted by Karl Hulme in Waffle.
2 comments

This blog is no longer actively maintained. The content is well over 5 years old – which is like 50 coder years. Use at your own risk!

Apparently you can use Word to post to your blog. Which begs the question, how easy is this to do. Can a monkey do it? Can I do it? Can I do it while wearing a monkey suit? Clearly that would be difficult because monkeys have big chunky sausage fingers and the keys on my laptop here are quite small.

The answer to this question will of course be self evident.