How to create SVG image as clickable button?

How to create SVG image as clickable button?

[Jean Louis]

I would like to generate various buffers with menus of clickable
images.

I see that SVG is not recognized as image.

(insert-image "/home/data1/protected/Programming/git/haiku-icons/svg/Action_GoBack_3_Large.svg")

Debugger entered--Lisp error: (error "Not an image: /home/data1/protected/Programming/git/haiku-icons/svg/Action_GoBack_3_Large.svg")
  signal(error ("Not an image: /home/data1/protected/Programming/gi..."))
  error("Not an image: %s" "/home/data1/protected/Programming/git/haiku-icons/...")
  insert-image("/home/data1/protected/Programming/git/haiku-icons/...")

Even if not, I would like to be able to insert images and make them
clickable button.

Is there any working example anywhere?

I make buttons anywhere, but not as image.

This is my failed attempt:

(insert-button "Image"
 'display '(image . (:file "/home/data1/protected/Programming/git/haiku-icons/svg/Action_GoBack_3_Large.svg")))


Jean

Take action in Free Software Foundation campaigns:
https://www.fsf.org/campaigns

In support of Richard M. Stallman
https://stallmansupport.org/

Re: How to create SVG image as clickable button?

[Jean Louis]

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))

-- 
Jean

Take action in Free Software Foundation campaigns:
https://www.fsf.org/campaigns

In support of Richard M. Stallman
https://stallmansupport.org/

Re: How to create SVG image as clickable button?

[Felix Dietrich]

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

Re: How to create SVG image as clickable button?

[Jean Louis]

* Felix Dietrich <felix.dietrich@sperrhaken.name> [2022-09-25 12:02]:


    (let* ((path "/home/data1/protected/hyperscope/7/2/7/8/1/2022/09/2022-09-25/1608839248781.jpg")
           (image (create-image path)))
      ;; (insert-button (propertize " " 'display image)
      ;;                'action …
      (insert-button " "
                     'display image
                     'action (lambda (button)
                               (hyperscope 1))))) 

Thank you, that works so well. It will help me make more visual menus.

In particular I wish to have simple text with images displayed, for
purpose of fancy menus and purpose of displaying people profiles,
akin to FBI files.

-- 
Jean

Take action in Free Software Foundation campaigns:
https://www.fsf.org/campaigns

In support of Richard M. Stallman
https://stallmansupport.org/