Confessions of a .NET Developer!

How to convert bytes to BitmapImage WPF

In this short post I will explain how convert array of bytes to BitmapImage in WPF ofcourse. I happened to use it when I needed to display Images in a DataGrid. And that Image is stored in a column named LargePhoto of data type VARBINARY(MAX) in AdventureWorksDW2008 Database. The VARBINARY(MAX) actually gets transformed into byte[] after mapping the Database to Entity Framework(ya of type EDMX). So I created a Converter to convert the bytes to BitmapImage.

There is one link I found which works in case of Silverlight, haven’t tried in WPF: Byte to BitmapImage in Silverlight

This one by Jobi Joy at StackOverflow also works: Byte to BitmapImage in WPF
But the problem is that stream is left open after conversion, which seems to me is not correct.
In the above case, the stream can be closed using this:

image.StreamSource.Dispose();

Okay so below is the code which will return a BitmapImage when a byte[] is given.

private BitmapImage GetBitmapImageFromBytes(byte[] bytes)
{   
   BitmapImage btm;
   using (MemoryStream ms = new MemoryStream(bytes))
   {
      btm = new BitmapImage();
      btm.BeginInit();
      btm.StreamSource = ms;
      // Below code for caching is crucial.
      btm.CacheOption = BitmapCacheOption.OnLoad;
      btm.EndInit();
      btm.Freeze();
   }
   return btm;
}

This line:

btm.CacheOption = BitmapCacheOption.OnLoad;

is very important. It says that the Image will be loaded into memory, and each request for the Image will be fetched from that memory store. So after closing or disposing the memory stream, the Image will be available in the memory cache.

I also found this piece of code written by Kent Boogart in CodePlex done in a different and in a better way but serving the same purpose : Byte to BitmapImage in WPF (By Kent Boogart)

Hope this helps! Thanks for reading! 🙂

December 25, 2011 Posted by | C Sharp, WPF | 1 Comment

Auto-fixing height and width of Button in WPF DataGrid

This short post will explain how to automatically fix the height and width of a Button in WPF DataGrid.
The idea is to take the height and width of the cell containing the button. To set a proper margin, we can reduce both the parameters by using a converter.
First the DataGrid:

        <DataGrid VerticalContentAlignment="Center"
                  RowHeight="50" ColumnWidth="*"                  
                  ItemsSource="{Binding Path=Persons}" 
                  IsReadOnly="True"
                  AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Header="First Name" Binding="{Binding Path=FirstName}"/>
                <DataGridTextColumn Header="Last Name" Binding="{Binding Path=LastName}"/>
                <DataGridTextColumn Header="Address" Binding="{Binding Path=Address}"/>
                <DataGridTemplateColumn Header="Select">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button Content="Select"
                                    Height="{Binding RelativeSource={RelativeSource AncestorType=DataGridCell}, Path=ActualHeight}"
                                    Width="{Binding RelativeSource={RelativeSource AncestorType=DataGridCell}, Path=ActualWidth}"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>

Lets take a close look at the “Select” column. Its a DataGridTemplateColumn with each row having a Select button. The Button’s height and width is provided by its visual container DatGridCell using the RelativeSource Binding.
It will look something like this:
With no converter

But it doesn’t look good, what’s required is to provide margin. Simply giving margin won’t help.
A converter will be required here to reduce the height and width of the button. On further research, I figured out that a combination of converter and margin can solve the issue, but its still quite unclear to me how it works.

Here is the converter that is used:

    class HeightWidthFixerConverter : IValueConverter
    {
        #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (parameter != null && value != null)
            {
                double reduceBy;
                if (double.TryParse(parameter.ToString(), out reduceBy))
                    return (double)value - reduceBy;
            }
            return value;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }

        #endregion
    }

The ConverterParameter will be used to specify how much height or width you want to reduce by.
The CellTemplate for the DataGrid will look something like this:
Here is the resource key for converter:

    <Window.Resources>
        <converter:HeightWidthFixerConverter x:Key="heightWidthFixer"/>
    </Window.Resources>

