Canvas

Canvas is a powerful widget for 2D creating graphics.

Functions for creating items

• (canvas-create-arc canvas coords &rest options)
• (canvas-create-bitmap canvas coords &rest options)
• (canvas-create-image canvas coords &rest options)
• (canvas-create-line canvas coords &rest options)
• (canvas-create-oval canvas coords &rest options)
• (canvas-create-polygon canvas coords &rest options)
• (canvas-create-rectangle canvas coords &rest options)
• (canvas-create-text canvas coords &rest options)
• (canvas-create-window canvas coords &rest options)

Coordinates are given as a list (x1 y1 x2 y2 ... xn yn). The functions return an id which can be used to control the items.

Functions for adding tags

Tags can be added to items so that they can be controlled as a group. Items have a unique id and can have many tags (tid can be an item id or a tag).

• (canvas-addtag-above canvas newtag tid)
• (canvas-addtag-all canvas newtag)
• (canvas-addtag-below canvas newtag)
• (canvas-addtag-closest canvas newtag tid)
• (canvas-addtag-enclosed canvas newtag x1 y1 x2 y2)
• (canvas-addtag-overlapping canvas newtag x1 y1 x2 y2)
• (canvas-addtag-withtag canvas newtag tid)

Functions for searching items

The functions return a list of item ids

• (canvas-find-above canvas tid)
• (canvas-find-all canvas)
• (canvas-find-below canvas tid)
• (canvas-find-closest canvas x y &key halo start)
• (canvas-find-enclosed canvas x1 y1 x2 y2)
• (canvas-find-overlapping canvas x1 y1 x2 y2)
• (canvas-find-withtag canvas tag)

Functions for working with items

• (canvas-bbox canvas tid)
• (canvas-bind canvas tid ev fun) calls fun when on event ev on items with tag tid
• (canvas-cget canvas tid opt) returns the value of the option opt
• (canvas-coords canvas id) return the list of coordinates for item id (is setf-iable)
• (canvas-delete canvas tid) deletes items
• (canvas-dtag canvas tag &optional tag1) deletes the tags from items
• (canvas-gettags canvas tid)
• (canvas-imove canvas tid i x y) moves i-th coordinate of item tid to (x,y)
• (canvas-type canvas id) returns the type of the item id

Functions for working with windows in the canvas

• (canvas-dchars canvas tid from &optional last)
• (canvas-focus canvas tid) returns the item with focus (is setf-iable)
• (canvas-icursor canvas tid ind)
• (canvas-index canvas tid ind)
• (canvas-insert canvas tid before str)
• (canvas-lower canvas tid &optional below) lowers the canvas items
• (canvas-rcahrs canvas tid first last str) replaces the chars between first and last in the window with str
• (canvas-raise canvas tid &optional above) raises the canvas items
• (canvas-select-adjust canvas tid ind)
• (canvas-select-clear canvas tid)
• (canvas-select-from canvas tid ind)
• (canvas-select-to canvas tid ind)

Functions for scrolling

• (canvas-canvasx canvas x) returns the canvas x-coordinate for the window coordinate x
• (canvas-canvasy canvas y) returns the canvas y-coordinate for the window coordinate y
• (canvas-scan-mark canvas x y) sets the scrolling mark (used in canvas-scan-dragto)
• (canvas-scan-dragto canvas x y &optional gain) scrolls the canvas according to scan mark
• (canvas-scrolled-coords canvas coords) changes window coordinates coords to canvas coordinates
• (canvas-xview canvas) returns the xview (is setf-iable)
• (canvas-xview-moveto canvas frac)
• (canvas-xview-scroll canvas number what) scrolls the xview for num of what (can be "units" or "pages")
• (canvas-yview canvas) returns the yview (is setf-iable)
• (canvas-yview-moveto canvas frac)
• (canvas-yview-scroll canvas number what) scrolls the yview for num of what (can be "units" or "pages")

Example

In the example we show how to create canvas items, bind events in the canvas and work with scrollbars.

(defpackage :tk-user
  (:use :cl :tk)
  (:export :main))

(in-package :tk-user)

(defun main ()
  (with-tk-root (root)
    (setf (window-title root) "Canvas")
    (setf (window-minsize root) '(600 600))

    (let ((canvas (canvas :parent root :scrollregion '(-300 -300 1300 1300)))
          (h-scroll (scrollbar :parent root :orient "horizontal"))
          (v-scroll (scrollbar :parent root :orient "vertical"))
          (mouse-down))

      (scrollbar-connect canvas h-scroll)
      (scrollbar-connect canvas v-scroll)
      
      (grid canvas :row 0 :column 0 :sticky "news")
      (grid v-scroll :row 0 :column 1 :sticky "ns")
      (grid h-scroll :row 1 :column 0 :sticky "ew")
      (grid (sizegrip :parent root) :row 1 :column 1 :sticky "news")

      (grid-columnconfigure root 0 :weight 1)
      (grid-rowconfigure root 0 :weight 1)

      (canvas-create-oval canvas '(0 0 50 50)
                          :fill "blue" :outline "red" :width 10 :tags "one")
      (canvas-create-rectangle canvas '(100 100 170 180)
                               :fill "blue" :outline "red" :width 10 :tags "one")

      (canvas-create-line canvas '(500 500 300 500 300 300)
                          :fill "yellow" :width 10 :tags "two")

      (canvas-bind canvas "one" "<Enter>"
                   (lambda (ev)
                     (declare (ignore ev))
                     (canvas-itemconfig canvas "one" :outline "yellow")))
      (canvas-bind canvas "one" "<Leave>"
                   (lambda (ev)
                     (declare (ignore ev))
                     (canvas-itemconfig canvas "one" :outline "red")))

      (bind-event canvas "<Button-1>"
                  (lambda (ev)
                    (destructuring-bind (x y)
                        (canvas-scrolled-coords canvas (event-mouse-position ev))
                      (setf mouse-down t)
                      (canvas-scan-mark canvas x y))))
      (bind-event canvas "<Motion>"
                  (lambda (ev)
                    (when mouse-down
                      (destructuring-bind (x y)
                          (canvas-scrolled-coords canvas (event-mouse-position ev))
                        (canvas-scan-dragto canvas x y :gain 1)))))
      (bind-event canvas"<ButtonRelease-1>"
                  (lambda (ev)
                    (declare (ignore ev))
                    (setf mouse-down nil))))))

Tcl/Tk documentation for canvas.