CodeSamplez.com

Programming, Web development, Cloud Technologies

  • Facebook
  • Google+
  • RSS
  • Twitter
  • Home
  • Featured
    • C# Tutorials
      • LinQ Tutorials
      • Facebook C# API Tutorials
    • PHP Tutorials
      • CodeIgniter Tutorials
    • Amazon AWS Tutorials
  • Categories
    • Programming
    • Development
    • Database
    • Web Server
    • Source Control
    • Management
    • Project
  • About
  • Write
  • Contact
Home Development WPF Property Grid (WPG) Tutorial In C#

WPF Property Grid (WPG) Tutorial In C#

Rana Ahsan April 19, 2011 4 Comments


 WPF Property Grid (WPG) Tutorial In C#    

Property grid in WPF helps us in generating UI controls from a c# class. Although. there are several projects and releases out there for this purpose, I am going to introduce one of the most popular open source once, hosted on codeplex, wpg(WPF Property Grid). I am assuming that, you have basic wpf knowledge. If no, please consider reading my another article about getting started with wpf in c#.

How Property grid works?

As you already know from my introductory words, what wpf property grid does; You still might have another question in mind, how it works, that means, which property to change which type of controls? Its simple enough to answer, as that will be the one only that will come to our mind first. It recognizes by the type of the property of a class. Such as, if you define a property of a property grid class of string type, then it will create a text box control. On the other hand, if you use an enum type for a property, that will be treated for a combo box controls.

However, there are some extra efforts needed in the property grid class for making it suitable to use. You will have to define some attributes. Such as, for categorize a list of fields, you will have to use ‘CategoryAttribute’. For the text label corresponding to a field, you will have to use ‘DisplayName’ attribute. Besides you can use ‘DescriptionAttribute’, which will define the tool tip text when user mouse over a field text.

Example codes for using WPF property grid:

First, add the property grid dlls to the project you are working on. Now, create a class as like following format:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.ComponentModel;
using System.Xml.Serialization;
using System.Windows.Input;

namespace PropertyGridClasses
{
public class MyPropertyGrid
    {
        public enum ETestEnum { option1,option2,option3 }      
        
        
        [CategoryAttribute("Category 1"),
        DisplayName("Field 1 Text"),
        DescriptionAttribute("Field 1 Text")]
        public ETestEnum ComboData
        {
            get;
            set;
        }
        
        [CategoryAttribute("Category 2"),
        DisplayName("NumericUpdow Field Text"),
        DescriptionAttribute("Test Description")]
        public int MyNumericUpdown
        {
            get;
            set;
        } 
        [CategoryAttribute("Category 2"),
        DisplayName("Textbox Field Text"),
        DescriptionAttribute("Test Description")]
        public string MyTextbox
        {
            get;
            set;
        }       
  }
}

Just to mention, setting up this class won’t require the wpg library to be imported. for attributes, it requires for system.ComponentModel name space.

Now, first, add the reference of wpg library on your xaml file along with other references. Example simple xaml file code is as follows:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:wpg="clr-namespace:WPG;assembly=WPG"
        Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
    <Grid>
        <wpg:PropertyGrid AutomaticlyExpandObjects="False"  Width="320" Foreground="BlanchedAlmond" Instance="{Binding ElementName=myGrid}" x:Name="wpgMyControl" ShowDescription="False" ShowPreview="false"  />
    </Grid>
</Window>

Now write a function on the code behind c# file with following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApplication1
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            MyPropertyGrid testGrid = new MyPropertyGrid();
            wpgMyControl.Instance = testGrid;
        }
    }
}

for getting data inputted by user, you will have to use the following code:

MyPropertyGrid testGrid = (MyPropertyGrid)wpgMyControl.Instance;

Now, if you run your application, you will see the controls and some more options at the top. Those are actually integrated part and helps user searching controls by label text. The result window will be as like follows:

wpf property grid application sample

