Add another dropdown button to own devexpres PopupContainerEdit with same style behaviour

Question

We've got custom PopupContainerEdit that inherits from DevExpress'es PopupContainerEdit. One of our custom features is another dropdown button (EditorButton with kind = ButtonPredefines.Glyph) that acts like the default one except, it opens different PopupContainerControl. Everything works as intended except button's style coloring. The button acts like default button - that means it doesn't support state coloring (checked/unchecked) when dropdown is visible/hidden. I couldn't find any custom draw event/method for EditorButton.

Is it possible to achieve such behaviour? If so, how?

@edit

Simple example of the above situation.

• Default PopupContainerEdit looks like image A. When you click on the button (triangle like), dropdown shows and button goes into checked state.
• Our PopupContainerEdit (that inherits from default) looks like B.
• C, D is coloring example when you hover the button.
• E is checked state coloring for default button (it works like that by DevExpress'es design).
• F is our button behaviour - acts like normal button.
• G is what we want - checked state coloring for our button

Our approach to create custom button:

string TheToolTipText = "The text";
string OurButtonTag = "TheButton";
Image TheIcon = new Image(); // just example ...

EditorButton customButton = new EditorButton();
customButton.Width = 16;
customButton.Image = TheIcon;
customButton.ToolTip = TheToolTipText;
customButton.Tag = OurButtonTag;
customButton.Kind = ButtonPredefines.Glyph;
this.Properties.Buttons.Add(customButton);

To be honest there's nothing more to show. We're not aware of any custom Draw event or similar things.

Answer 1

There are two properties in RepositoryItemPopupContainerEdit that are responsible for this behavior. Fisrt one is RepositoryItemPopupBase.ActionButtonIndex property. It's value specifying which editor button will open the editor's dropdown window. The second one is RepositoryItemPopupContainerEdit.PopupControl which sets the control to display in the popup window. So, by manipulating with this two properties, you can achieve the desired behavior.

Here is example:

0. RepositoryItemPopupContainerEdit descendant

Because you need to show two different PopupContainerControl you can create additional properties for each of your controls in your custom RepositoryItem.

public class RepositoryItemCustomEdit1 : RepositoryItemPopupContainerEdit
{
    #region Some default stuff for custom repository item (constructors, registration, etc).
    static RepositoryItemCustomEdit1() { RegisterCustomEdit1(); }
    public const string CustomEditName = "CustomEdit1";
    public RepositoryItemCustomEdit1() { }
    public override string EditorTypeName { get { return CustomEditName; } }
    public static void RegisterCustomEdit1()
    {
        Image img = null;
        EditorRegistrationInfo.Default.Editors.Add(new EditorClassInfo(
            CustomEditName, 
            typeof(CustomEdit1), 
            typeof(RepositoryItemCustomEdit1),
        //For v13.2 you need to use custom ViewInfo class. So, here is CustomEdit1ViewInfo.
        //For v15.1 you can use the base PopupContainerEditViewInfo.
            typeof(CustomEdit1ViewInfo),
            new ButtonEditPainter(), 
            true, 
            img));
    }
    #endregion

    #region Hide base PopupContainerControl properties in designer.
    [Browsable(false)]
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
    public override PopupContainerControl PopupControl
    {
        get { return base.PopupControl; }
        set { base.PopupControl = value; }
    }

    [Browsable(false)]
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
    public override int ActionButtonIndex
    {
        get { return base.ActionButtonIndex; }
        set { base.ActionButtonIndex = value; }
    }
    #region

    #region First PopupContainerControl properties
    public int DefaultActionButtonIndex { get; set; }
    public PopupContainerControl DefaultPopupControl { get; set; }
    #endregion

    #region Another PopupContainerControl properties
    public int DifferentActionButtonIndex { get; set; }
    public PopupContainerControl DifferentPopupControl { get; set; }
    #endregion

    public override void Assign(RepositoryItem item)
    {
        BeginUpdate();
        try
        {
            base.Assign(item);
            RepositoryItemCustomEdit1 source = item as RepositoryItemCustomEdit1;
            if (source == null) return;

            DefaultActionButtonIndex = source.DefaultActionButtonIndex;
            DefaultPopupControl = source.DefaultPopupControl;

            DifferentPopupControl = source.DifferentPopupControl;
            DifferentActionButtonIndex = source.DifferentActionButtonIndex;
        }
        finally
        {
            EndUpdate();
        }
    }
}

You can see new properties in your designer:

1. PopupContainerEdit descendant

Now you can use this properties in your custom Edit class.

public class CustomEdit1 : PopupContainerEdit
{
    #region Some default stuff for custom edit (constructors, registration, etc).
    static CustomEdit1() { RepositoryItemCustomEdit1.RegisterCustomEdit1(); }
    public CustomEdit1() { }
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
    public new RepositoryItemCustomEdit1 Properties { get { return base.Properties as RepositoryItemCustomEdit1; } }
    public override string EditorTypeName { get { return RepositoryItemCustomEdit1.CustomEditName; } }
    #endregion

    protected override bool IsActionButton(EditorButtonObjectInfoArgs buttonInfo)
    {
        int buttonIndex = Properties.Buttons.IndexOf(buttonInfo.Button);

        if (buttonIndex == Properties.DefaultActionButtonIndex ||
            buttonIndex == Properties.DifferentActionButtonIndex)
        {
            //Set the Properties.ActionButtonIndex value according to which button is pressed:
            Properties.ActionButtonIndex = buttonIndex;

            //Set the Properties.PopupControl according to which button is pressed:
            if (buttonIndex == Properties.DefaultActionButtonIndex)
                Properties.PopupControl = Properties.DefaultPopupControl;
            else
                Properties.PopupControl = Properties.DifferentPopupControl;

            return true;
        }

        return false;                
    }
}

2. PopupContainerEditViewInfo descendant

For v13.2 you need to use custom ViewInfo class for your editor:

public class CustomEdit1ViewInfo : PopupContainerEditViewInfo
{
    public CustomEdit1ViewInfo(RepositoryItem item) : base(item) { }

    public new RepositoryItemPopupBase Item { get { return base.Item as RepositoryItemCustomEdit1; } }

    //Show the pressed state when button is pressed or when popup is open.
    protected override bool IsButtonPressed(EditorButtonObjectInfoArgs info)
    {
        var hitObject = PressedInfo.HitObject as EditorButtonObjectInfoArgs;

        return
            (hitObject != null && hitObject.Button == info.Button) ||
            (IsPopupOpen && Item.ActionButtonIndex == info.Button.Index);
    }
}

Result

In the result you will get something like this:

and