Re: How to create SVG image as clickable button?

[Felix Dietrich <felix.dietrich@sperrhaken.name>]

Hello Jean Louis,

Jean Louis <bugs@gnu.support> writes:

> I am now here, trying to make image as clickable button, need help
> please.
>
> (let ((image (create-image "/home/data1/protected/Programming/git/haiku-icons/png/64x64/Alert_Info.png"
> 			   nil nil :action 'my-function)))
>   (insert-image image))

in the documentation for Emacs 28.1, I cannot find an image property
:action.  For buttons, though, I can find a property ‘action’.  Note
that there is no colon in front of ‘action’: it is not a keyword symbol
but a proper one.

With the following snippet, I managed to insert a clickable image button
at the end of the current buffer:

#+begin_src emacs-lisp
  (save-excursion
    (goto-char (point-max))
    (let* ((path "path/to/image")
           (image (create-image path)))
      ;; (insert-button (propertize " " 'display image)
      ;;                'action …
      (insert-button " "
                     'display image
                     'action (lambda (button)
                               (message "Button clicked")))))
#+end_src


You could also try to insert an image with custom keybindings:

#+begin_src emacs-lisp
  (save-excursion
    (let* ((start (point))
           (keymap (let ((map (make-sparse-keymap)))
                     ;; The default keymap for images inserted with
                     ;; ‘insert-image’ is ‘image-map’.  It is a global
                     ;; variable.
                     (set-keymap-parent map image-map)
                     (define-key map [mouse-1]
                       (lambda () (interactive)
                         (message "Hello World from mouse click!")))
                     (define-key map [?h]
                       (lambda () (interactive)
                         (message "Hello World from key press!")))
                     map))
           (path "path/to/image")
           (image (create-image path)))
  
      (goto-char (point-max))
      (insert-image image)
      (add-text-properties start (point) `(keymap ,keymap))))
#+end_src


-- 
Felix Dietrich