Silverlight學習之 Canvas物件

2022-02-12 07:18:06 字數 1352 閱讀 4569

首先canvas為silverlight提供的乙個布局元素之一。每個子物件都呈現在canvas區域中。通過指定x和y座標,可以控制物件在canvas中的定位。這些座標以為象素為單位。x和y座標通常使用canvas.left和canvas.top的附加屬性來指定。canvas.left 指定物件與包含它的 canvas 的左側之間的距離(x 座標);canvas.top指定物件與包含它的canvas 的頂部之間的距離(y 座標)。

可以巢狀canvas 物件。巢狀物件時,每個物件使用的座標都是相對於直接包含該物件的canvas 而言的。

每個子物件都必須是 uielement。在 xaml 中,將子物件宣告為物件元素,這些元素是 canvas 物件元素的內部 xml。在**中,可以通過獲取由 children 屬性訪問的集合來操作 canvas 子物件的集合。

由於 canvas 為 uielement 型別,因此可以巢狀 canvas 物件。

很多情況下,canvas 僅僅用作其他物件的容器,而沒有任何可見屬性。如果滿足以下任一條件,canvas 即不可見:

由於絕對定位不考慮瀏覽器視窗的大小或瀏覽器大小調整,因此一般最好使用grid或 stackpanel作為容器。

下面看幾段示例**:

**1:

fill="red" width="200" height="200" />

這邊定義了乙個canvas物件,寬640,高480;在其中定位乙個寬高均為200的矩形,其相對於canvas的上方和右方均為30象素。

效果如下所示:

**2:這邊我們演示乙個巢狀canvas的示例

最外層的白色根canvas包含乙個巢狀的藍色canvas其(canvas.left和canvas.top均為30)巢狀的藍色canvas當中包含乙個紅色的矩形,該矩形的 canvas.left和 canvas.top值也為 30。這將建立藍色矩形框包圍下的紅色矩形效果。此相同布局可通過使用border物件來實現。     

效果 : 

在這裡需要說明的一點是canvas是使用絕對定位的。儘管使用 canvas 對物件進行絕對定位在某些情況下很有用,但是在大小可變的瀏覽器視窗中,這通常是乙個很糟糕的策略。絕對定位不允許物件根據瀏覽器視窗的大小調整在頁面上重新排列,物件保留在各自的指定畫素位置。

Silverlight學習之布局

silverlight布局主要有三種布局方式 grid stackpanel和canvas canvas canvas 採用的是相對定位布局,通過canvas.left和canvas.top兩個屬性來控制元素在canvas中的位置。效果 其中從上往下第乙個按鈕距左50,距上50。第二個距左50,距上...

Silverlight學習之 我的看法

最近在學習silverlight。感慨其功能之強大。個人覺得這項技術不僅僅是與flash競爭這麼簡單。其在企業級上的應用不可小視。當然flash有它自己的優勢。沒有必要非說哪個技術好,哪個不好。辯證的角度來講 這個世界上所有的一切存在的東西,都有它存在的理由。我個人並不是乙個擅長做預想的人,但正如我...

Silverlight之Button控制項簡單自定義

silverlight 給我們提供的控制項數量是非常有限的,不能夠滿足我們在實踐專案中開發需求。所以我們就需要通過自定義控制項的方式來解決這個問題。一 silverlight 控制項應用樣式。我們大家都知道,我們可以通過使用屬性語法來設定 ui物件。這種方法能夠有效地使物件外觀發生淺層次的改變,但是...