探討 Silverlight XAML 橢圓形圖案物件(2/4)

2009-11-13

27244
0
Silverlight

摘要:探討 Silverlight XAML 橢圓形圖案物件(2/4)

本文將討論在 Microsoft Expression Blend 2 中，能夠於「Properties」索引標籤之「Appearance」面板中所能設定的屬性（如圖表 1 所示）。

圖表 1

屬性 Opacity 用於設定橢圓形的透明度（Opacity 或稱為Transparency），可設定值介於 0.0（完全透明）到 1.0（完全不透明，此為預設值）。

	附註：
	當我們使用 16 進位的 8 位數表示法（#aarrggbb）或 4 位數表示法（#argb）來設定屬性 Fill 的色彩時，最前面的數值 aa 與 a 是用來描述 Alpha 值，也就是所謂的色彩透明度。當 Alpha 值為 00 或 0 時，表示顏色是完全透明的；當 Alpha 值為 FF 或 F 時，則表示顏色是完全不透明的。

屬性 Visibility 用來決定要顯示或隱藏橢圓形，可設定值說明如下：

q	Collapsed
	此表示不顯示橢圓形，而且不保留橢圓形圖案所需的空間，也就是說，在畫布上將看不到橢圓形圖案，而且它也不會佔用畫布的任何空間，此意味者，將物件的 Visibility 屬性設定成 Collapsed 時，將不會耗費資源來呈現這個物件。
q	Visible
	此表示橢圓形圖案會顯示出來，此為預設值。

屬性 StrokeThickness 用於取得或決定外框的粗細（也就是寬度），其設定值是一個 Double 值。預設值為 0.0，表示不指定外框的寬度。一般來說，將外框的粗細設定為圖形寬度或高度的一半時，外框就會填滿整個圖案的內部，這表示該物件所指定的 Fill 屬性將不會發生效用。

	請注意：
	如果沒有設定 StrokeThickness 屬性，但是卻使用 Stroke 屬性來採用特定的 Brush（筆刷）來繪製圖案外框時，屬性 StrokeThickness 將會自動被隱含設定成 1.0。如圖表 2 所示，我們可以讓該隱含的設定值轉換成本機值（Convert to Local Value），以便明確地描述 StrokeThickness 屬性值。

圖表 2

屬性 Stretch 取得或決定橢圓形圖案要如何縮放以便填滿它所持有的空間，預設值為 Fill 。有下列 4 種 Stretch 屬性列舉值可供選擇（請參考圖表 3 來比較其差異性）：

q	Fill
	圖案要填滿整個空間，但不會保持其長寬比（Aspect Ratio）。這是預設值。
q	None
	維持圖案原本的大小，以便呈現原始面貌。
q	Uniform
	以維持圖案原本的長寬比為前提，進行等比例的縮放。
q	UniformToFill
	既要維持圖案原本的長寬比又要填滿目的空間，因此在某些情況下，會裁切原始圖案，以便填滿整個目的空間。

	請注意：
	不同物件的 Stretch 屬性，其預設的屬性值不盡相同。比方說，圖案中的 Ellipse 與 Rectangle 物件的 Stretch 屬性預設值都是 Fill，而其餘圖案物件之 Stretch 屬性預設值都是 None，至於 Image 物件的 Stretch 屬性預設值則是 Uniform。

圖表 3

屬性 StrokeDashArray -+用來取得或設定繪製外框時，所要使用的虛線（亦稱為破折號）與間隔的長度。屬性值 DoubleCollection 是由 Double 值所組成的集合。簡單地說，每個 Double 值是用來設定破折號或是間隔的長度，這個長度是以相對於畫筆的寬度來計算。比方說，數字 1 所產生的破折號或間隔的長度會與筆刷的寬度一樣長。集合中索引位置為 0 的位置，也就是第 1 個項目的 Double 值，決定破折號的長度；索引位置為 1 的位置，亦即第 2 個項目的 Double 值，是用來決定間隔的長度。

這意味者，我們可以在屬性值 DoubleCollection 中，指定多個 Double 值，位於奇數索引位置的值，是決用來定破折號的長度；而偶數的索引位置，則是用來決定間隔的長度。當我們只有指定奇數個 Double 值時，Silverlight 會自動重複這些值，以便產生偶數個 Double 值，並依照所指定的破折號長度與間隔長度，繪製特定長度的外框虛線並保持所指定的間隔長度，依循這樣的順序繪製外框。例如，將屬性 StrokeDashArray 指定成 1,6,8，就等同於指定 1,6,8,1,6,8。

