This is a migrated thread and some comments may be shown as answers.

RadPropertyGrid: Creating a single visual property from a combination of 3 propertis (name, type and value)

12 Answers 281 Views
PropertyGrid
This is a migrated thread and some comments may be shown as answers.
Maor
Top achievements
Rank 1
Maor asked on 26 Mar 2014, 01:39 PM
Hi,

I've created a demo project that will demonstrate my current situation and my goal.

The code and XAML are attached below.

As you could see in the picture marked as "Desired display" and in propertyGrid2 in the code I had to create a mockup classes that will display the properties.

My goal is to get the "Desired display" look by using only the "MainObject" and "PropertiesObject".

The main issues I have are:
1. I need to translate the 3 properties from "PropertiesObject": "PropertyName", "PropertyType" and "PropertyValue" into a single property (without generating a new class on run time).
2. I need to make the observable collection nested properties display the list of "PropertiesObject" (after my conversion to a single property) without the extra nested properties (like Count).
3. I don't want to use or display the "CollectionEditor".

The amount and variety of the properties in the "OtherProperties" observable collection are unknown during compile-time and change during run-time from another source.

I do not require the ability to edit the properties so they can all be read-only.

Do you have any hints on how I can accomplish my goal?

This is the code I'm using:
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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 TelerikPropertyGrid
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            PropertiesObject property1 = new PropertiesObject() { PropertyName = "stringProperty1", PropertyType = typeof(string), PropertyValue="string 1" };
            PropertiesObject property2 = new PropertiesObject() { PropertyName = "stringProperty2", PropertyType = typeof(string), PropertyValue = "string 2" };
            PropertiesObject property3 = new PropertiesObject() { PropertyName = "boolProperty1", PropertyType = typeof(bool), PropertyValue= (Boolean)true };
            PropertiesObject property4 = new PropertiesObject() { PropertyName = "boolProperty2", PropertyType = typeof(bool), PropertyValue = (Boolean)false };
            PropertiesObject property5 = new PropertiesObject() { PropertyName = "intProperty1", PropertyType = typeof(int), PropertyValue=(Int32)10 };
            ObservableCollection<PropertiesObject> properties = new ObservableCollection<PropertiesObject>() { property1, property2, property3, property4, property5 };
            MainObject main = new MainObject() { Name = "john", Age = 25, OtherProperties = properties };
 
            //this is the property grid I have and want to modify using only MainObject and PropertiesObject classes
            PropertyGrid1.Item = main;
            PropertyGrid1.Visibility = System.Windows.Visibility.Visible;
 
            //this proeprty grid demonstrates how I want my grid to look like.
            //I created the "goal*" classes in order to populate it, I don't have those in the production system
            PropertyGrid2.Item = new GoalDisplayObject();
            PropertyGrid2.Visibility = System.Windows.Visibility.Hidden;
        }
    }
 
    public class MainObject //exist in production
    {
        public string Name { get; set; }
        public int Age { get; set; }
        public ObservableCollection<PropertiesObject> OtherProperties { get; set; }
    }
 
    public class PropertiesObject //exist in production
    {
        public string PropertyName { get; set; }
        public Type PropertyType { get; set; }
        public object PropertyValue { get; set; }
    }
 
    public class GoalDisplayObject  //doesn't exist in production
    {
        public string Name { get { return "john"; } set { } }
        public int Age { get { return 25; } set { } }
        public GoalNestedProperties OtherProperties { get { return new GoalNestedProperties(); } set { } }
         
    }
    public class GoalNestedProperties  //doesn't exist in production
    {
        public bool boolProperty1 { get { return true; } set { } }
        public bool boolProperty2 { get { return false; } set { } }
        public string stringProperty1 { get { return "string 1"; } set { } }
        public string stringProperty2 { get { return "string 2"; } set { } }
        public int intProperty1 { get { return 10; } set { } }
        public override string ToString() { return ""; }
    }
}

And this is the XAML:
<Window x:Class="TelerikPropertyGrid.MainWindow"
    xmlns:local="clr-namespace:TelerikPropertyGrid"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <Grid x:Name="LayoutRoot" Background="White">
        <telerik:RadPropertyGrid x:Name="PropertyGrid1" Grid.Row="0" NestedPropertiesVisibility="Visible" SortAndGroupButtonsVisibility="Collapsed" SearchBoxVisibility="Collapsed" FieldIndicatorVisibility="Collapsed" DescriptionPanelVisibility="Collapsed"/>
        <telerik:RadPropertyGrid x:Name="PropertyGrid2" Grid.Row="0" AutoGeneratePropertyDefinitions="False" NestedPropertiesVisibility="Visible" SortAndGroupButtonsVisibility="Collapsed" SearchBoxVisibility="Collapsed" FieldIndicatorVisibility="Collapsed" DescriptionPanelVisibility="Collapsed">
            <telerik:RadPropertyGrid.PropertyDefinitions>
                <telerik:PropertyDefinition Binding="{Binding Name}" DisplayName="Name"/>
                <telerik:PropertyDefinition Binding="{Binding Age}" DisplayName="Age"/>
                <telerik:PropertyDefinition Binding="{Binding OtherProperties}" DisplayName="Other Properties" IsExpanded="True">
                    <telerik:PropertyDefinition.NestedProperties>
                        <telerik:PropertyDefinition Binding="{Binding boolProperty1}" DisplayName="boolProperty1"/>
                        <telerik:PropertyDefinition Binding="{Binding boolProperty2}" DisplayName="boolProperty2"/>
                        <telerik:PropertyDefinition Binding="{Binding stringProperty1}" DisplayName="stringProperty1"/>
                        <telerik:PropertyDefinition Binding="{Binding stringProperty2}" DisplayName="stringProperty2"/>
                        <telerik:PropertyDefinition Binding="{Binding intProperty1}" DisplayName="intProperty1"/>
                    </telerik:PropertyDefinition.NestedProperties>
                </telerik:PropertyDefinition>
            </telerik:RadPropertyGrid.PropertyDefinitions>
        </telerik:RadPropertyGrid>
    </Grid>
