The image is not the same size so it looks like I need to use both.  Could you point me in the right direction as to what UIElement I need to modify for both the Draw and Creation filters?

Thanks Mike

Hi Derek,

I took a look and resizing the button is actually pretty easy. But removing the dropdown arrow is actually more complicated than I thought. It's going to depend a lot on what ButtonDisplayStyle you are using and whether or not Themes are turned on.

Here's a CreationFilter that resize the button to the size of the image, ignoring the dropdown arrow:

public class MyCreationFilter : IUIElementCreationFilter
    {
        void IUIElementCreationFilter.AfterCreateChildElements(UIElement parent)
        {
            var editorButtonUIElement = parent as EditorButtonUIElement;
            if (null == editorButtonUIElement)
                return;

            var imageAndTextUIElementEx = editorButtonUIElement.GetDescendant(typeof(ImageAndTextUIElementEx)) as ImageAndTextUIElementEx;
            if (null == imageAndTextUIElementEx)
                return;
            
            Rectangle parentRect = editorButtonUIElement.Parent.Rect;
            Rectangle newRect = parentRect;
            int buttonWidth = imageAndTextUIElementEx.Image.Size.Width + 2;
            newRect.Width = buttonWidth;
            newRect.X = parentRect.Right - buttonWidth;
            
            editorButtonUIElement.Rect = newRect;
            imageAndTextUIElementEx.Rect = newRect;
        }

        bool IUIElementCreationFilter.BeforeCreateChildElements(UIElement parent)
        {
            return false;
        }
    }

If your image is opaque and happens to cover the dropdown arrow, then you're done. But if you can still see part of the arrow behind the image, things are going to get tricky.

If you are using themes, then there's not much you can do. The themed drawing is handling by the OS and it's all or nothing. You cannot remove the arrow without also losing everything - the borders, the background, the hottracking, etc. One possible solution would be to make your image such that it covers the arrow, or use a DrawFilter to draw a solid background over the arrow.

If you turn off themes, then you can prevent the arrow from drawing with a DrawFilter like this:

 public class MyDrawFilter : IUIElementDrawFilter
    {
        bool IUIElementDrawFilter.DrawElement(DrawPhase drawPhase, ref UIElementDrawParams drawParams)
        {
            return true;
        }

        DrawPhase IUIElementDrawFilter.GetPhasesToFilter(ref UIElementDrawParams drawParams)
        {
            if (drawParams.Element is EditorButtonUIElement)
            {
                return DrawPhase.BeforeDrawForeground;
            }

            return DrawPhase.None;
        }
    }

Thanks Mike for the prompt response.  Unfortunately that solution did not work for me.  I was able to do what I needed by adding another button to the control which was just an EditorButton and setting the visiblitly of the DropDownButton to false.  Then when the EditorButton is clicked I DropDown() the DropDownButton.  Easy as that.  Thanks

That sounds a lot easier than what I my way. :)

You might need to handle keyboard support though. Make sure Ctrl+down arrow works.