Python - 如何更改此gtk.VScale的图标和背景图像，使其看起来像预期的界面？

Question

我有这个gtk.VScale，如何更改滑块的图标及其背景？

预期：

错：

代码：

import sys,os
import pygtk, gtk, gobject

class GTK_Main:
  def __init__(self):
    window = gtk.Window(gtk.WINDOW_TOPLEVEL)
    window.set_title("Test")
    window.set_default_size(500, 400)
    window.connect("destroy", gtk.main_quit, "WM destroy")

    hbox_eq = gtk.HBox()
    hbox_eq.set_size_request(200, 150)

    self.hscale_one = gtk.VScale()# gtk.HScale()
    self.hscale_one.set_range(-24, 12)
    hbox_eq.pack_start(self.hscale_one, True, True, 0)

    self.hscale_two =  gtk.VScale()# gtk.HScale()
    self.hscale_two.set_range(-24, 12)
    hbox_eq.pack_start(self.hscale_two, True, True, 0)

    vbox = gtk.VBox()
    vbox.pack_start(hbox_eq, False)
    window.add(vbox)
    window.show_all()

  def exit(self, widget, data=None):
    gtk.main_quit()

GTK_Main()
gtk.gdk.threads_init()
gtk.main()

编辑：黑客风格

gtk-toolbar-icon-size = small-toolbar

gtk-icon-sizes = "panel-menu=16,16:panel=8,8:gtk-button=16,16:gtk-large-toolbar=24,24:gtk-small-toolbar=16,16"

gtk-menu-popup-delay = 1 

gtk-enable-animations = 1  

gtk-tooltip-timeout = 970