Advantages of WPF Property Grid:

  • Simple to use: This library is very easy to adapt, nothing difficult at all.
  • Code reduction: It helps to reduce writing code for ui, a huge reduction in amount of code, thus development time also.
  • Enhancement is easy: To add remove fields are very much easy, just a matter of adding/removing property to the property grid entity class.
  • Suitable for lots of fields contained app: Which applications requires a lot of data fields to be represented on form window, this library will help those kind of application a lot. Because, it will save huge amount of ui code writing, compactly represents the fields in a organized way, provides option to search controls.
  • Its Open source: Its being an open source project, you can track/fix its bug and enhance yourself as per your need.

Disadvantages of WPF Property Grid:

  • Buggy: You may face some unexpected behaviors/errors sometimes, specially while working with other libraries. This library still under development and really needs good amount of improvement also for a stability.
  • Less customizable: you will get very few rooms for customizing the ui according to your taste. So, better to decide at the very beginning whether to use this library according to what it provides.
  • Event Handling: Its very difficult to add/attach events to the controls of property grid.
  • Documentation: On codeplex, this project doesn’t have any documentation at all. For this, developers may face problem to know its features and using them.

For your kind information, for this project, you won’t be able to download the library from the download section. Rather, you will have to go to the ‘source code’ tab, and its on the top right corner. Happy coding 🙂

Related

Filed Under: Development Tagged With: .net, c#, wpf

About Rana Ahsan

Rana is a passionate software engineer/Technology Enthusiast.
Github: ranacseruet

Comments

  1. Silvio says

    March 1, 2012 at 7:40 am

    It seens a greate componet, but is too complicated to see how to use it. I’m trying to give access to some properties of an image. Maybe i will fall in tentation of use a common grid.
    The class MyPropertyGrid is a my inspected class?

    wpgMyControl, what is?

    I trying do this in Visual C#.

    thanks
    Silvio

    Reply
  2. Spencer says

    September 12, 2013 at 5:07 am

    This C# Property Grid control is able to display the properties of any object in a user-friendly way and allows the end users of your applications edit the properties of the object.

    Reply
    • sridhar r says

      October 28, 2017 at 4:33 am

      where I have to get this dll

      Reply
  3. kills says

    April 8, 2020 at 8:32 am

    how to use the ‘color palette’ in MyPropertyGrid ???

    Reply

Leave a Reply Cancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Email Subscription

Never miss any programming tutorial again.

Popular Tutorials

  • PHP HTML5 Video Streaming Tutorial
  • How To Work With JSON In Node.js / JavaScript
  • Generate HTTP Requests using c#
  • How To Work With C# Serial Port Communication
  • Facebook C# API Tutorials
  • Tutorial On Uploading File With CodeIgniter Framework / PHP
  • How To Work With Codeigniter Caching In PHP
  • Get Facebook C# Api Access Token
  • Pipe Email To PHP And Parse Content
  • Getting Started With HTML5 Web Speech API

Recent Tutorials

  • Building Auth With JWT – Part 1
  • Document Your REST API Like A Pro
  • Understanding Golang Error Handling
  • Web Application Case Studies You Must Read
  • Getting Started With Golang Unit Testing
  • Getting Started With Big Data Analytics Pipeline
  • NodeJS Tips And Tricks For Beginners
  • Apple Push Notification Backend In NodeJS
  • Web Based Universal Language Translator, Voice/Text Messaging App
  • How To Dockerize A Multi-Container App From Scratch

Recent Comments

  • intolap on PHP HTML5 Video Streaming Tutorial
  • manishpanchal on PHP HTML5 Video Streaming Tutorial
  • Rana Ghosh on PHP HTML5 Video Streaming Tutorial
  • ld13 on Pipe Email To PHP And Parse Content
  • Daniel on PHP HTML5 Video Streaming Tutorial

Archives

Resources

  • CodeSamplez.com Demo

Tags

.net apache api audio aws c# cache cloud server codeigniter deployment doctrine facebook git github golang htaccess html5 http image java javascript linq mysql nodejs oop performance php phpmyadmin plugin process python regular expression scalability server smarty ssh tfs thread tips ubuntu unit-test utility web application wordpress wpf

Copyright © 2010 - 2021 · CodeSamplez.com ·

Copyright © 2021 · Streamline Pro Theme on Genesis Framework · WordPress · Log in