Add Rad Controls to rad item collections

[Steve Batten]

Hello ,

how to add new controls in Rad item collection editor,I have list of controls but i need to add RadCheckedDropdownList in collection and use it in RadRibbonTab of RadRibbonForm.

Thanks in Advance.

[Dess | Tech Support Engineer, Principal]

Hello, Steve,  

RadCheckedDropDownList uses the RadCheckedDropDownListCollectionEditor for its Items collection. By default, only the RadCheckedListDataItem and DescriptionTextCheckedListDataItem are available because they are both typeof(RadCheckedListDataItem) which is the accepted type by the Items collection. if you need to display some of your custom RadCheckedListDataItems for example, it is necessary to implement a custom RadCheckedDropDownListCollectionEditor as follows:

    public RadForm1()
    {
        InitializeComponent();
    }

    public class CustomRadCheckedDropDownList : RadCheckedDropDownList
    {
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Content),
        Editor(typeof(CustomRadCheckedDropDownListCollectionEditor), typeof(UITypeEditor)),
        Category(Telerik.WinControls.RadDesignCategory.DataCategory)]
        [Description("Gets a collection representing the items contained in this RadCheckedDropDownList.")]
        public new RadCheckedListDataItemCollection Items
        {
            get
            {
                return (RadCheckedListDataItemCollection)this.DropDownListElement.Items;
            }
        }
    }

    public class CustomRadCheckedDropDownListCollectionEditor : Telerik.WinControls.Design.RadCheckedDropDownListCollectionEditor
    {
        public CustomRadCheckedDropDownListCollectionEditor(Type itemType) : base(itemType)
        {
        }

        protected override Type[] CreateNewItemTypes()
        {
            return new Type[] { typeof(RadCheckedListDataItem), typeof(DescriptionTextCheckedListDataItem), typeof(MyRadCheckedListDataItem) };
        }
    }

    public class MyRadCheckedListDataItem : RadCheckedListDataItem
    {
    }
}

I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik

[Steve Batten]

I also need to add DateTimePicker to Item Collection can you please help?

 

[Dess | Tech Support Engineer, Principal]

Hello, Steve,  

RadDateTimePicker is not a derivative of RadCheckedListDataItem which is the expected item's type in the Items collection. If I understand your requirement correctly you need to display a date time picker in the popup items. Since the RadCheckedDropDownList is a derivative of the RadDropDownList, you can easily create custom items which contain the desired inner elements, e.g. RadDateTimePickerElement. Here is a sample code snippet which result is illustrated in the attached screenshot:

public RadForm1()
{
    InitializeComponent();

    this.radCheckedDropDownList1.CreatingVisualListItem += radCheckedDropDownList1_CreatingVisualListItem;
}

private void radCheckedDropDownList1_CreatingVisualListItem(object sender, CreatingVisualListItemEventArgs args)
{
    args.VisualItem = new MyRadCheckedListVisualItem();
}

public class CustomRadCheckedDropDownList : RadCheckedDropDownList
{
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Content),
    Editor(typeof(CustomRadCheckedDropDownListCollectionEditor), typeof(UITypeEditor)),
    Category(Telerik.WinControls.RadDesignCategory.DataCategory)]
    [Description("Gets a collection representing the items contained in this RadCheckedDropDownList.")]
    public new RadCheckedListDataItemCollection Items
    {
        get
        {
            return (RadCheckedListDataItemCollection)this.DropDownListElement.Items;
        }
    }
}

public class CustomRadCheckedDropDownListCollectionEditor : Telerik.WinControls.Design.RadCheckedDropDownListCollectionEditor
{
    public CustomRadCheckedDropDownListCollectionEditor(Type itemType) : base(itemType)
    {
    }

    protected override Type[] CreateNewItemTypes()
    {
        return new Type[] { typeof(RadCheckedListDataItem), typeof(DescriptionTextCheckedListDataItem), typeof(MyRadCheckedListDataItem) };
    }
}

public class MyRadCheckedListDataItem : RadCheckedListDataItem
{
}

public class MyRadCheckedListVisualItem : RadCheckedListVisualItem
{
    RadDateTimePickerElement dtPicker;

    protected override void CreateChildElements()
    {
        base.CreateChildElements();
        dtPicker = new RadDateTimePickerElement();
        this.Children.Add(dtPicker);
        dtPicker.ValueChanged += dtPiceker_ValueChanged;
    }