style "default"
{

  GtkWidget::interior_focus         = 7
  GtkWidget::focus_padding         = 0

  GtkButton::child-displacement-x               = 0 
  GtkButton::child-displacement-y               = 1 
  GtkButton::default_border         = { 0, 0, 0, 0 }
  GtkButton::default_outside_border      = { 0, 0, 0, 0 }
  GtkButton::focus-padding                      = 0
  #GtkButton::inner-border                       = {0, 0, 0, 0}
  #GtkButton::button-relief                      = GTK_RELIEF_NONE
  #GtkButton::displace-focus                     = 1
  #GtkButton::shadow_type                        = GTK_SHADOW_NONE
  #GtkButton::image-spacing                      = 2
  #GtkButton::focus-padding                      = 0

  #GtkButtonBox::child_min_width                 = 0
  #GtkButtonBox::child_min_heigth                = 0
  #GtkButtonBox::child_internal_pad_x            = 0
  #GtkButtonBox::child_internal_pad_y            = 0

  #GtkColorButton::default_border                = {0, 0, 0, 0}
  #GtkColorButton::child-displacement-y          = 1

  #GtkComboBox::appears-as-list                  = 1
  #GtkComboBox::arrow-size                       = 10
  #GtkComboBox::shadow_type                      = GTK_SHADOW_OUT

  #GtkComboBoxEntry::appears-as-list             = 1

  GtkNotebook::tab-overlap                      = -2 
  #GtkNotebook::tab-curvature                    = 5

  #GimpColorNotebook::tab-border            = 1
  #GimpDockSeparator::height                = 10

  GtkVScale::slider_length          = 14
  GtkVScale::slider_width          = 15
  GtkVScale::focus-padding                      = 4
  GtkVScale::trough-side-details                = 0
   #GtkVScale::trough-border                      = 1
   #GtkVScale::value-spacing                      = 0
   #GtkVScale::trough-under-steppers              = 0
   #GtkVScale::arrow-displacement-x               = 0
   #GtkVScale::arrow-displacement-y               = 0
   #GtkVScale::activate_slider                    = 0

  GtkHScale::trough-side-details                = 0
  GtkHScale::focus-padding                      = 4
  GtkHScale::slider_length          = 10
  GtkHScale::slider_width          = 19 
  #GtkHScale::trough-border                       = 1
  #GtkHScale::value-spacing                       = 0
  #GtkHScale::trough-under-steppers               = 0
  #GtkHScale::arrow-displacement-x                = 0
  #GtkHScale::arrow-displacement-y                = 0
  #GtkHScale::activate_slider                     = 0

  GtkArrow::arrow-scaling                       = 0.4 

  GtkPaned::handle_size            = 1
  #GtkPaned::handle_width                        = 6

  GtkRange::trough_border         =0
  GtkRange::slider_width         =14
  GtkRange::stepper_size         =14
  #GtkRange::trough-border                        = 0
  #GtkRange::arrow-displacement-x                 = 0
  #GtkRange::arrow-displacement-y                 = 0
  #GtkRange::stepper-spacing                      = 0
  #GtkRange::trough-side-details                  = 0
  #GtkRange::trough-under-steppers                = 0

  #GtkScrollbar::fixed-slider-length              = 1 
  GtkScrollbar::min_slider_length      = 30
  #GtkScrollbar::slider_width                    = 16
  #GtkScrollbar::stepper_size                    = 24
  #GtkScrollbar::activate-slider                 = 0
  #GtkScrollbar::has-backward-stepper            = 1
  #GtkScrollbar::has-forward-stepper             = 1
  #GtkScrollbar::has-secondary-backward-stepper  = 0
  #GtkScrollbar::has-secondary-forward-stepper   = 0

  GtkCheckButton::indicator_size      = 16
  #GtkCheckButton::indicator_spacing           = 3
  #GtkCheckButton::focus-padding                 = 1

  #GtkCheckMenuItem::indicator-size              =17

  GtkRadioButton::indicator_size      = 16
  #GtkRadioButton::focus-padding                 = 1

  GtkMenuBar::shadow-type                   = GTK_SHADOW_NONE 
  GtkMenuBar::internal-padding                  = 4   
  #GtkMenuBar::button-relief                     = GTK_RELIEF_NONE

  GtkMenu::horizontal-padding                   = 2
  GtkMenu::vertical-padding                     = 2
  #GtkMenu::horizontal-offset                    = 0
  #GtkMenu::vertical-offset                      = 0
  #GtkMenu::double-arrows           = TRUE

  #GtkMenuItem::arrow-scaling                    = 0
  #GtkMenuItem::arrow-spacing                    = 0
  #GtkMenuItem::horizontal-padding               = 2
  #GtkMenuItem::toggle-spacing                   = 3
  #GtkMenuItem::selected-shadow-type             = GTK_SHADOW_NONE
  #GtkMenuItem::wide-separators = 1
  #GtkMenuItem::separator-width = 1
  #GtkMenuItem::separator-height = 1

  GtkExpander::expander-size                    = 12
  GtkExpander::expander-spacing                 = 2
  GtkProgressBar::max-horizontal-bar-height = 15
  GtkProgressBar::min-horizontal-bar-height = 15
  #GtkProgressBar::min-vertical-bar-width = 10
 #GtkProgressBar::xspacing = 2
#GtkProgressBar::yspacing = 10
  #GtkProgressBar::trough_border                  = 2

  #GtkStatusbar::shadow_type                      = GTK_SHADOW_NONE

  #GtkSpinButton::shadow_type                     = GTK_SHADOW_NONE
  #GtkSpinButton::inner-border                    = {0, 0, 0, 0}
  #GtkSpinButton::focus-padding                   = 1

  GtkToolButton::icon-spacing                    = 0

  GtkToolbar::internal-padding                  = 2
  GtkToolbar::shadow-type                   = GTK_SHADOW_NONE 
  #GtkToolbar::button-relief                     = GTK_RELIEF_NORMAL
  #GtkToolbar::space-size                        = 2
  #GtkToolbar::max-child-expand                  = 0
  #GtkToolbar::space-style                       = GTK_TOOLBAR_SPACE_LINE

  GtkDialog::action-area-border                 = 2
  GtkDialog::button-spacing                     = 3
  GtkDialog::content-area-border                = 1

  GtkOptionMenu::indicator_size         = { 15, 8 }
  GtkOptionMenu::indicator_spacing      = { 8, 2, 0, 0 }
  #GtkOptionMenu::focus-padding                  = 1

  GtkStatusbar::shadow_type         = GTK_SHADOW_NONE

  GtkSpinButton::shadow_type          = GTK_SHADOW_NONE
  #GtkSpinButton::focus-padding                  = 1

  #GtkScrolledWindow::scrollbar-spacing          = 3 
  #GtkScrolledWindow::scrollbars-within-bevel    = 1
  #GtkScrolledWindow::shadow_type                = GTK_SHADOW_NONE

  GtkTreeView::row_ending_details       = 0
  GtkTreeView   ::odd_row_color             = "#d4d4d4"
  GtkTreeView   ::even_row_color        = "#d8d8d8" 
  GtkTreeView::expander-size                    = 12
  GtkTreeView::vertical-separator               = 1
  GtkTreeView::horizontal-separator             = 4
  GtkTreeView::allow-rules                      = 1
  #GtkTreeView::indent-expanders                 = 1
  #GtkTreeView::row-ending-details               = 1

  GtkHTML::cite_color             = "#8e8e8e" 

  GtkWidget::link-color = "#0066ff"
  GtkWidget::visited-link-color = "#0f3a7b"
  GtkWidget::cursor-aspect-ratio                = 0.05
  GtkWidget::focus-line-width                   = 0
  #GtkWidget::scroll-arrow-hlength               = 16
  #GtkWidget::scroll-arrow-vlength               = 16
  #GtkWidget::separator-height                   = 0
  #GtkWidget::separator-width                    = 0
  #GtkWidget::wide-separators                    = 0

  #BonoboUiToolbar::shadow-type                  = GTK_SHADOW_NONE

  WnckTasklist::fade-overlay-rect               = 0
  WnckTasklist::fade-loop-time                  = 5.0
  #WnckTasklist::fade-max-loop                   = 50
  WnckTasklist::fade-opacity                    = 0.5

  NautilusIconContainer::highlight_alpha        = 145

  # The following line hints to gecko (and possibly other appliations)
  # that the entry should be drawn transparently on the canvas.
  # Without this, gecko will fill in the background of the entry.
  GtkEntry::honors-transparent-bg-hint          = 1
  #GtkEntry::inner-border = {1, 1, 1, 1}

  xthickness                               = 2
  ythickness                               = 2



  fg[NORMAL] = "#aaaaaa"
  fg[PRELIGHT] = "#cccccc"
  fg[SELECTED] = "#cccccc"
  fg[ACTIVE] = "#bbbbbb"
  fg[INSENSITIVE] = "#777777"

  bg[NORMAL] = "#2d2d2d"
  bg[PRELIGHT] = "#2d2d2d"
  bg[SELECTED] = "#454545"
  bg[ACTIVE] = "#2d2d2d"
  bg[INSENSITIVE] = "#2d2d2d"
 # bg_pixmap[NORMAL]    = "Others/bg.png"
  base[NORMAL] = "#d8d8d8"
  base[PRELIGHT] = "#d8d8d8"
  base[SELECTED] = "#777777"
  base[ACTIVE] = "#d8d8d8"
  base[INSENSITIVE] = "#d8d8d8"

  text[NORMAL] = "#000000"
  text[PRELIGHT] = "#000000"
  text[SELECTED] = "#000000"
  text[ACTIVE] = "#000000"
  text[INSENSITIVE] = "#222222"

  engine "pixmap"
  {
    image
    {
      function            = HANDLE
      recolorable         = TRUE
      overlay_file         = "Handles/handle-h.png"
      overlay_stretch   = FALSE
      orientation         = HORIZONTAL
    }
    image
    {
      function            = HANDLE
      recolorable         = TRUE
      overlay_file         = "Handles/handle-v.png"
      overlay_stretch   = FALSE
      orientation         = VERTICAL
    }

####################### SHADOWS ############################x

    image
    {
      function         = SHADOW
      shadow         = IN
      recolorable      = FALSE
      file            = "Shadows/shadow-in.png"
      border         = { 4, 4, 4, 4 }
      stretch         = TRUE
    }
    image
    {
       function      = SHADOW
       shadow         = OUT
       recolorable      = TRUE
       file            = "Shadows/shadow-out.png"
       stretch         = TRUE
    }

    image
    {
       function      = SHADOW
       shadow         = ETCHED_IN
       recolorable      = TRUE
       file            = "Shadows/shadow-in.png"            
       border         = { 4, 4, 4, 4 }
       stretch         = TRUE
    }
    image
    {
       function      = SHADOW
       shadow         = ETCHED_OUT
       recolorable      = TRUE
       file            = "Shadows/shadow-etched-out.png"
       border         = { 4, 4, 4, 4 }
       stretch         = TRUE
    }
    image
    {
       function         = SHADOW_GAP
       recolorable         = TRUE
       file               = "Frame-Gap/frame1.png"
       border            = { 2, 2, 2, 2 }
       stretch            = TRUE
       gap_start_file      = "Frame-Gap/frame-gap-start.png"
       gap_start_border   = { 2, 0, 2, 0 }
       gap_end_file      = "Frame-Gap/frame-gap-end.png"
       gap_end_border   = { 0, 2, 2, 0 }
       gap_side         = TOP
    }

    image
    {
       function      = VLINE
       recolorable      = TRUE
       file            = "Lines/line-v.png"
       border         = { 0, 0, 0, 0 }
       stretch         = TRUE
    }
    image
    {
      function         = HLINE
      recolorable      = TRUE
      file            = "Lines/line-h.png"
      border         = { 0, 0, 0, 0 }
      stretch         = TRUE
    }

    # focus

    image
    {
      function         = FOCUS
      recolorable      = TRUE
      file            = "Others/focus.png"
      border         = { 6, 0, 6, 0 }
      stretch         = TRUE
    }   

 # Arrows (all states)
      image
      {
       function      = ARROW
      recolorable      = TRUE
      state                   = NORMAL
      overlay_file      = "Arrows/arrow-up.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = UP
      }

      image
      {
      function      = ARROW
      state         = PRELIGHT
      recolorable      = TRUE
      overlay_file      = "Arrows/arrow-up-prelight.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = UP
      }

     image
      {
      function      = ARROW
      state         = ACTIVE
      recolorable      = TRUE
      overlay_file      = "Arrows/arrow-up-active.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = UP
      }

      image
      {
      function      = ARROW
      state         = INSENSITIVE
      recolorable      = TRUE
      overlay_file      = "Arrows/arrow-up-insensitive.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = UP
      }

      image
      {
            function      = ARROW
            state         = NORMAL
            recolorable      = TRUE
            overlay_file      = "Arrows/arrow-down.png"
            overlay_border      = { 0, 0, 0, 0 }
           overlay_stretch      = FALSE
           arrow_direction      = DOWN
      }

      image
      {
      function      = ARROW
      state         = PRELIGHT
      recolorable      = TRUE
      overlay_file      = "Arrows/arrow-down-prelight.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = DOWN
     }

     image
     {
      function      = ARROW
      state         = ACTIVE
      recolorable      = TRUE
      overlay_file      = "Arrows/arrow-down-pressed.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = DOWN
     }

     image
     {
      function      = ARROW
      state         = INSENSITIVE
      recolorable      = TRUE
      overlay_file      = "Arrows/arrow-down-insens.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = DOWN
     }

     image
     {
      function      = ARROW
      recolorable      = TRUE
      state                   = NORMAL
      overlay_file      = "Arrows/arrow-left.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = LEFT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = PRELIGHT
      overlay_file      = "Arrows/arrow-left-prelight.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = LEFT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = ACTIVE
      overlay_file      = "Arrows/arrow-left-active.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = LEFT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = INSENSITIVE
      overlay_file      = "Arrows/arrow-left-insensitive.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = LEFT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = NORMAL
      overlay_file      = "Arrows/arrow-right.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = RIGHT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = PRELIGHT
      overlay_file      = "Arrows/arrow-right-prelight.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = RIGHT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = ACTIVE
      overlay_file      = "Arrows/arrow-right-active.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = RIGHT
      }

      image
      {
      function      = ARROW
      recolorable      = TRUE
      state                   = INSENSITIVE
      overlay_file      = "Arrows/arrow-right-insensitive.png"
      overlay_border      = { 0, 0, 0, 0 }
      overlay_stretch      = FALSE
      arrow_direction      = RIGHT
      }

  }
}

