RadControl Inheritance

[Jed]

We want to create our own UserControls that "inherit" the existing RadControls so that we can add a couple extra properties to each control if need be. Do you have any examples that I can reference that do this? I've already looked at the code examples supplied on the demo and I've seen the use of UserControls that "contain" RadControls; however, this does not fulfill our needs. With this method, the new UserControl's properties do not show the original RadControl properties that were made available.

Basically, I want to take the RadTreeView control, for example, and inherit everything into our own UserControl, apply our own styles template to that UserControl and when our developers actually use our new UserControl they will see our own style with all the original RadTreeView properties available in the designer, along with maybe a couple extra properties that we've programmed to fulfill our needs.

I'm not sure if I'm being 100% clear. Do you need any more details? I'm trying hard to make sense here.

Also, if this sounds like too much, will the source code be made available in the final release? If this were the case we could just append our own styles and properties to the existing source code. The only problem here would be if you were to update the controls we would have to make the changes manually.

Thanks.

[Valentin.Stoychev]

Hello Jed,

Thanks for the feedback. It is possible to inherit from our control. Actually this demo page - http://www.telerik.com/demos/silverlight/#Examples/TreeView/CustomLayout  - is done using this technique. It represents a PanelBar controls that inherits from TreeView and adds some additional fields, styles to it.

I'm attaching the files used in the example for your reference.

BTW: What styles you need to add to the TreeView control - do you think they should be in the TreeView control itself?

Kind regards,
Valentin.Stoychev
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Jed]

Thanks for the prompt response – very impressed. Thanks also for the example and file attachments. I have a deadline today so I can't look into the files until later, but after glancing at the example code it looks very promising.

As I am new to Silverlight, excuse my ignorance in all of this, but here are some properties that would be useful in the RadTreeView Control:

1. Expandable on single click – the entire node, not just the tiny arrow. The node would not be selectable in this case, of course. Its only purpose would be to expand into a deeper list, similar to the behavior of a RadMenu Control. We need this functionality because we are developing for mobile applications where users may have big fingers and they aren't expected to double-click and such.
2. Nodes expand top to bottom or bottom to top.
3. Nodes expand left to right or right to left.

That's all I can think of now, but the idea was originally just hypothetical. Providing a good foundation for expansion, we don't want to use these controls straight out of the box, but rather put them into containers that we can customize later if need be. This way, we can make major changes simply by modifying our one UserControl and if Telerik ever comes out with updates to a control we can easily upgrade versions without ruining whatever we already have in place. Granted, it's still possible that a Telerik update could affect our control, but it shouldn't be anything major.

[Valentin.Stoychev]

Hello Jed,

Great feedback - thanks!

Regards,
Valentin.Stoychev
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Jed]

Alright, I actually had some time to play around with the PanelBar Control. I think the word "inherit" is being used loosely here. Let me try to explain. When I load your RadMenu control into Expression Blend (June Preview) I find all properties I expect to find on the side panel. I even see this "ClickToOpen" checkbox that isn't found in other controls. This is obviously a unique property, exclusive to the RadMenu Control. That's excellent.

Now, say I want to create my own control called MyRadMenu. Instead of "class MyRadMenu : UserControl" in the code behind, I would instead say "class MyRadMenu : RadMenu". This way, technically, all the same properties would be available in MyRadMenu as were originally in the RadMenu, including the "ClickToOpen" checkbox. The problem with your perception of inheritance and the examples supplied on this website is that the user controls all inherit from UserControl instead of the specific RadControl. Also, I've noticed when I run the examples you have supplied that it totally screws up my design view in Expression Blend. I can't even *see* design view. And in the lucky case that I can see the design view? I can't edit the Control Parts Template, ItemTemplate and ItemsPanel, which all become grayed out.

I have to jet in 5 minutes, but let me add one last suggestion before I head out. I mentioned a similar request concerning the RadTreeView but now I want to focus more on the RadMenu, as I believe it will suit our needs better for this scenario. It has that great "ClickToOpen" checkbox, but what would be nice is if every RadMenuItem also was "ClickToOpen". In mobile applications we really can't rely on the mouse hover event so we need to show the menu hierarchy by clicks only.

I also wanted to say that I've spent a good number of days trying to customize the styles of the RadMenu and RadMenuItem controls and although I made progress, I was never really able to get the design we needed. For example, I just wanted the RadMenu to have a translucent black background with white text. I had no problems doing this per RadMenuItem, but getting the menu background itself to behave this way seemed impossible as far as I am concerned. I pretty much gave up after about 4 days of work. I don't know. Maybe the learning curve is more than I expected?

On a lighter note, I really like what you guys have produced here. The RadMenu control is awesome! I can increase the text size and everything works nicely and it knows its boundaries and limits. Only problem I saw was when I used a crazy long string of 80+ characters for a RadMenuItem and it just clipped off the page. I don't know if you guys have plans to do anything about that. I realize this is still just the CTP and there is much development to be done. The best of luck to you and thank you so much for your prompt responses. We are looking forward to incorporating these controls into our applications.

[Hristo]

Hi Jed,

First of all - thank you for the feedback - we are really eager to know what problems you face with the current CTP.

I see that you have hard time using Expression Blend. We had hard times too. Unfortunately this product is still not ready to be used with any Silverlight custom control. You do not have the ability to edit the template of the control and this is probably the biggest problem for you currently. The only option to style the control in this moment is to create the new templates manually (without using Blend). The Blend product will evolve when the Silverlight reaches its official release - now it is in Beta and we have to be patient.

About the inheritance - here is how it is done for the PanelBar examples:

public class RadPanelBar : RadTreeView
{
public RadPanelBar()
{
this.Selected += new EventHandler<RadRoutedEventArgs>(RadPanelBar_Selected);
}

void RadPanelBar_Selected(object sender, RadRoutedEventArgs e)
{
RadTreeViewItem ti = e.OriginalSource as RadTreeViewItem;
ti.IsSelected = false;

ti.IsExpanded = ti.IsExpanded == true ? false : true;

e.Handled = true;
}
}

We may consider adding "ClickToOpen" on RadMenuItem if there is demand for it.

Can I ask you to give us more information on the problem with the boundary detection mechanism in the RadMenu. It will be really helpful if you send us a screenshot of the issue you have, and also what you think is the correct behavior in your case.


Kind regards,
Hristo
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Jed]

Thanks. I had already tried this method before and I guess Expression Blend is just glitchy and you have to click around and build/refresh stuff before you see the original properties in design view. It appears to be working fine and well though. I'll keep you updated if something doesn't work properly.