[ANN] PlateButton Control for wxPython

wxPython Users
1

Greetings,

The PlateButton is a custom owner drawn button control that in many ways emulates the buttons found on Safari's bookmark bar. It also offers a near complete implementation of the wxBitmapButton api and can as such be used as a drop in replacement for wxButton/wxBitmapButton under most circumstances.

Some Features:
- Four main style options
   - PB_STYLE_DEFAULT: Rounded shaped button with highlight color from current system theme
   - PB_STYLE_GRADIENT: Use a gradient highlight for focus and press states
   - PB_STYLE_SQUARE: Use a square shaped button
   - PB_STYLE_NOBG: Useful to get transparent appearance on Windows when parent window has a custom painted background.
- Fully customizable colors/fonts/ect..
- Use a Bitmap as a button, or just text, or both
- Optional drop down menu
- Change/Add bitmap, label, color, font at anytime and button updates instantly
- Transparent background lets it fit in on windows with non standard backgrounds (not completely working on gtk yet)

Known issues:
- Windows: Popup menu for some reason causes button to revert back to normal state when it should be in a pressed state till menu is dismissed.
- Windows: PopupMenu doesn't seem to fire an EVT_MENU_CLOSE as it does on Mac/Gtk which will under some circumstances leave the button in the wrong state after dismissing the menu.
- Gtk: Transparency (or the faking of it) doesn't work for non solid backgrounds (see Gradient Panel in demo)

For a more complete picture download the source and run the included demo (PlateButtonDemo.py):

Requirements:
python 2.4+, wxPython 2.8

Download Link:
http://editra.org/uploads/code/PlateButton.tar.gz

Bug reports and ideas for enhancement are of course very welcomed so let me know

Enjoy,

Cody Precord
http://editra.org

2

Hi Cody,

Here is a small piece of code it might help:

def HSB2RGB(hsb):
“”" hsb format: angle(hue).saturation.brightness"“”
h,s, b = map(int, hsb.split(“.”))

return map(lambda x: int(x*255), colorsys.hsv_to_rgb(h/360., s/100., b/100.))

I discovered that it is so much better to work in HSB when trying to work with colors.
I put this piece of code because I saw the AdjustColour method.

Also (this is a pet peeve) please try and make the demo sexy. I know it is a quick and dirty thing but seeing bad edges on icons and mask elements creeping into the picture gives an impression of amateur sloppiness and I know your are not an amateur. With the risk of increasing the demo size, pack in some nice PNG icons with proper transparency, nice shadows… that kind of thing.

Peter

···

On Dec 13, 2007 4:05 PM, Cody Precord codyprecord@gmail.com wrote:

Greetings,

The PlateButton is a custom owner drawn button control that in many
ways emulates the buttons found on Safari’s bookmark bar. It also
offers a near complete implementation of the wxBitmapButton api and

can as such be used as a drop in replacement for wxButton/
wxBitmapButton under most circumstances.

Some Features:

  • Four main style options
    • PB_STYLE_DEFAULT: Rounded shaped button with highlight color

from current system theme

  • PB_STYLE_GRADIENT: Use a gradient highlight for focus and press
    states
  • PB_STYLE_SQUARE: Use a square shaped button
  • PB_STYLE_NOBG: Useful to get transparent appearance on Windows

when parent window has a custom painted background.

  • Fully customizable colors/fonts/ect…
  • Use a Bitmap as a button, or just text, or both
  • Optional drop down menu
  • Change/Add bitmap, label, color, font at anytime and button updates

instantly

  • Transparent background lets it fit in on windows with non standard
    backgrounds (not completely working on gtk yet)

Known issues:

  • Windows: Popup menu for some reason causes button to revert back to

normal state when it should be in a pressed state till menu is
dismissed.

  • Windows: PopupMenu doesn’t seem to fire an EVT_MENU_CLOSE as it
    does on Mac/Gtk which will under some circumstances leave the button

in the wrong state after dismissing the menu.

  • Gtk: Transparency (or the faking of it) doesn’t work for non solid
    backgrounds (see Gradient Panel in demo)

For a more complete picture download the source and run the included

demo (PlateButtonDemo.py):

Requirements:
python 2.4+, wxPython 2.8

Download Link:
http://editra.org/uploads/code/PlateButton.tar.gz

Bug reports and ideas for enhancement are of course very welcomed so
let me know

Enjoy,

Cody Precord
http://editra.org

To unsubscribe, e-mail: wxPython-users-unsubscribe@lists.wxwidgets.org
For additional commands, e-mail:
wxPython-users-help@lists.wxwidgets.org

–
There is NO FATE, we are the creators.

3

Sorry Rich,
I have no clue what typo you’re talking about. :slight_smile:

Peter

···

On Dec 13, 2007 4:35 PM, Rich Shepard rshepard@appl-ecosys.com wrote:

On Thu, 13 Dec 2007, Peter Damoc wrote:

return map(lambda x: int(x*255), colorsys.hsv_to_rgb(h/360., s/100.,

^

Typo? Should it be ‘b?’

Rich

–
There is NO FATE, we are the creators.

4

Robin,

This is more a question to you. Is there like a standard "template"
for creating such a custom control? A lot of these pitfalls could be
omitted if there is let's say a best in class example of how the
custom control (derived from wx.PyControl) could work with most
methods filled in or at leasty documented that they need to be filled
in.

I'm asking this because I am close to releasing a code generator tool
called CVL which allows people to customize a code base like a
wx.PyControl to tailor it, and start their work from there. I am
already looking into creating a good solid wxPython Framework that
people can use (e.g. with standard menu, icons, toolbar, about box
etc).

With regards,
- Jorgen

···

On Dec 13, 2007 10:50 PM, Robin Dunn <robin@alldunn.com> wrote:

Cody Precord wrote:

> For a more complete picture download the source and run the included
> demo (PlateButtonDemo.py):
>

Looks nice. Here are a few tips for custom controls in general, and
also a few things I noticed about this one:

* You should allow all the standard widget args in the __init__ method,
so people don't have to look at your code to know what parameters it
accepts, or for tools like XRCed. You're missing pos, size, and name.
Pass them all on to the base class __init__.

* For playing nice with sizers you should call SetInitialSize from the
__init__, passing the size that was given as a parameter, default to
wx.DefaultSize. This will do a couple things. 1) will set the size of
the widget either to the size passed in, or to the best size if one or
both of the size components are given as default values. 2) Will set
the widget's minsize to the size given.

* Also for playing nice with sizers, and with the previous item, you
should implement a DoGetBestSize method that calculates and returns a
wx.Size that is the optimal size of the widget based on its label, font
size, image size, style, etc. In this case your DoGetBestSize could be
just your current __CalcBestSize without the lines at the end that
actually set the size. Let the user, sizer, or things like
SetInitialSize do that part for you instead. All your calls to
__CalcBestSize could probably be removed, or if you use CacheBestSize
then they can be replaced with InvalidaeBestSize.

* You can also override AcceptsFocus, although the default in the base
class is probably good enough for this widget....

* I noticed that the text color chosen on Windows for when the button is
in the pressed state is almost unreadable.

* I would make the activation key be WXK_SPACE on all platforms, not
just windows.

* You might also want to respond to EVT_CONTEXT_MENU for the buttons
with a menu. Then on Windows at least the user can get to the menu
without using the mouse, since there is a menu key on the keyboard.

* I notice that when tabbing between widgets that the previously focused
widget loses its highlight noticeably *after* the newly focused widget
is highlighted. This looks really really weird.

* Clicking a button isn't setting the focus there.

--
Robin Dunn
Software Craftsman
http://wxPython.org Java give you jitters? Relax with wxPython!

---------------------------------------------------------------------
To unsubscribe, e-mail: wxPython-users-unsubscribe@lists.wxwidgets.org
For additional commands, e-mail: wxPython-users-help@lists.wxwidgets.org

5

Hello,

Hi Cody,

Here is a small piece of code it might help:

def HSB2RGB(hsb):
“”" hsb format: angle(hue).saturation.brightness"“”
h,s, b = map(int, hsb.split(“.”))
return map(lambda x: int(x*255), colorsys.hsv_to_rgb(h/360., s/100., b/100.))

I discovered that it is so much better to work in HSB when trying to work with colors.
I put this piece of code because I saw the AdjustColour method.

Thanks

Also (this is a pet peeve) please try and make the demo sexy. I know it is a quick and dirty thing but seeing bad edges on icons and mask elements creeping into the picture gives an impression of amateur sloppiness and I know your are not an amateur. With the risk of increasing the demo size, pack in some nice PNG icons with proper transparency, nice shadows… that kind of thing.

Peter

This bothered me as well (the ArtProvider icons are unfortunately ugly on mac/msw anyway) so I bundled some icons from the Tango theme in the new version. Still need to do something about being able to generate nicer bitmaps for the disabled state however (if possible) as the edges come out quite rough even though shouldn’t be.

Download Link: Download Link: http://editra.org/uploads/code/PlateButton_v0.2.tar.gz

···

On Dec 13, 2007, at 8:21 AM, Peter Damoc wrote:

On Dec 13, 2007 4:05 PM, Cody Precord codyprecord@gmail.com wrote:

Greetings,

The PlateButton is a custom owner drawn button control that in many
ways emulates the buttons found on Safari’s bookmark bar. It also
offers a near complete implementation of the wxBitmapButton api and
can as such be used as a drop in replacement for wxButton/
wxBitmapButton under most circumstances.

Some Features:

  • Four main style options
    • PB_STYLE_DEFAULT: Rounded shaped button with highlight color
      from current system theme
    • PB_STYLE_GRADIENT: Use a gradient highlight for focus and press
      states
    • PB_STYLE_SQUARE: Use a square shaped button
    • PB_STYLE_NOBG: Useful to get transparent appearance on Windows
      when parent window has a custom painted background.
  • Fully customizable colors/fonts/ect…
  • Use a Bitmap as a button, or just text, or both
  • Optional drop down menu
  • Change/Add bitmap, label, color, font at anytime and button updates
    instantly
  • Transparent background lets it fit in on windows with non standard
    backgrounds (not completely working on gtk yet)

