Version 4 of Fixing the Mac OS X scrollbar

Updated 2018-10-15 15:43:54 by bll

Fixing the Mac OS X scrollbar

bll 2018-10-15: The Mac OS X scrollbar in 8.6.8 and in 8.6.9 continue to have issues with being able to grab the scrollbar with the cursor and having the cursor offset from the scrollbar.

Simple test:

package require Tk
set l [font names]
ttk::combobox .cb -values $l -height 4
pack .cb

To get a non-aqua scrollbar while using the aqua theme, the scrollbar can be styled upon instantiation. This also has the side effect of using the unix scrollbar code and not the Mac OS X scrollbar code, which means that there are no more problems grabbing the scrollbar.

But the default non-aqua scrollbar is not styled the same as aqua. The aqua.tcl code below will style the scrollbar to match the aqua scrollbar (the sizing is not identical).

To use this code, you must use the -style Vertical.TScrollbar or -style Horizontal.TScrollbar option to ttk::scrollbar upon instantiation.

The other problem with scrollbars on Mac OS X is when using a ttk::combobox. ttk::combobox is currently coded to use a non-ttk scrollbar on Mac OS X (and it is checking the windowing system, not the theme). Included below is a patch that (a) changes ttk/combobox.tcl to use the ttk::scrollbar, and (b) to always apply the Vertical.TScrollbar styling. This particular patch is meant to be used in conjunction with the aqua.tcl code below. This patch also fixes the ttk::scrollbar theming issues as described in the next paragraph.

If you use a non-aqua theme on Mac OS X, and just want the ttk::combobox scrollbar to be styled properly, use the second general patch below. This patch is a general fix for Mac OS X. Only one of the two patches should be applied. This patch (a) changes ttk/combobox.tcl to use the ttk::scrollbar, and (b) to apply the Vertical.TScrollbar styling when using a non-aqua theme.

package Require Tk
source aqua.tcl
# The scrollbar must be styled upon instantiation.  The aqua styled scrollbar cannot be reconfigured.
ttk::scrollbar .sb -style Vertical.TScrollbar
pack .sb -fill y -expand 1

To try the test from above with the patches and the aqua.tcl scrollbar theme:

package require Tk
if { [file exists aqua.tcl] } {
  source aqua.tcl
}
set l [font names]
ttk::combobox .cb -values $l  -height 4
pack .cb

 aqua.tcl Code

(If you want to play with the images, I have the .svg files.)

#
# aqua.tcl scrollbar
#
# Copyright 2018 Brad Lanam Walnut Creek CA
#
# zlib/libpng license
#

package require Tk

namespace eval ttk::theme::aqua {