And the CellTemplate:

                <DataGridTemplateColumn Header="Select">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button Content="Select"
                                    Margin="2"
                                    Height="{Binding RelativeSource={RelativeSource AncestorType=DataGridCell}, Path=ActualHeight, Converter={StaticResource heightWidthFixer}, ConverterParameter=10}"
                                    Width="{Binding RelativeSource={RelativeSource AncestorType=DataGridCell}, Path=ActualWidth, Converter={StaticResource heightWidthFixer}, ConverterParameter=7}"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

The height and width has been reduced by 10 & 7 respectively.
The DataGrid will look like something like this:

With Converter

With Converter

It looks fine now, properly spaced. Surely this hack is not the finest, so I would like to hear your thoughts and suggestions for improvement. Somehow I feel there must be some better way to do this, until then I shall use this. Thank you for reading and have a nice day!

December 20, 2011 Posted by | WPF | 4 Comments

How to enlarge or re-size Calendar in WPF DatePicker

It has been a long time since my last post!
Okay so in this short article, I will show you how to increase the size of a calendar in WPF 4.0 DatePicker. Since I’m currently working on a touchscreen application, it required me to create a larger calendar so that the user can touch it.
So as usual, like normal developers, I started googling for answers, but it was unsuccessful(maybe I need to improve my googling skills!). It required me to think a little more, but finally I got the solution! This is how I did:
You can edit the template of the calendar by wrapping it in a ViewBox. So now the calendar will fit according to the size of the ViewBox. Simples!

Here is the Style for the calendar:

        <Style x:Key="styleCalendar" TargetType="{x:Type Calendar}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Calendar}">
                        <!-- Wrapping in ViewBox will enlarge calendar of that size.-->
                        <Viewbox Height="400"
                                 Width="400">
                            <CalendarItem x:Name="PART_CalendarItem"
                                          Background="{TemplateBinding Background}"
                                          BorderBrush="{TemplateBinding BorderBrush}"
                                          BorderThickness="{TemplateBinding BorderThickness}"/>
                        </Viewbox>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

And apply the style to the DatePicker:

        <DatePicker CalendarStyle="{StaticResource styleCalendar}" Height="25" HorizontalAlignment="Left" Name="datePicker1" Width="115" />

It will look something like this:

Re-size Calendar

Calendar Re-sized

Cool!
I hope it helped, do leave your comments or suggestions for further improvements.

Happy coding! 🙂

December 19, 2011 Posted by | C Sharp, WPF | 25 Comments

Give underline effect to a textbox in WPF using Adorners

Shahin had a question, he wanted to give an underline to a textbox when it recieves focus. You can see it here: Question.

I pondered for a while and thought why not use an Adorner. An Adorner will simple place a layer(here a line) on the textbox. Adorners won’t disturb the control. It will just decorate over the control. The idea is, whenever the textbox gets focus, add the adorner and when it loses the focus, remove it. Here is the solution that I provided to Shahin: Solution
Here is a nice introduction to Adorners: Adorners

Let’s get started. First create a WPF Application named Adorners.
Then create a class named AdornOnTextBox which will inherit the Adorner class.
It looks something like this:

using System.Windows.Documents;
using System.Windows;
using System.Windows.Media;

namespace Adornerss
{
    class AdornOnTextBox : Adorner
    {
        public Brush UnderlineBrush { get; set; }
        public double UnderlineThickness { get; set; }

        public AdornOnTextBox(UIElement adornedElement, Brush _underlineBrush, double _underlineThickness)
            : base(adornedElement)
        {
            UnderlineBrush = _underlineBrush;
            UnderlineThickness = _underlineThickness;
        }

        protected override void OnRender(System.Windows.Media.DrawingContext drawingContext)
        {
            //Provides area around the AdornedElement(here, TextBox) where the adorner will be used.
            Rect adornedElementRect = new Rect(AdornedElement.RenderSize);

            //Draw over the control using the Pen.
            Pen pen = new Pen(UnderlineBrush, UnderlineThickness);

            //We will draw the line from bottom-left to bottom right ___________
            drawingContext.DrawLine(pen, adornedElementRect.BottomLeft, adornedElementRect.BottomRight);
        }
    }
}

Wondering why I overrode the OnRender method? The textbox undergoes a series of layout measurements while doing arranging and measuring passes. So it is safe to apply the adorner only after these passes are performed and OnRender is the place to do it. For complex cases, you might want to override ArrangeOverride and MeasureOverride methods but that will be beyond the scope of this article.