class "GtkWidget" style "default"

include"styles/tooltips"
include "styles/oo"
include"styles/button"
include"styles/entry"
include "styles/inactivetext"
include"styles/toolbar"
include"styles/optionmenu"
include"styles/handlebox"
include"styles/menu-menubar"
include"styles/panel"
include"styles/notebook"
include"styles/listheader"
include"styles/spin"
include"styles/scrollbar"
include"styles/statusbar"
include"styles/progressbar"
include"styles/range"
include"styles/checkbutton"
include"styles/radiobutton"
include"styles/combo"
include "styles/murrine-style-images-and-labels"
include "styles/inactivetext"
#include"Icons/iconrc"

Answer 1

好的 - 它有效。

参考文献1：https://wiki.gnome.org/GnomeArt/Tutorials/GtkEngines/PixmapEngine

参考文献2：https://wiki.gnome.org/GnomeArt/Tutorials/GtkThemes/GtkScrollbar

参考文献3：http://www.pygtk.org/articles/writing-a-custom-widget-using-pygtk/writing-a-custom-widget-using-pygtk.htm

参考文献4：http://zetcode.com/tutorials/gtktutorial/customwidget/

我在这里使用了参考文献1：

import sys,os
import pygtk, gtk, gobject

class GTK_Main:
  def __init__(self):

    """ Design!!! """   