    # sb-ha
    set imgdata(sb-ha) {
       iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAQAAACYyMTDAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
       AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZ
       cwAAAp0AAAKdARtpIikAAAAHdElNRQfiCQQMBR0CQYT3AAAAfUlEQVQY02NkYGjg+FPIGMmgwMDC
       gAn+/L/PuPTDxMk/GRu4/u3+b8WAFzAeYnJntm1iiGQgBOT//2NiiCOojIGBgSGGiUGKKIXyTAwv
       iVL4hIlxGTHqGFcwMTUwXCSo7AxTC/OBn05L/jMxyDHwMTBiUfOf4RHj1G8pbV8BiN8gnr1IJiIA
       AAAldEVYdGRhdGU6Y3JlYXRlADIwMTgtMDktMDRUMTI6MDU6MjktMDc6MDBOAa7mAAAAJXRFWHRk
       YXRlOm1vZGlmeQAyMDE4LTA5LTA0VDEyOjA1OjI5LTA3OjAwP1wWWgAAABl0RVh0U29mdHdhcmUA
       d3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAAASUVORK5CYII=
    }
    # sb-hn
    set imgdata(sb-hn) {
       iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAQAAACYyMTDAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
       AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZ
       cwAAAp0AAAKdARtpIikAAAAHdElNRQfiCQQMBR0CQYT3AAAAe0lEQVQY02NkYNjGzpbPEM2gyMDC
       gAl+M9xjWCIwyeQ34zHObzsZbBnwg32/vJgjGhhjGAgBRebfjHseM8gQVMjAcJeJKGUMDLJMDI+J
       Uff/ERPjQqJMXMi4n+Pfjv/2BJTt+eXDyMCwik0olyGGQRlHON75v0RwislvAIfEILVUeLJFAAAA
       JXRFWHRkYXRlOmNyZWF0ZQAyMDE4LTA5LTA0VDEyOjA1OjI5LTA3OjAwTgGu5gAAACV0RVh0ZGF0
       ZTptb2RpZnkAMjAxOC0wOS0wNFQxMjowNToyOS0wNzowMD9cFloAAAAZdEVYdFNvZnR3YXJlAHd3
       dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC
    }
    # sb-ht
    set imgdata(sb-ht) {
       iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAQAAADVAGXIAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
       AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZ
       cwAAAp0AAAKdARtpIikAAAAHdElNRQfiCQQMBR0CQYT3AAAAIElEQVQY02P8952BKMD47z9xCpmI
       UzaqkABgYfhBnEIA1ecFAb7nPTQAAAAldEVYdGRhdGU6Y3JlYXRlADIwMTgtMDktMDRUMTI6MDU6
       MjktMDc6MDBOAa7mAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDE4LTA5LTA0VDEyOjA1OjI5LTA3OjAw
       P1wWWgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAAASUVORK5CYII=
    }
    # sb-va
    set imgdata(sb-va) {
       iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAABHNCSVQICAgIfAhkiAAAAAlwSFlz
       AAACnQAAAp0BG2kiKQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC3SURB
       VCiR7coxTgJRFIbR779vEs0kJjMb0MgaqAmzDkhYwcSa7hZauwB7YQ1UU1nZsAMTbaghUzG5tMag
       jwV46iMAd78ehmEJzIE74EvS2swe3f2gtm2v6rreRMSEHyS9930/taqqHs4FgIgYl2W5tIiYnQvf
       4twk3f+VgFsDikySZQIA/+nydMycMOAjkz4tIlaZ9GpFUTxLevslbFNKT6nrumPTNOuISMAIuAF2
       kl5SSgt3358A7eQ5LCUpGusAAAAASUVORK5CYII=
    }
    # sb-vn
    set imgdata(sb-vn) {
       iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAABHNCSVQICAgIfAhkiAAAAAlwSFlz
       AAACnQAAAp0BG2kiKQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACySURB
       VCiR7coxCoJgGIDh9/tAo80D1BJdxGjyDFIXiNaG5qam6ARCXUEaWiJw8goR1K7/IpQKdoCyvwP0
       ru8jAHEcd1zXXQAToN80zQ2IqqpaB0HwlDRNHWPMARjx3tHzvECNMfMWADDO83ymQNgCABCRUIHB
       NwQMFXAsyFELAOCPfke1xdQKXC3oosDegnZaluUGOH+6InLKsmwrAEmSdIuiWIrIFOgBdxGJVHXl
       +/7jBQDjM/dg8d8mAAAAAElFTkSuQmCC
    }
    # sb-vt
    set imgdata(sb-vt) {
       iVBORw0KGgoAAAANSUhEUgAAAAsAAAAUCAYAAABbLMdoAAAABHNCSVQICAgIfAhkiAAAAAlwSFlz
       AAACnQAAAp0BG2kiKQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAAiSURB
       VCiRY/z37993BgYGDgbC4AcTEYrgYFTxqOJRxcQAAHVnBRm5JvLJAAAAAElFTkSuQmCC
    }

    foreach {n} {sb-va sb-vn sb-vt sb-ha sb-hn sb-ht} {
      set images($n) [image create photo -data $imgdata($n)]
    }

    ttk::style layout Vertical.TScrollbar {
      Vertical.Scrollbar.trough -sticky ns -children {
        Vertical.Scrollbar.thumb -expand true
      }
    }

