Change ColorDialog in Conditional Formatting Form

5 posts, 1 answers
  1. Christian
    Christian avatar
    44 posts
    Member since:
    May 2012

    Posted 20 Nov 2018 Link to this post

    Hi,

    is there any way to access the the color dialog which is created from within the conditional formatting forms property grid? 

    the main problem ist, by default the color has alpha 0, so when the user selects a color from the colorwheel the alpha always stays at 0 and has be changed manually (99% of the normal users don't even know what the alpha channel is)

    Also there is no way to hide certain tabs or make the "Basic" tab the default one.

    It would be nice if the conditional formatting form was more accessible from code, also it lacks some features:

    • Dialog is not sizable (should be higher by default) so you have to scroll inside the property grid every time
    • No option to clear/delete all entries
    • No option to copy a entry

    I'd make my own formatting dialog it there was an easy way to override the default behaviour! Or is there an easy way?

     

    Kind Regards,

    Christian

     

     

     

  2. Answer
    Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3759 posts

    Posted 20 Nov 2018 Link to this post

    Hello, Christian, 

    I am not sure what customizations exactly you need to do inside the ConditionalFormattingForm. However, there is a convenient API to replace the default ConditionalFormattingForm with a custom one. It is necessary to subscribe to the RadGridView.CreateCell event at design time and follow the demonstrated approach below. Feel free to extend the example in a way which suits your requirement best: 

    private void radGridView1_CreateCell(object sender, Telerik.WinControls.UI.GridViewCreateCellEventArgs e)
    {
        if (e.CellType == typeof(GridHeaderCellElement))
        {
            e.CellElement = new CustomGridHeaderCellElement(e.Column, e.Row);
        }
    }
     
    public class CustomGridHeaderCellElement : GridHeaderCellElement
    {
        protected override Type ThemeEffectiveType    
        {
            get   
            {
                return typeof(GridHeaderCellElement);    
            }
        }
         
        public CustomGridHeaderCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
        {
        }
     
        protected override ConditionalFormattingForm CreateConditionalFormattingForm()
        {
            return new CustomConditionalFormattingForm(this.GridControl, this.ViewTemplate,
                this.ColumnInfo as GridViewDataColumn, this.ElementTree.ThemeName);
        }
    }
     
    public class CustomConditionalFormattingForm : ConditionalFormattingForm
    {
        public CustomConditionalFormattingForm(RadGridView radGridView, GridViewTemplate template, GridViewDataColumn column, string themeName)
            : base(radGridView, template, column, themeName)
        {
        }
    }

    As to the color dialog, you can find below a sample code snippet how to access the RadColorDialogForm and change the selected tab to be "Basic": 

    public RadForm1()
    {
        InitializeComponent();
        this.radGridView1.ConditionalFormattingFormShown += radGridView1_ConditionalFormattingFormShown;
    }
     
    private void radGridView1_ConditionalFormattingFormShown(object sender, EventArgs e)
    {
        ConditionalFormattingForm cf = sender as ConditionalFormattingForm;
        RadPropertyGrid propertyGrid = cf.Controls["radPropertyGridProperties"] as RadPropertyGrid;
        propertyGrid.EditorInitialized += propertyGrid_EditorInitialized;
    }
     
    private void propertyGrid_EditorInitialized(object sender, PropertyGridItemEditorInitializedEventArgs e)
    {
        PropertyGridColorEditor editor = e.Editor as PropertyGridColorEditor;
        if (editor != null)
        {
            RadColorBoxElement colorBox = editor.EditorElement as RadColorBoxElement;
            if (colorBox != null)
            {
                RadColorDialogForm colorForm = colorBox.ColorDialog.ColorDialogForm as RadColorDialogForm;
                colorForm.Shown -= colorForm_Shown;
                colorForm.Shown += colorForm_Shown;
            }
        }
    }
     
    private void colorForm_Shown(object sender, EventArgs e)
    {
        RadColorDialogForm colorForm = sender as RadColorDialogForm;
        if (colorForm != null)
        {
            RadColorSelector selector = colorForm.RadColorSelector as RadColorSelector;
            // 0 -> Basic tab
            // 1 -> System tab
            // 2 -> Web tab
            // 3 -> Professional tab
            selector.ControlsHolderPageView.SelectedPage = selector.ControlsHolderPageView.Pages[0];
        }
    }

    Note that the RadColorSelector is a UserControl that internally uses a RadPageView. Each tab represents a separate page. So, if you want to access a certain control, you need to get it from the Controls collection of the selected page. The code snippet below shows how to change the default value for the alpha:

    private void colorForm_Shown(object sender, EventArgs e)
    {
        RadColorDialogForm colorForm = sender as RadColorDialogForm;
        if (colorForm != null)
        {
            RadColorSelector selector = colorForm.RadColorSelector as RadColorSelector;
            Telerik.WinControls.UI.RadColorPicker.ProfessionalColors professionalColors =
                selector.ControlsHolderPageView.Pages[3].Controls["professionalColorsControl"] as Telerik.WinControls.UI.RadColorPicker.ProfessionalColors;
            RadSpinEditor alphaEdotor = professionalColors.Controls["tableLayoutPanel1"].Controls["numAlpha"] as RadSpinEditor;
            alphaEdotor.Value = 255;
        }
    }

    I hope this information helps. If you need any further assistance please don't hesitate to contact me. 

    Regards,
    Dess | Tech Support Engineer, Sr.
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Christian
    Christian avatar
    44 posts
    Member since:
    May 2012

    Posted 21 Nov 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Hi Dess,

    looks promising, I'll try that!

  4. Christian
    Christian avatar
    44 posts
    Member since:
    May 2012

    Posted 26 Nov 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    My initial problem is solved. Changing the alpha to 255 and hiding the System/Web tabs.

    But making a 100% custom ConditionalFormattingForm is not possible with the provided code, since you have to inherit from ConditionalFormattingForm. What would work: override 
    GridHeaderCellElement.CreateContextMenuItems get the ConditionalFormattingMenuItem and replace it and from that call the custom formatting form.

    Would be nice if the GridHeaderCellElement.CreateConditionalFormattingMenuItems (all Create...MenuItems) were protected instead of private..

  5. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3759 posts

    Posted 26 Nov 2018 Link to this post

    Hello, Christian,   

    I am glad that the initial requirement that you had is now resolved. As to the custom ConditionalFormattingForm, indeed, it is not an easy task to create a completely new dialog as it will require a lot of work. However, the previously demonstrated code snippet shows how to create a custom GridHeaderCellElement and override its CreateConditionalFormattingForm method where you can pass your own instance which is a derivative of the ConditionalFormattingForm. Note that you can clear the Controls collection of the form and then add any UserControl that you designed. This seems to be a suitable approach.

    Should you have further questions please let me know.

    Regards,
    Dess | Tech Support Engineer, Sr.
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top