Next in the window, add a textbox and name it txtBox.
And then do this:

using System.Windows;
using System.Windows.Documents;
using System.Windows.Media;

namespace Adornerss
{
    /// &lt;summary&gt;
    /// Interaction logic for Window1.xaml
    /// &lt;/summary&gt;
    public partial class Window1 : Window
    {
        //Create a reference object for AdornOnTextBox
        AdornOnTextBox adornIt;

        //Create a reference object for AdornerLayer
        AdornerLayer adornLayer;

        public Window1()
        {
            InitializeComponent();
            this.Loaded += new RoutedEventHandler(Window1_Loaded);

            // Attach the event handlers.
            txtBox.GotFocus += new RoutedEventHandler(txtBox_GotFocus);
            txtBox.LostFocus += new RoutedEventHandler(txtBox_LostFocus);
        }

        void Window1_Loaded(object sender, RoutedEventArgs e)
        {
            //Instantiation
            adornIt = new AdornOnTextBox(txtBox, Brushes.Red, 2);

            //Get the AdornerLayer of our TextBox.
            adornLayer = AdornerLayer.GetAdornerLayer(txtBox);
        }

        void txtBox_GotFocus(object sender, RoutedEventArgs e)
        {
            //Add the adorner
            adornLayer.Add(adornIt);
        }

        void txtBox_LostFocus(object sender, RoutedEventArgs e)
        {
            //Remove the adorner
            adornLayer.Remove(adornIt);
        }
    }
}

The code is self-explanatory.

And here is our final result:

GotFocus

GotFocus

LostFocus

LostFocus

I have also used a button so that, when the button is clicked, the focus on the textbox will be lost and so will be the Red underline.
That’s it!

There is also another solution provided by nit-singh. Solution 2
But it won’t give you the exact underline but worth giving it a try if you want a XAML only solution. I have edited his answer a bit to show the underline more clear.

Happy coding!

July 4, 2011 Posted by | C Sharp, WPF | 2 Comments

How to dynamically load assemblies including unreferenced assemblies

This post will explain how to load the dll dynamically and use the class’s methods in that dll. We will use the Activator class to create an instance of a class from the dll and invoke the required methods. So lets get started.

First of all, create a base class library and name it as AClassLibrary:

ClassLibrary

ClassLibrary

Add a new class named AClass, it will look like this:

    public class AClass
    {
        public void WriteDefault()
        {
            Console.WriteLine("A text");
        }

        public void WriteIt(string text)
        {
            Console.WriteLine(text);
        }

        public void WriteIt(string text1, string text2)
        {
            Console.WriteLine(text1 + text2);
        }
    }

Do note that we have two overloaded functions named WriteIt, I will let you know its significance later.

Now lets create another Console Application project in the same solution named CaptureAssembly.
After that, Add Reference to the project AClassLibrary:

AddReference

AddReference

Before explaining, let me show you the whole code:

using System;
using System.Reflection;

namespace CaptureAssembly
{
    class Program
    {
        static void Main(string[] args)
        {
            Assembly a = Assembly.LoadFrom("AClassLibrary.dll");

            Type clsType = a.GetType("AClassLibrary.AClass");
            
            //Create the instance of the class
            object clsInstance = Activator.CreateInstance(clsType, null);

            //Calls the WriteDefault method of AClass
            clsType.InvokeMember("WriteDefault", BindingFlags.InvokeMethod, null, clsInstance, null);

            //Calls the WriteIt methods
            clsType.InvokeMember("WriteIt", BindingFlags.InvokeMethod, null, clsInstance, new object[] { "Hello", " Tarun Kumar" });
            clsType.InvokeMember("WriteIt", BindingFlags.InvokeMethod, null, clsInstance, new object[] { "Hello" });

            Console.ReadLine();
        }
    }
}