    ttk::style layout Horizontal.TScrollbar {
      Horizontal.Scrollbar.trough -sticky ew -children {
        Horizontal.Scrollbar.thumb -expand true
      }
    }

    ttk::style element create Horizontal.Scrollbar.trough image \
        $images(sb-ht)
    ttk::style element create Horizontal.Scrollbar.thumb \
        image [list $images(sb-hn) \
                    {pressed !disabled} $images(sb-ha) \
                    {active !disabled}  $images(sb-ha) \
                    disabled            $images(sb-hn) \
        ] -border 6 -sticky ew

    ttk::style element create Vertical.Scrollbar.trough image \
        $images(sb-vt)
    ttk::style element create Vertical.Scrollbar.thumb \
        image [list $images(sb-vn) \
                    {pressed !disabled} $images(sb-va) \
                    {active !disabled}  $images(sb-va) \
                    disabled            $images(sb-vn) \
        ] -border 6 -sticky ns
}

 ttk/combobox.tcl patch for use with aqua.tcl

Use this patch in conjunction with the aqua.tcl code above.

--- library/ttk/combobox.tcl    2018-09-04 08:03:35.716597858 -0700
+++ library/ttk/combobox.tcl    2018-09-04 12:14:21.731999565 -0700
@@ -258,9 +258,9 @@
     # @@@ Until we have a proper native scrollbar on Aqua, use
     # @@@ the regular Tk one.  Use ttk::scrollbar on other platforms.
     variable scrollbar ttk::scrollbar
-    if {[tk windowingsystem] eq "aqua"} {
-       set scrollbar ::scrollbar
-    }
+#    if {[tk windowingsystem] eq "aqua"} {
+#      set scrollbar ::scrollbar
+#    }
 }

 ## PopdownWindow --
@@ -274,8 +274,11 @@
        set poplevel [PopdownToplevel $cb.popdown]
        set popdown [ttk::frame $poplevel.f -style ComboboxPopdownFrame]

+        # Force all themes to use the styling.
+        # For aqua, a fixed scrollbar theme should be used.
        $scrollbar $popdown.sb \
-           -orient vertical -command [list $popdown.l yview]
+           -orient vertical -command [list $popdown.l yview] \
+            -style Vertical.TScrollbar
        listbox $popdown.l \
            -listvariable ttk::combobox::Values($cb) \
            -yscrollcommand [list $popdown.sb set] \

 ttk/combobox.tcl patch for general Mac OS X use.

This is a general patch that fixes theming for the ttk::combobox scrollbar on Mac OS X.

--- library/ttk/combobox.tcl    2017-12-06 07:25:08.000000000 -0800
+++ library/ttk/combobox.tcl    2018-09-04 10:56:32.507339564 -0700
@@ -258,9 +258,9 @@
     # @@@ Until we have a proper native scrollbar on Aqua, use
     # @@@ the regular Tk one.  Use ttk::scrollbar on other platforms.
     variable scrollbar ttk::scrollbar
-    if {[tk windowingsystem] eq "aqua"} {
-       set scrollbar ::scrollbar
-    }
+#    if {[tk windowingsystem] eq "aqua"} {
+#      set scrollbar ::scrollbar
+#    }
 }
 
 ## PopdownWindow --
@@ -274,8 +274,15 @@
        set poplevel [PopdownToplevel $cb.popdown]
        set popdown [ttk::frame $poplevel.f -style ComboboxPopdownFrame]
 
+        set theme [ttk::style theme use]
+        set sargs {}
+        if { $theme ne "aqua" } {
+          # force non-aqua themes to use the styling.
+          # otherwise on macos x, the scrollbar has the wrong theme.
+          set sargs [list -style Vertical.TScrollbar]
+        }
        $scrollbar $popdown.sb \
-           -orient vertical -command [list $popdown.l yview]
+           -orient vertical -command [list $popdown.l yview] {*}$sargs
        listbox $popdown.l \
            -listvariable ttk::combobox::Values($cb) \
            -yscrollcommand [list $popdown.sb set] \