    private void dtPiceker_ValueChanged(object sender, EventArgs e)
    {
        this.Data.Value = dtPicker.Value;
    }

    public override void Synchronize()
    {
        base.Synchronize();
        this.dtPicker.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
        if (this.Data is MyRadCheckedListDataItem)
        {
            dtPicker.Visibility = Telerik.WinControls.ElementVisibility.Visible;
            if (this.Data.Value != null)
            {
                dtPicker.ValueChanged -= dtPiceker_ValueChanged;
                this.dtPicker.Value = (DateTime)this.Data.Value;
                dtPicker.ValueChanged += dtPiceker_ValueChanged;
            }
        }
    }
}

The seventh item is the custom type: 



If it is not the exact requirement please specify in details what is the custom requirement that you are trying to achieve. Thus, we would be able to think about a suitable solution and assist you further.  


I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik

[Steve Batten]

I tried to add RaddateTimePicker but I am not able to convert  RaddateTimePicker  type to RadItem

 

  this.radRibbonBarButtonGroup2.Items.AddRange(new Telerik.WinControls.RadItem[] {
            this.checkBoxLastExport,
            this.checkBoxDaterange,
            this.checkBoxRefnumber,
            this.checkBoxReportType,
           (Telerik.WinControls.RadItem) this.dateTimePickerFrom,
            this.dateTimePickerTo,
            });

It gives error  Cannot convert type 'Telerik.WinControls.UI.RadDateTimePicker' to 'Telerik.WinControls.RadItem'

Can you please assist?

Thanks in Advance.

 

[Dess | Tech Support Engineer, Principal]

Hello, Steve,   

RadDateTimePicker is a control. The RadRibbonBarButtonGroup.Items collection expects elements. You can add a RadDateTimePickerElement:

this.radRibbonBarGroup1.Items.Add(new RadDateTimePickerElement());

I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik

[Steve Batten]

Hello Dess,

I have added this code in One class and tried to add it in itemcollection of Groupbox but it is not allowing

 

this.radRibbonBarGroup.Items.Add(new CustomRadCheckedDropDownList); gives errorcannot convert from 'CustomRadCheckedDropDownList' to 'Telerik.WinControls.RadItem' 

[Dess | Tech Support Engineer, Principal]

Hello, Steve,   

According to the provided information it seems that this is absolutely the same case as the previously described one. RadCheckedDropDownList is a control. The RadRibbonBarButtonGroup.Items collection expects elements. It doesn't accept controls. You can add a RadCheckedDropDownListElement: 

this.radRibbonBarGroup1.Items.Add(new RadCheckedDropDownListElement());

I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik

[Steve Batten]

Hello Dess, your information was helpful for me.

I have another question  can we use RadRibbonBar as TabBar, Means same as Tab Pages in Tab Control?.Every Tab Contol will have different view?

Thanks in advance.

[Dess | Tech Support Engineer, Principal]

Hello, Steve,    

By design, RadRibbonBar builds user interfaces similar to those used in Microsoft Office. It is supposed to offer a toolset of options arranged in different tabs. There is no container at the bottom that will be changed when you select a specific tab. RadPageView is more appropriate for this case. Additional information for it is available in the online documentation: https://docs.telerik.com/devtools/winforms/pageview/overview If you need to keep the rich UI provided by RadRibbonBar and show different pages according to the selected tab in the ribbon, you can use it in combination with RadPageView and hide the page tabs. Then, handle the RadRibbonBar.CommandTabSelected event and set the RadPageView.SelectedPage property to the relevant page: 

public RadForm1()
{
    InitializeComponent();

    foreach (RadPageViewPage page in this.radPageView1.Pages)
    {
        page.Item.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
    }
    this.radRibbonBar1.CommandTabSelected += radRibbonBar1_CommandTabSelected;
}

private void radRibbonBar1_CommandTabSelected(object sender, CommandTabEventArgs args)
{
    int tabIndex = this.radRibbonBar1.CommandTabs.IndexOf(args.CommandTab);
    if (tabIndex > -1 && this.radPageView1.Pages.Count > tabIndex)
    {
        this.radPageView1.SelectedPage = this.radPageView1.Pages[tabIndex];
    }
}

I hope this information helps. If you have any additional questions, please let me know. 
 

 

Regards,
Dess
Progress Telerik