windows phone xaml檔案中元素及屬性(10)

Textblock xaml檔案和隱藏檔案

在設計介面的時候我們可以通過xaml中進行設計，這種設計是所見即所得 (WYSIWYG)的，很是方便，由於xaml中使用到的元素都是其實質都是類檔案，比如textblock類，textblock在xaml檔案中展示的特性都是該類的屬性及方法；所以我們也可以在隱藏檔案完成對可視化元素的構建，例如我們實現如下的效果：

那麼我們在MainPage.xaml 部分檔案代碼如下：

 <!--ContentPanel - 在此處放置其他內容-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <TextBlock x:Name="txtName" Text="Name" VerticalAlignment="Center" HorizontalAlignment="Center" ></TextBlock>
        </Grid>

同樣的效果我們可以在MainPage隱藏檔案進行編寫如下：

//PhoneApplicationPage載入時        private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)        {            //和xaml中顯示的位置相同            TextBlock txtblk = new TextBlock();            txtblk.Name = "txtName";            txtblk.Text = "Name";            txtblk.VerticalAlignment = VerticalAlignment.Center;            txtblk.HorizontalAlignment = HorizontalAlignment.Center;            ContentPanel.Children.Add(txtblk);                    }

此事件需要在xaml檔案PhoneApplicationPage類中添加loaded事件，此外我們還會發現我們利用了名為ContentPanel的Grid元素的Children屬性將textblock加入到Grid內部，其實Grid是將textblock添加到自身的Children集合中；

屬性的繼承性

屬性的繼承是silverlight的一個特性，它可以將PhoneAppplicationPage中的一些屬性（大致就是Forground屬性，以及和字型相關的 屬性，如FontFamily，Fronsize，FronStyle，FrontWeight，fronStretch）繼承到 MainPage中,在下面的案例中使用的是在PhoneAppplicationPage中設定屬性

FontStyle="Italic"

 我們會看到這樣的效果：

 我們可以看到，在MainPage中的所有字型都變為斜體字，下面在顯示為“Name”的textblock元素改為：

<TextBlock x:Name="txtName" FontStyle="Normal" Text="Name" VerticalAlignment="Center" HorizontalAlignment="Center" ></TextBlock>

 再看效果變為如下：

 

 所以從中可以總結屬性的優先順序：①本地設定的優先順序最高；②繼承來的屬性優先順序置中；③預設的最低

屬性元素文法

元素及其屬性的不同書寫方式，比如上面我們實現顯示"Name"的textblock元素，在xaml中可以有一下不同的幾種書寫格式：

最原始的寫法①：

<TextBlock x:Name="txtName" FontStyle="Normal" Text="Name" VerticalAlignment="Center" HorizontalAlignment="Center" ></TextBlock>

寫法②：

            <TextBlock>
                <TextBlock.Name>txtName</TextBlock.Name>
                <TextBlock.Text>Name</TextBlock.Text>
                <TextBlock.FontStyle>Normal</TextBlock.FontStyle>
                <TextBlock.VerticalAlignment>Center</TextBlock.VerticalAlignment>
                <TextBlock.HorizontalAlignment>Center</TextBlock.HorizontalAlignment>
            </TextBlock>

 兩種寫法實現的效果一直，可以看出寫法②更有層次感，但是這樣寫法比較累贅，適當的時候可以採用第二種寫法；其中第二種寫法中的Name，Text,FontStyle,VerticalAlignment,HorizontalAlignmen稱之為屬性元素，即用xml元素表示一個.NET屬性，另外需要注意的是屬性元素標籤內不能含有其他任何東西；

顏色和畫刷

我們把名為txtName的元素添加屬性Foreground更改為

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <TextBlock x:Name="txtName" FontStyle="Normal" Text="Name" 
          VerticalAlignment="Center" HorizontalAlignment="Center" 
                   Foreground="#FF0000"
                   ></TextBlock>

 可以看到效果：這裡使用的是紅綠藍的字串表示的顏色，每種顏色值都是範圍從00到FF佔用一個位元組的16進位數，其中00表示全透明，FF表示不透明；對於scRGB色彩空間，其值設定在0到1之間，我們可以這樣定義

<TextBlock x:Name="txtName" FontStyle="Normal" Text="Name" 
          VerticalAlignment="Center" HorizontalAlignment="Center" 
                   Foreground="sc#0.1,0.2,0.3"
                   ></TextBlock>

 效果：，關於sRGB和scRGB的區別可參考http://www.sudu.cn/info/index.php?op=article&id=275494

 按照上面的屬性元素文法我們可以這樣寫：

            <TextBlock>
                <TextBlock.Name>txtName</TextBlock.Name>
                <TextBlock.Text>Name</TextBlock.Text>
                <TextBlock.FontStyle>Normal</TextBlock.FontStyle>
                <TextBlock.VerticalAlignment>Center</TextBlock.VerticalAlignment>
                <TextBlock.HorizontalAlignment>Center</TextBlock.HorizontalAlignment>
                <TextBlock.Foreground>
                    <SolidColorBrush>
                        <Color>sc#0.1,0.2,0.3</Color>
                    </SolidColorBrush>
                </TextBlock.Foreground>
            </TextBlock>

 另外Foreground屬性是可以通過視覺化樹狀結構繼承，但是Background屬性不可繼承的，Background屬性預設為null,null與Background屬性設定為透明Transparent相同;

源碼