FC2ブログ

canvasの文字へ影を描画

canvasの文字へ影を描画

袋文字を影付きで描画するには
textAlignを設定する

textAlignを設定しないと自動的に
startになる

startは左揃えになる

ただし、注意点として、
startとendは
CSSの筆記方向に依存するので
もし、CSSで右から左になっていると
右揃えになる

textAlignで指定できる位置は

start
左揃え

left
左揃え

center
中央揃え

right
右揃え

end
右揃え

袋文字は少し透明にして描画

描画する図形やパスの不透明度は
globalAlphaプロパティで設定できる

数値は0~1.0で設定し
0なら透明
1.0なら不透明
0.5なら半分くらい透明

これらを設定したら影を描画
影を付けるのは文字だけじゃなく
画像とか図形にも付けられる

このため、設定を間違えると
文字だけじゃなく全部に影がつく

影を付けるなら、以下の4つのプロパティへ設定する

shadowColor
影の色

shadowBlur
ぼかし具合

shadowOffsetX
横のずらし具合をピクセル単位で設定

shadowOffsetY
縦のずらし具合をピクセル単位で設定
スポンサーサイト



コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック