This project is read-only.

Sparkle : Create dynamic UI with WPF & Silverlight

Creating dynamic UI project creates UI dynamically based on your assigned entity, properties and property’s attribute. Once you assign entity to DataContext on your control, your user control will create textboxes, dropdown, and checkbox and so on as per you entity and registered controls.
In the present state, the code generates the following UI control with the datatypes mentioned alongside the control:
String = Textbox
Int = Textbox
Long = Textbox
Decimal = Textbox
Boolean/bool = checkbox
datetime = date control
enum (any) = dropdown box

Demo Project :

In the demo project following fetures are included

Dynamic UI Controls
Dynamic menus
Dynamic Reports
Dunamic other links 

Pre-requisites

VS2008

.Net 3.5

 And/Or Silverlight 3

Frequently asked questions:

 

Q1:- How to implement dynamicUIGen in my project?

A : Add reference to SparkleUI & SparkleLib dlls or projects in your project and add assembly ref. on your usercontrol as “xmlns:UI="clr-namespace:Sparkle.UI;assembly=SparkleWpfUI"”. Then add dataPanel <UI:DataPanel x:Name="hsl" Width="500" Height="300" />

To populate Dynamic UI ,all you need is to use the entity on your screen/control. A typical example of a code behind implementation is given below:

       void MainPage_Loaded(object sender, RoutedEventArgs e)

       {

           Employee emp = new Employee();

           emp.EmpName = "test";

           emp.EmpNo = 100;

           emp.DOJ = new Date() { Value= DateTime.Now };

           emp.EmpType = EmpType.Permanent;

           emp.Addr1 = "test addr1";

           emp.Addr2 = "test addr2";

           emp.Addr3 = "Town";

           emp.Postcode = "AB1 2CD";

           emp.Active = true;

           hsl.DataContext = emp;

       }

 

 

Q2:- How do I implement datapanel in my project?

A:- Please see Q1.

 

Q3:- How to register my Data type or class?

A:- You have to register your type and control in App.xaml.cs’s Application_Startup event as below

HasuSLUI.UIDefaults.RegisterdControls.Add(typeof(UIGenDemoModel.Address),

               new HasuSLUI.RegisterdControl() {

                   ControlType = typeof(AddressSelector),

                   DefaultWidth = 200,

                   BindingProperty = TextBox.TextProperty

               });

Once you register your datatype ,your control will be registered untill your application closes. 

 

Q4:- How can I populate my UserControl with datapanel?

A:- you have to define your property in your class and register the usercontrol as you did in Q3.

 

Model Example:

 

 

   public enum EmpType

   {

       Permanent,

       Temporary,

       Apprentice,

       Student

   }

 

   public enum Country

   {

       UK,

       India,

       USA

   }

 

   public enum County

   {

       Middx,

       Essex,

       Ken,

       Other

   }

 

 

   public class Employee

   {

       public const string KEY_Company = "1. Company Details";

       public const string KEY_ADDRESS = "2. Address Details";

       public const string KEY_STATUS = "3. Status";

       public const string KEY_PAY= "4. Pay";

 

       #region Employeement details

 

       #region EmpNo

       private int _empNo =0;

       /// <summary>

       /// EmpNo

       /// </summary>

       [Display(Name = "Employee No", GroupName = KEY_Company, Order = 1, Description = "Employee Number")]

       public int EmpNo

       {

           get { return _empNo; }

           set { _empNo = value; }

       }

 

       #endregion EmpNo

 

       #region EmpName

       private string _empName = "tmp emp";

       /// <summary>

       /// EmpName

       /// </summary>

       [Display(Name = "Employee Name", GroupName = KEY_Company, Order = 2, Description = "Employee full Name")]

       public string EmpName

       {

           get { return _empName; }

           set { _empName = value; }

       }

 

       #endregion EmpName

      

       #region DOJ

       private Date _doj; //= new Date();

       /// <summary>

       /// DOJ

       /// </summary>

       [Display(Name = "Joining Date", GroupName = KEY_Company,Order=3)]

       public Date DOJ

       {

           get { return _doj; }

           set { _doj = value; }

       }

       #endregion DOJ

 

      

       #region EmpType

       private EmpType _emptype= EmpType.Permanent;

       /// <summary>

       /// EmpType

       /// </summary>

       [Display(Name = "Employeement Type", GroupName = KEY_STATUS, Order = 4)]

       public EmpType EmpType

       {

           get { return _emptype; }

         set { _emptype = value; }

       }

       #endregion EmpType

 

 

       #region Active

       private bool _active= true;

       /// <summary>

       /// Active

       /// </summary>

       [Display(Name = "Active", GroupName = KEY_STATUS, Order = 5)]

       public bool Active

       {

           get { return _active; }

           set { _active = value; }

       }

       #endregion Active

 

       #endregion

 

       [Display(Name = "CurrentAddress", GroupName = KEY_STATUS, Order = 5)]

       public Address CurrentAddress { get; set; }

 

       #region Address Details

 

       [Display(Name = "Address1", GroupName = KEY_ADDRESS, Order = 6)]

       public string Addr1 { get; set; }

 

       [Display(Name = "Address2", GroupName = KEY_ADDRESS, Order = 7)]

       public string Addr2 { get; set; }

 

       [Display(Name = "Address3", GroupName = KEY_ADDRESS, Order = 8)]

       public string Addr3 { get; set; }

 

       [Display(Name = "Post code", GroupName = KEY_ADDRESS, Order = 9)]

       public string Postcode { get; set; }

 

       [Display(Name = "County", GroupName = KEY_ADDRESS, Order = 10)]

       public County County { get; set; }

 

       [Display(Name = "Country", GroupName = KEY_ADDRESS, Order = 11)]

       public Country Country { get; set; }

 

 

       #endregion

 

       #region pay details

 

       [Display(Name = "Salary", GroupName = KEY_PAY, Order = 5)]

       public decimal Salary { get; set; }

 

       [Display(Name = "Bonus", GroupName = KEY_PAY, Order = 5)]

       public decimal Bonus { get; set; }

       #endregion

   } 

 

 

 

Last edited Jan 22, 2011 at 10:12 AM by hasmukhlalpatel, version 9