</Window>

Thanks in advance,

12 Answers, 1 is accepted

Sort by
0
Maor
Top achievements
Rank 1
answered on 31 Mar 2014, 07:33 AM
Any comment on how this can be done will be greatly appreciated.

If it can't be done please let me know that as well.
0
Vera
Telerik team
answered on 31 Mar 2014, 10:34 AM
Hello Maor,

I would suggest you to check RadPropertyGrid UnboundMode help article for a reference.

Regards,
Vera
Telerik
 

Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

 
0
Maor
Top achievements
Rank 1
answered on 31 Mar 2014, 11:06 AM
Hi Vera,

My main issue is #1 I need to display an object that has 3 properties like a single property without knowing how it looks like during the compilation-phase.

I have an object with:
public string PropertyName { get; set; }
public object PropertyValue { get; set; }
public Type PropertyType { get; set; }

PropertyName is the name of the so-called "property" I want the grid to show (AKA the display name).
PropertyValue is the value the property grid should display.
PropertyType is the type of the property and should determine which control the property grid should use (like combo box for enum, date time picker for DateTime etc).

I need the grid to display that object just like it would've displayed an object with only 1 property:
public PropertyType PropertyName { get; set; } //the value is PropertyValue

Please keep in mind that I have a collection of those object with an unknown size.
I'm not sure how I can define a dynamic number of properties in the XAML (the number changes during run-time multiple times).

From what I understand the Unbound mode (which I reviewed before posting the original question) requires me to know which nested properties I have while I'm coding and doesn't offer the ability to change it during run-time.
0
Maor
Top achievements
Rank 1
answered on 02 Apr 2014, 12:48 PM
Any comment on that?

How can I display a list of the objects I described in my post above as a list of properties?

Is this possible using your product?
0
Vera
Telerik team
answered on 03 Apr 2014, 10:27 AM
Hello Maor,

Generally, you can use DataTemplateSelector for this purpose but this is not recommended since RadPropertyGrid determines the editor for each PropertyDefinition based on the type of the respective bound property.


Regards,
Vera
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Nir
Top achievements
Rank 1
answered on 03 Apr 2014, 11:28 AM
Hi Vera,

Thank you for your reply.

After going through the DataTemplateSelector documentation and the demo once more we still don't see how our goal can be accomplished by it.

When I use the DataTemplateSelector it works on a single property.

Our goal is to transform 3 properties into a single property.

We don't want to change the visual aspect of the RadPropertyGrid and we're happy with how it looks.

We just need a way to tell the RadPropertyGrid to treat those 3 properties as a building block for a single property where one of our properties is the name, another is the type and the 3rd is the value of the new property we want to display.

After we will be able to transform the 3 properties into a single property we'll need to transform an ObservableCollection of objects which contain those 3 properties into a list of single properties.

If this gets too complicated for the forum we can move this discussion to a support ticket instead (our company has paid for support for "UI for WPF").

Thanks in advance,
Nir Moshe
0
Dimitrina
Telerik team
answered on 08 Apr 2014, 12:22 PM
Hello Nir,

As it turns out there is not an easy way to accomplish your exact requirement.

I would suggest you to consider using RadPropertyGrid based on how it is designed to work as explained with our documentation and examples on different use cases.

We apologize for the inconvenience.

Regards,
Didie
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Nir
Top achievements
Rank 1
answered on 09 Apr 2014, 10:11 AM
Thank you for your reply.
0
De
Top achievements
Rank 1
answered on 02 May 2014, 07:37 PM
Just an idea.  One can always create a transient/proxy class that wraps around those the properties that want to be wrapped.  Then expose the transient/proxy as a property so the RadPropertyGrid can bind to.  Any properties that don't want to be shown on UI can be decorated using [Browsable(false)].
0
Dimitrina
Telerik team
answered on 05 May 2014, 03:23 PM
Hello,

This is indeed correct. When using the Browsable attribute and having it set to false, this would make RadPropertyGrid skip the respective property. 

Regards,
Didie
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
0
Nir
Top achievements
Rank 1
answered on 12 May 2014, 12:24 PM
Hi Didie,

Can you elaborate a bit on that topic (an example will be great) please?

If it'll be more convenient than we can communicate through support ticket ID:814112.

Thanks,
Nir
0
Dimitrina
Telerik team
answered on 13 May 2014, 11:05 AM
Hello Nir,

You can expose a new property instead of the existing three. This is not directly related to RadPropertyGrid but to your data representation.
As to using the [Browsable(false)] attribute, please check the "DataAnnotations Support" WPF Demo. Using this specific attribute is not demonstrated, however, the approach would be similar.

Regards,
Didie
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
Tags
PropertyGrid
Asked by
Maor
Top achievements
Rank 1
Answers by
Maor
Top achievements
Rank 1
Vera
Telerik team
Nir
Top achievements
Rank 1
Dimitrina
Telerik team
De
Top achievements
Rank 1
Share this question
or