画像で塗りつぶすImageBrush
次は図形内を画像で塗りつぶすブラシ ImageBrushです。まずは、ImageBrushのサンプルからどうぞ。
http://www.makoto3.net/xaml/silverlight0037/index.html
XAMLのソースは次のとおりです。
【myxaml.xaml】
<Canvas
xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Path StrokeThickness="10" Stroke="#FF0088FF" Data="M70,110 L150,110 150,70 230,150 150,230 150,190 70,190 z">
<Path.Fill>
<ImageBrush ImageSource="sea01.jpg"/>
</Path.Fill>
</Path>
</Canvas>
書き方は、先のSolidColorBrushと同じです。画像ファイルのurlは<ImageBrush>タグのImageSource属性に指定します。このサンプルでは、XAMLファイルと同じディレクトリに画像を置いてあるので、画像ファイルのみを指定してあります。
なお、ImageBrushには、Stretchという属性が用意されていて、指定によって次のような違いがあります。
|
Stretch属性の値 |
意味 |
|
None |
画像をオリジナルサイズのまま表示します。 |
|
Uniform |
画像全体が図形内にすべて表示されるように自動的にサイズを調整します。オリジナルの縦横比率は保たれます。 |
|
UniformToFill |
画像の縦または横が図形にぴったり合うようにサイズを調整します。画像の縦横比率は保たれます。 |
|
Fill |
画像の縦と横を図形に合うように自動的に調整します。画像の縦横比率は保たれません。 |
せっかくなので、Stretchの指定によって画像がどう変化するかを確認するサンプルも作ってみました。
http://www.makoto3.net/xaml/silverlight0046/index.html
画像をクリックするとStretchの値が順番に切り替わりますので、試してみてください。
このページは
xfy Blog Editor
を利用して作成されました。
コメント