我写了一个Clojurescript Quil网页应用程序,它由周围浮动的对象组成。这个"游戏"旨在成为普通html文本的背景。奎尔有文字能力,但我还没有找到任何例子,我需要做什么。理想情况下,我想有网页文本渲染在游戏之上的一层,使用像Sablono,而不必担心透明度问题,或任何其他问题-游戏只是在后台!
如果不能简单地把奎尔放在下面的图层上,那么我可以合理地确定我将能够在奎尔中做到这一点,但是会有很多细节需要整理:z顺序,让文本保持其颜色,让包含字符的矩形背景透明等-许多问题我想避免。
什么是最简单的方法,有一个html文本层在画布层的顶部给出这个设置?
下面是我到目前为止所做的,它在与动画相同的函数中绘制文本,但是在动画之后。不完全是我要找的,但可能要做的:
(ns scratch.core
(:require [quil.core :as q :include-macros true]
[quil.middleware :as m]))
(def dark-blue [0,0,139])
(defn setup []
(q/text-font (q/create-font "DejaVu Sans" 28 true))
(q/frame-rate 15)
; Set color mode to HSB (HSV) instead of default RGB.
;(q/color-mode :hsb)
; setup function returns initial state. It contains
; circle color and position.
{:color 0
:angle 0})
(defn draw-text
[]
(apply q/fill dark-blue)
(q/text "The quick, brown fox jumped over the lazy dog"
100 200 300 200))
(defn update-state [state]
; Update sketch state by changing circle color and position.
{:color (mod (+ (:color state) 0.7) 255)
:angle (+ (:angle state) 0.1)})
(defn draw-state [state]
; Clear the sketch by filling it with light-grey color.
(q/background 240)
; Set circle color.
(q/fill (:color state) 255 255)
; Calculate x and y coordinates of the circle.
(let [angle (:angle state)
x (* 150 (* 0.4 (q/cos angle)))
y (* 150 (* 0.4 (q/sin angle)))]
; Move origin point to the center of the sketch.
(q/with-translation [(/ (q/width) 2)
(/ (q/height) 2)]
; Draw the circle.
(q/ellipse x y 100 100)))
;; Simply make sure the text is drawn after the 'background'
(draw-text))
(q/defsketch moving-ball
:host "moving-ball"
:size [500 500]
:setup setup
:update update-state
:draw draw-state
:middleware [m/fun-mode])
这个问题在别处有些答案。然而,问题中使用的变通方法-在画布上绘制文本-对于我的用例来说可能已经足够好了。