請注意：

在由屬性值 DoubleCollection 所組成的集合中，我們會使用一個空白字元或逗號（，）來加以區隔各個 Double 值，以便閱讀。當然，如果您要使用多個空白字元來區隔各個參數，也是可以的。

當兩個數字所代表的數值意義很明確時，可以不需要使用逗號或空白字元來加以分隔。比方說，5..8 分別表示數字 5.0 與 0.8。

屬性 StrokeDashCap 用於取得或決定要如何描繪破折號的端點（就是起點與終點）。有下列 4 種類型的 PenLineCap 屬性列舉值可供設定（如圖表 4 所示者，紅色部分即是這 4 種屬性列舉值所產生的額外區域）：

q	Flat
	沒有在線段的端點延伸出任何區域，這是預設值。
q	Round
	在線段的端點產生一個以外框之寬度為直徑的半圓形。
q	Square
	在線段的端點產生一個高度為外框之寬度、長度為外框寬度之一半的矩形。
q	Triangle
	在線段的端點產生一個等腰直角三角，其底邊的長度恰為外框之寬度。

圖表 4

屬性 StrokeDashOffset 用於取得或決定破折號的起點位置，要偏移多少距離，這是一個 Double 值。提醒大家，偏移的距離可以是負的 Double 值，表示起點位置要往反方向移動。當然要設定屬性 StrokeDashArray 之後，再設定屬性 StrokeDashOffset 才有意義。

屬性 StrokeEndLineCap 用於取得或決定繪製外框時，終點的樣式。PenLineCap 屬性列舉值與屬性 StrokeDashCap 一樣，有 4 種類型可供選擇。預設值是 Flat。

	請注意：
	如果您在未指定屬性 Stroke 的圖案、或是沒有起點與終點的圖案上（例如橢圓形），即使指定了屬性 StrokeEndLineCap，也不會產生任何效果。

屬性 StrokeLineJoin 用於取得或設定在頂點處（由相交的兩條線段所形成的點，亦稱為接角聯結處），要如何繪製外框，以便連接頂點兩邊的線段。有下列 3 種類型的 PenLineJoin 屬性列舉值可供設定（如圖表 5 所示）：

q	Bevel
	斜切聯結，就是在頂點處，形成一個斜面。這是預設值。
q	Miter
	斜接角聯結，就是在頂點處，形成一個尖角。於使用這個屬性值之後，還可以指定屬性 StrokeMiterLimit。
q	Round
	圓角聯結，就是在頂點處，形成一個圓弧。



	請注意：
	如果您在一個不具備頂點的圖案（例如直線或橢圓形），且沒有指定屬性 Stroke 或是所指定的 StrokeThickness 屬性值過小（也就是外框過細），指定屬性 StrokeLineJoin 將不會發生任何效果。

圖表 5

屬性 StrokeMiterLimit 用來取得或決定頂點處的斜面長度與外框粗細的比率，簡單地說，這個斜接角突出限度的屬性可以控制斜接角聯結點的長度上限，當超過某一上限時，就會自動變成斜切聯結。說的更白話一點，就是決定要如何繪製頂點處的尖角。例如要削剪矩形圖案的轉角處，讓轉角處的斜面接頭更為圓潤，或是讓轉角處形成銳角。提醒大家，這個屬性值是一個永遠大於等於 1 的 Double 值。

	附註：
	兩條相連接的線段端點，會形成一個有斜度的角。當這兩條線段所夾的角是銳角時，該斜面就有可能超過線段的寬度，以便描繪外框。

	請注意：
	只有指定屬性 StrokeLineJoin 的值為 Miter 時，設定屬性 StrokeMiterLimit 才有意義。

屬性 StrokeStartLineCap 用於取得或決定繪製外框時，起點的樣式。PenLineCap 屬性列舉值與屬性 StrokeDashCap 一樣，有 4 種類型可供選擇。預設值是 Flat。

	請注意：
	如果您在未指定屬性 Stroke、沒有起點與終點的圖案上（例如橢圓形），即使指定了屬性 StrokeStartLineCap，也不會產生任何效果。

章立民研究室

回首頁