First we get the type of AClass using the Reflection. The Activator class will use it to create the instance of the class which we name it as clsInstance.
Next step is to call the 3 methods of AClass. We will use the InvokeMember property using clsType. Let’s take the case of the fist InvokeMethod. The first parameter will take the name of the method, second will help us streamline the search for the method as Reflection is used for this purpose. Third parameter is of no use for now. Fourth parameter, the target is the class instance named clsIntance and the last parameter will take the array of objects used to pass the parameters for the method, as WriteDefault doesn’t have any parameters, hence it will remain null.
The next two invoke methods is for the two overloaded methods WriteIt, the first one will call the method which has two parameters as we are passing two items in the object array(last parameter). As the second invoke method has one item in the object array, hence WriteIt(string text) will be called.

And here is the result:

Result

Result

For loading Unreferenced Assemblies

You can also load the assembly without adding any reference. Suppose the base class library(dll) is in some location, then we can use Assembly.LoadFile method to load the assembly.

Just replace

Assembly a = Assembly.LoadFrom("AClassLibrary.dll");

with

Assembly a = Assembly.LoadFile(@"C:\AClassLibrary\bin\Debug\AClassLibrary.dll");

and you will get the same result.

Happy coding!

June 30, 2011 Posted by | C Sharp, Winforms, WPF | 1 Comment

ImageViewer

Well this post is about my small ImageViewer application that I made using WPF, though I still have little more work to do to finish it completely. Anyway here is a screenshot of what I have done so far. The added advantage is that you can drag the area where all the images are shown up and down. Hope you will like it. 🙂

ImageViewer

ImageViewer

June 15, 2011 Posted by | WPF | 1 Comment

WPF Tutorial : Drawing Visual

As described in the MSDN, is a lightweight drawing class to render shapes, images, videos, text etc. It’s so lightweight that it needs a container to hold it, also the fact that it doesn’t provide layout or hit-testing or event-handling.

So for holding our DrawingVisual, we will use a which will provide layout, hit-testing and event-handling.

Lets get started by creating a class DrawIt which inherits FrameworkElement class. In this class we will create two rectangles using DrawingVisual class.

    class DrawIt:FrameworkElement
    {
        VisualCollection visuals;

        public DrawIt()
        {
            visuals = new VisualCollection(this);

            this.Loaded += new RoutedEventHandler(DrawIt_Loaded);
        }

        void DrawIt_Loaded(object sender, RoutedEventArgs e)
        {
            int x = 0;
            
            for (int i = 0; i <= 1; i++)
            {
                DrawingVisual visual = new DrawingVisual();
                using (DrawingContext dc = visual.RenderOpen())
                {
                    dc.DrawRectangle(Brushes.Red, new Pen(Brushes.Black, 2),
                        new Rect(new Point(0 + x, 0), new Size(40, 40)));
                }
                visuals.Add(visual);
                x += 60;
            }
        }

        protected override Visual GetVisualChild(int index)
        {
            return visuals[index];
        }

        protected override int VisualChildrenCount
        {
            get
            {
                return visuals.Count;
            }
        }
    }

Explanation :

For this class, we have defined visuals of type VisualCollection. VisualCollection will keep the number of visual objects that we have drawn so far.
In the LoadedEvent, I am running a for-loop to draw 2 rectangles. In that, a DrawingVisual object is created for every loop made. The RenderOpen() method of DrawingVisual will return an object of type DrawingContext which is used to render the content of the visual. This line is straight from MSDN: “When you use a DrawingContext object’s draw commands, you are actually storing a set of rendering instructions that will later be used by the graphics system; you are not drawing to the screen in real-time”. This will greatly improve the performance.
Then there are two overrides which will be used by our container to manage the collection of the visual objects.

Next is to display our visuals in a Window. Here is the XAML of our window.

<Window x:Class="LearnDrawing.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:LearnDrawing"
    Title="Window1" Height="300" Width="300">
    <Grid>
        <local:DrawIt Width="100" Height="100"/>
    </Grid>
</Window>

And the window will display this:

Window

Window

I would like you to read these articles too which helped me a lot:

http://jerryclin.wordpress.com/2007/11/21/lightweight-drawing-with-drawingvisuals-part-1-of-2
http://jerryclin.wordpress.com/2007/12/19/lightweight-drawing-with-drawingvisuals-part-2-of-2
http://msdn.microsoft.com/en-us/library/ms748373%28v=VS.90%29.aspx

That’s it. Hope it helped you. Happy coding!

