本文補充上一篇 http://ithelp.ithome.com.tw/question/10011881 因篇幅不夠,而把最重要的程式碼提供在本文之中。
編輯 app/controllers/demo_controller.rb 加入以下的 action
# 整個碼是以 http://rmagick.rubyforge.org/web2/web2.rb.html 為依據,而改成可在線上改字型、顏色的功能
def star
# 若沒有 text 的參數,用此預設值寫出字來,並把空格置換成換行符號
if params['text'].nil?
text = '可以\n\' \'空格\n來分行'
else
text = params['text'].gsub(' ','\n')
end
# 預設的底色及字顏色
rgbback1 = '#' + params['rgbback1'] ||= '#ff00ff'
rgbback2 = '#' + params['rgbback2'] ||= '#3c7f05}'
rgbfont = '#' + params['rgbfont'] ||= '#ffffff'
# 選擇何種字型輸出
case params['typefont']
when '1'
typefont = 'wt003.ttf'
when '2'
typefont = 'wt024.ttf'
when '3'
typefont = 'wt014.ttf'
when '4'
typefont = 'WCL-07.ttf'
else
typefont = 'wt024.ttf'
end
require 'lib/draw_star'
black_star = Image.new(170,170)
black_star.star(25, 60, 80, 'none', 'black')
black_star.rotate!(-20)
star_shadow = black_star.copy.blur_image(3, 2)
shadow_mask = star_shadow.negate
shadow_mask.matte = false
star_shadow.matte = true
star_shadow.composite!(shadow_mask, CenterGravity, CopyOpacityCompositeOp)
# 漸層色對照表
# http://web.forret.com/tools/rgb_gradient.asp
# 先以固定參數測試,沒問題後,再改為由 user 自行選擇各顏色
#grad = GradientFill.new(0, 0, black_star.columns, 0, "#99eb24", "#3c7f05}")
#grad = GradientFill.new(0, 0, black_star.columns, 0, "#ff00ff", "#3c7f05}")
grad = GradientFill.new(0, 0, black_star.columns, 0, rgbback1 , rgbback2)
green_grad = Image.new(black_star.columns, black_star.rows, grad)
gc = Draw.new
# 先以固定參數測試,沒問題後,再改為由 user 自行選擇各字型
# 中文字型放在 /home/ironman/test/FONTS 目錄裡面
#gc.font = 'FONTS/WCL-07.ttf'
#gc.font = 'FONTS/wt024.ttf'
gc.font = "FONTS/#{typefont}"
gc.annotate(green_grad, 0, 0, 0, 0, text) do
gc.gravity = CenterGravity
gc.stroke = 'none'
#gc.fill = 'yellow'
gc.fill = rgbfont
gc.pointsize = 24
#gc.font_weight = BoldWeight
end
green_grad.rotate!(-20)
inverse_black_star = black_star.negate
inverse_black_star.matte = false
green_grad.matte = true
green_star = green_grad.composite(inverse_black_star, CenterGravity, CopyOpacityCompositeOp)
# 如果要把圖寫成一個圖檔在 server 端上的話,用此語法且到此為止
#green_star.write('1.gif')
#
# 將圖檔以 blob 方式產生
blob = green_star.to_blob() {
self.format = 'PNG'
self.depth = 8
}
# 將所產生的 blob 寫到 chache 之中
write_fragment(params, blob)
fragment = blob
# 秀在畫面上或下載成圖型檔案的選項來決定輸出的型式
if params['save'] == 'save'
send_data fragment, :type => 'image/png', :disposition => 'attachment'
else
send_data fragment, :type => 'image/png', :disposition => 'inline'
end
end
可再加強之處
字型大小的控制、判斷輸入的字串度來做斷行、整個圖形大小的控制、文字的角度控制、整個 Badge 的圖形細節控制、整個圖形的選擇。