Known issues:

  • Windows: Popup menu for some reason causes button to revert back to
    normal state when it should be in a pressed state till menu is
    dismissed.
  • Windows: PopupMenu doesn’t seem to fire an EVT_MENU_CLOSE as it
    does on Mac/Gtk which will under some circumstances leave the button
    in the wrong state after dismissing the menu.
  • Gtk: Transparency (or the faking of it) doesn’t work for non solid
    backgrounds (see Gradient Panel in demo)

For a more complete picture download the source and run the included
demo (PlateButtonDemo.py):

Requirements:
python 2.4+, wxPython 2.8

Download Link:
http://editra.org/uploads/code/PlateButton.tar.gz

Bug reports and ideas for enhancement are of course very welcomed so
let me know

Enjoy,

Cody Precord
http://editra.org

To unsubscribe, e-mail: wxPython-users-unsubscribe@lists.wxwidgets.org
For additional commands, e-mail: wxPython-users-help@lists.wxwidgets.org

–
There is NO FATE, we are the creators.

6

Cody Precord schreef:

This bothered me as well (the ArtProvider icons are unfortunately ugly on mac/msw anyway) so I bundled some icons from the Tango theme in the new version. Still need to do something about being able to generate nicer bitmaps for the disabled state however (if possible) as the edges come out quite rough even though shouldn't be.

Stock icons seem to work great on Linux (as a linux user I consider them necessary), but are very crappy on Windows and Mac. So I mostly use them on Linux, but ship my own icons for windows and mac.
Stani

7

Hi Robin,

Thanks I will see if I can whip up something that can be used as a
base for custom controls once I get my app released.

Regards,
- Jorgen

···

On Dec 15, 2007 6:05 AM, Robin Dunn <robin@alldunn.com> wrote:

Jorgen Bodde wrote:
> Robin,
>
> This is more a question to you. Is there like a standard "template"
> for creating such a custom control? A lot of these pitfalls could be
> omitted if there is let's say a best in class example of how the
> custom control (derived from wx.PyControl) could work with most
> methods filled in or at leasty documented that they need to be filled
> in.

I gave this list in one of my OSCON talks, I think it is still mostly
accurate:

1. Derive from wx.PyControl. This enables reflection of some pertinent
C++ virtual methods to Python methods in the derived class.

2. Call SetInitialSize from the __init__ method, passing the size
passed to __init__. This helps set things up properly for sizers, and
also sets the size of the control appropriately (using either the size
given or the best size.)

3. Call InheritAttributes from the __init__ method. If the parent has
non-standard font or colors then it will set them for your control.

4. Implement a DoGetBestSize method, returning the wx.Size that would
best fit your control based on current font, label or other content, etc.

5. Implement an AcceptsFocus method, returning True if the control is
meant to receive the keyboard focus.

http://wxpython.org/OSCON2004/advanced/wxPython-Advanced-OSCON2004.pdf,
slide 114.

--

Robin Dunn
Software Craftsman
http://wxPython.org Java give you jitters? Relax with wxPython!

---------------------------------------------------------------------
To unsubscribe, e-mail: wxPython-users-unsubscribe@lists.wxwidgets.org
For additional commands, e-mail: wxPython-users-help@lists.wxwidgets.org

8

Hi Cody,

Hello,

Nice work cody!

It really looks useful to me .. one thing I noticed is that some of
the text in the buttons is truncated a bit too early, for example the
second "Normal w/Bitmap" is missing part of the p at the end.

Anyway, good work!
- Jorgen

The only way that I could see the text being able to get truncated is if wx is returning the wrong values for the font metrics, as the size of the button is based off of size of the bitmap+text width+padding on both ends and inbetween. I tried with a few different fonts on my machine and couldn't reproduce this problem. I have noticed a problem in the past with the text extents returning an incorrect width for double width characters such as Japanese/Chinese/ect.. Anyone else have experience with font measuring issues like this?

BTW, I'm not really sure this is related, but we actually have been investigating font measurement for wxWebKit recently, and I noticed that on GTK w/wxDC, GetTextExtent returns the actual string size, not the "bounding box" needed to render the string. This is not the case with Mac and Win (w/wxDC or wxGraphicsContext), which do include the "bounding box".

Regards,

Kevin

···

On Dec 14, 2007, at 9:28 AM, Cody Precord wrote:

On Dec 13, 2007, at 9:26 AM, Jorgen Bodde wrote:

Do you know what font is being used, or add 'print tbtn.GetFont().GetFaceName()' to the demo script after the button is made and see what it says.

What platform are you running under (mac/gtk/msw)?

Thanks,

Cody Precord
http://editra.org

---------------------------------------------------------------------
To unsubscribe, e-mail: wxPython-users-unsubscribe@lists.wxwidgets.org
For additional commands, e-mail: wxPython-users-help@lists.wxwidgets.org