May 19, 2011 Posted by | WPF | 1 Comment

FlowDocuments in WPF – Part 3

In this small post, I shall explain how to save and load the flow documents that you have created. For this, there are two classes, XamlWriter and XamlReader.
You can read more about XamlReader and XamlWriter here :
and respectively.

Create two buttons(btnSave to Save and btnOpen to Open a flowdocument) and add a FlowDocumentReader to your WPF application.

In the save button, use FileStream to create a .xaml file and save the document there.

        private void btnSave_Click(object sender, RoutedEventArgs e)
        {
            using (FileStream fs = File.Open(@"C:\Save.xaml", FileMode.Create))
            {
                XamlWriter.Save(flowDocumentReader1.Document, fs);
            }
        }

Load the document from a location :

            using (FileStream fs = File.OpenRead(@"C:\Open.xaml"))
            {
                FlowDocument document = (FlowDocument)XamlReader.Load(fs);
                flowDocumentReader1.Document = document;
            }

Thats it, nothing much complicated here. Good luck!

May 1, 2011 Posted by | WPF | Leave a comment

FlowDocuments in WPF – Part 2

In this post I will be discussing Tables, BlockUIContainers and Floaters.

First lets discuss Tables. As the name suggests, you can display the data in a tabular format. Here is how it will look like :

Tables

Tables

Here is the XAML :

        <FlowDocumentReader Margin="12" Name="flowDocumentReader1">
            <FlowDocument>
                <Paragraph>Time to create a Table</Paragraph>
                <Table>
                    <Table.Columns>
                        <TableColumn Width="100"/>
                        <TableColumn Width="120"/>
                    </Table.Columns>
                    <TableRowGroup>
                        <TableRow FontSize="18" FontWeight="Bold">
                            <TableCell Background="Beige">
                                <Paragraph>Name</Paragraph>
                            </TableCell> 
                            <TableCell Background="Beige">
                                <Paragraph>Company</Paragraph>
                            </TableCell>
                        </TableRow>
                        <TableRow>
                            <TableCell>
                                <Paragraph>Gagan</Paragraph>                                
                            </TableCell>
                            <TableCell>
                                <Paragraph>BirlaSoft</Paragraph>
                            </TableCell>
                        </TableRow>
                        <TableRow>
                            <TableCell>
                                <Paragraph>Sachin</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>Steria</Paragraph>
                            </TableCell>
                        </TableRow>
                        <TableRow>
                            <TableCell>
                                <Paragraph>S.A.Kryukov</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>Milara Inc</Paragraph>
                            </TableCell>
                        </TableRow>
                        <TableRow>
                            <TableCell>
                                <Paragraph>Pulkit</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>Infosys</Paragraph>
                            </TableCell>
                        </TableRow>
                    </TableRowGroup>
                </Table>

Simple isn’t it! To define columns, use Table.Columns and define each column using TableColumn. For the row, its a bit different. Add TableRowGroup which consists of a group of TableRow’s(one for each row) which in turn contains TableCell’s(one for each column). You can do formatting to your columns by providing background colors, font size etc. Cool.

I have discussed Hyperlink in the previous post. Lets move on to BlockUIContainer.
This is one of the important features in FlowDocuments. With BlockUIContainer, you can add “non-content” elements into your FlowDocument such as Buttons, ListBox also including Layout containers like Grid and StackPanel. The only thing is that only a “single” element can be placed in it, though multiple elements can be placed in the StackPanel.
Its easy to use, here is the simple XAML :

                <BlockUIContainer>
                    <Button Height="30"
                            Width="90"
                            Content="Click Me!"
                            Name="btnBrowse"
                            Click="btnBrowse_Click"/>                            
                </BlockUIContainer>

A simple button has been inserted, you can handle the click event in the code-behind of your application.

Next up Floaters! As the name suggests, the contents of your document can “float” in your FlowDocument.
Here is what I meant :

Floaters

Floaters

And here is the XAML :

                <Paragraph>
                    WPF is a completely new presentation framework, integrating
                    the capabilities of many frameworks that have come before
                    it,
                    <Floater HorizontalAlignment="Left"
                             Width="60">
                        <BlockUIContainer>
                            <Image Source="Bear.bmp"/>    
                        </BlockUIContainer>
                    </Floater>
                    including User, GDI, GDI+, and HTML as well as being heavily
                    influenced by toolkits targeted at the Web.
                </Paragraph>

