Custom trackbar editor keeps the value displayed underneath

[Antoine]

Using the custom editor code sample for Telerik winforms found on the Telerik website, I override the BaseInputEditor
to provide my propertyGrid with a trackbar editor.

Now, I implemented the onEditorRequired method as explained to replace the basic edition mode for
any int property.

I'm using the RadPropertyStore mechanism to fill my property grid.

I've no problem with having the value displayed as a number when the editor is not activated, but I'm
not willing to have the value being displayed underneath the track bar as I'm editing the value.

Anyway, I would be looking for having the track bar always displayed even if the property is not being
edited as it will be used for an opacity setting.

Thanks in advance,
Antoine

[Anton]

Hello Antoine,

Thank you for writing.

RadPropertyGrid uses UI virtualization for its elements, thus showing the track bar at all times is not recommended, because the cells are being reused to show different data. 

I would suggest that you stay with the editor approach considering that you are using the example from our documentation. Here is how to hide the undesired text:

1. Add the following code snippet into BeginEdit() method in your custom editor:

PropertyGridItemElement element = this.OwnerElement as PropertyGridItemElement;
          element.ValueElement.DrawText = false;

 
2. Also add the following code into EndEdit() method.

PropertyGridItemElement element = this.OwnerElement as PropertyGridItemElement;
element.ValueElement.DrawText = true;

Should you have any other questions, I will be glad to assist you.

Greetings,
Anton
the Telerik team

[Antoine]

I've tried the workaround you've provided and this is perfectly working for editing the numeric value.

Unfortunately, I've been asking some of my colleagues/clients for a feedback, and almost everyone
found it weird to not have the track bar displayed all the time.

Moreover, I'm looking forward to customize more properties with controls like buttons,
gradients and what so ever...

Should I encapsulate the property (double Opacity) in some custom class and write some UITypeEditor to do so ?
I'm not even sure that would make sense...

Thanks again.

Antoine.

[Anton]

Hello Antoine,

Thank you writing back.

There is an approach that will allow for making the trackbar visible all the time. You should create a custom property grid item element that derives from PropertyGridItemElement:

public class CustomPropertyGridItem : PropertyGridItemElement
 {
     private RadTrackBarElement trackbar;

     public RadTrackBarElement Trackbar
     {
         get { return this.trackbar; }
     }

     protected override void CreateChildElements()
     {
         base.CreateChildElements();

         this.trackbar = new RadTrackBarElement();
         this.trackbar.Scroll += trackbar_Scroll;
         this.ValueElement.DrawText = false;
         this.ValueElement.Children.Add(this.trackbar);
     }

     public override void Synchronize()
     {
         base.Synchronize();

         PropertyGridItem item = this.Data as PropertyGridItem;

         this.trackbar.Value = (int)item.Value;
     }

     private void trackbar_Scroll(object sender, ScrollEventArgs e)
     {
         ((PropertyGridItem)this.Data).Value = e.NewValue;
     }

     public override void AddEditor(IInputEditor editor)
     { }

     public override void RemoveEditor(IInputEditor editor)
     { }

     public override bool IsCompatible(PropertyGridItemBase data, object context)
     {
         PropertyGridItem item = data as PropertyGridItem;
         return (item != null && item.PropertyType == typeof(int));
     }

     protected override Type ThemeEffectiveType
     {
         get { return typeof(PropertyGridItemElement); }
     }
 }

Then use the CreateItemElement event instead of EditorRequired event to set the custom permanent editors:

private void radPropertyGrid1_CreateItemElement(object sender, CreatePropertyGridItemElementEventArgs e)
{
    PropertyGridItem item = e.Item as PropertyGridItem;

    if (item != null)
    {
        if (item.PropertyType == typeof(int))
        {
            e.ItemElementType = typeof(CustomPropertyGridItem);
        }
        else if (item.PropertyType == typeof(bool))
        {
            e.ItemElementType = typeof(CommonPropertyGridCheckboxItemElement);
        }
        else
        {
            e.ItemElementType = typeof(CommonPropertyGridItemElement);
        }
    }
}

Please note that the existense of many additionally included elements may result in slower property grid control.

In regards to you second question, you can use same approach for all editors that you need to be visible all the time.

Attached you can find a sample project that demonstrates how the code snippets above work.

I hope this information will help.

Regards,
Anton
the Telerik team

[Victor]

Hi,

I have implemented the method outlined in the example and the Track Bar on the Property Grid is displaying as expected. One issues I am having is when I click in the area of the Track Bar the Thumb begins to animate and constantly moves between tick marks. I have looked through the site and docs to see if I could find a setting similar to the WPF track bars SnapToTicks. I found something about SnapMode but have not been able to see how to set it.

Can someone let me know how to keep the thumb from moving on its own once a user clicks in the track bar?

Thanks,
Victor

[Anton]

Hi Victor,

Thank you for writing.

The current version of RadTrackBar does not support different snapping modes. However we are working on improving this control and the new version (planned for Q2 2013) will support such functionality.

Let us know if you have any other questions

Greetings,
Anton
the Telerik team