button_rc = """
pixmap_path "/var/tmp"

style "default-style" {

  GtkVScale::slider_length          = 14
  GtkVScale::slider_width          = 15
  GtkVScale::focus-padding                      = 4
  GtkVScale::trough-side-details                = 0
  GtkVScale::trough-border                      = 1
  GtkVScale::value-spacing                      = 0
  GtkVScale::trough-under-steppers              = 0
  GtkVScale::arrow-displacement-x               = 7
  GtkVScale::arrow-displacement-y               = 0
  GtkVScale::activate_slider                    = 0

  xthickness = 1
  ythickness = 1

  #bg[NORMAL] = "#f6f6f6"
  fg[NORMAL] = "#000000"
}
class "GtkWidget" style "default-style"

style "deButton" {
  fg[PRELIGHT] = { 0, 1.0, 1.0 }
  bg[PRELIGHT] = { 0, 0, 1.0 }
  bg[ACTIVE] = { 1.0, 0, 0 }
  fg[ACTIVE] = { 0, 1.0, 0 }
  bg[NORMAL] = { 1.0, 1.0, 0 }
  fg[NORMAL] = { .99, 0, .99 }
  bg[INSENSITIVE] = { 1.0, 1.0, 1.0 }
  fg[INSENSITIVE] = { 1.0, 0, 1.0 }

  engine "pixmap" {
      image {
          function = SLIDER
          orientation = VERTICAL
          file     = "a.png"
          stretch  = TRUE
      }
     image {
            function = BOX
            orientation = VERTICAL
            file = "b.gif"
            border = { 0, 0, 32, 32}
            stretch = TRUE
     }
  }
  bg_pixmap[NORMAL] = "b.gif"
}

widget "*.deButton" style "deButton"

"""

    window = gtk.Window(gtk.WINDOW_TOPLEVEL)
    window.set_title("Test")
    window.set_default_size(500, 400)
    window.connect("destroy", gtk.main_quit, "WM destroy")
    gtk.rc_parse_string(button_rc)                       # 2

    hbox_eq = gtk.HBox()
    hbox_eq.set_size_request(200, 150)

    self.hscale_one = gtk.VScale()# gtk.HScale()
    self.hscale_one.set_range(-24, 12)
    self.hscale_one.set_name("deButton")                  # 3

    hbox_eq.pack_start(self.hscale_one, True, True, 0)

    self.hscale_two =  gtk.VScale()# gtk.HScale()
    self.hscale_two.set_range(-24, 12)
    hbox_eq.pack_start(self.hscale_two, True, True, 0)

    vbox = gtk.VBox()
    vbox.pack_start(hbox_eq, False)
    window.add(vbox)
    window.show_all()

  def exit(self, widget, data=None):
    gtk.main_quit()

GTK_Main()
gtk.gdk.threads_init()
gtk.main()