Add the Image “Bear.bmp” or any other picture as a resource in your project for easy access! Image has to be wrapped in a BlockUIContainer.

Do note the way I have placed the Image as a Floater. After the word it, the floater will be placed on the left side of the FlowDocument, and then the following sentence gets added. If you want the Image to be placed at the right, just change the HorizontalAlignment to Right.

That’s it! In the next part, I might bring adding FlowDocument programmatically. Credit goes to this book : Apress Pro WPF by Matthew MacDonald from which I learned.

Thanks for reading! Happy coding! 🙂

April 27, 2011 Posted by | WPF | 2 Comments

FlowDocuments in WPF Part 1

WPF brings out FlowDocument for readability purpose which has numerous in-built features for easing viewing of text. It actually consists of a number of blocks and resembles with HTML.
For more reading head to this link :

The MSDN says there are four types of controls:
– RichTextBox
– FlowDocumentReader
– FlowDocumentScrollViewer
– FlowDocumentPageViewer

Here I will be using FlowDocumentReader because the 3rd and 4th controls are in-built in it specified as “modes” of viewing.

Lets get started now. First of all, add the FlowDocumentReader component in your toolbox. Like below :

1) Right click on Controls header from the ToolBox and select Choose Items.

ChooseItems

ChooseItems

2) A window will open, select “WPF Component”, check the controls and click Ok.

WPF Components

WPF Components

There now we can start.
Check out this window :

SimpleWindow

SimpleWindow


That’s how a flow document will look like.

Lets try the “FlowDocumentPageViewer” mode by clicking the second control to left of the zoom control.

PageMode

PageMode

And in the Scrolling mode.

ScrollMode

ScrollMode

This is how the self-explanatory object structure of a FlowDocument looks like(taken from MSDN):

Object Model

Object Model

Here is the XAML code to create the first page of the above window :

    <Grid>
        <FlowDocumentReader Margin="12,12,12,0" Name="flowDocumentReader1">
            <FlowDocument>
                <Paragraph>
                    <Italic FontWeight="Bold">FirstParagraph</Italic>
                </Paragraph>
                <Paragraph FontFamily="Verdana"
                           FontSize="14">
                    <Run>A flow document is designed to "reflow content" depending 
                         on window size, device resolution, and other 
                         environment variables.
                    </Run>           
                </Paragraph>
                <Paragraph>
                    <Run>
                        Flow documents have a number of built in features including 
                        search, viewing modes that optimize readability, 
                        and the ability to change the size and appearance of fonts.                    </Run>
                    <Hyperlink Click="Hyperlink_Click">Now this is a hyperlink</Hyperlink>
                </Paragraph>
              </FlowDocument>
             </FlowDocumentReader>
       </Grid>

As you see, the document consists of paragraphs, where you can set the Font properties, background etc. The “Run” element is used specifically for Text only.
I have also added a Hyperlink, you can handle the click event in your code-behind, such as opening a Firefox browser etc.
You can search text which is its in-built feature together with zooming.

We can also create a List of items which look like Bullets.
Here is a window that displays it :

List

List

Here is its XAML :

                <List>
                    <ListItem>
                        <Paragraph>Tarun</Paragraph>
                    </ListItem>
                    <ListItem>
                        <Paragraph>Kumar</Paragraph>
                    </ListItem>
                    <ListItem>
                        <Paragraph>Singh</Paragraph>
                    </ListItem>
                </List>
                
                <Paragraph>A numbered List</Paragraph>
                <List MarkerStyle="Decimal">
                    <ListItem>
                        <Paragraph>WPF is awesome!</Paragraph>       
                    </ListItem>
                    <ListItem>
                        <Paragraph>Indeed it is</Paragraph>
                    </ListItem>
                </List>

Set the Marker style to get different ways of specifying the bullets and numbers.
See how neatly it has presented it.

That’s it for the first part. Next part will be about Tables and Floaters. Stay tuned! 🙂

April 25, 2011 Posted by | WPF | 1 Comment