Wiki


Wiki Table of Contents

Page Details

First published by:
Last revision by:
This page has not yet been rated

Silverlight Tip of the Day #55 – How to Apply Styles in Silverlight – Part I

Filed under: [Edit Tags]

Những Styles vô cùng quan trọng bởi vì chúng cho phép những nhà phát triển kiểm soát  phong cách và kiến trúc của những control trong các ứng dụng của họ. Bằng cách sử dụng styles bạn có thể thay đổi sự khai báo style một cách dễ dàng và tất cả các control trong ứng dụng cũng được cập nhật một cách tự động. Điều này giúp bạn cập nhật các control nhanh hơn là thay đổi từng cái một trong các ứng dụng. (Hơn nữa bạn còn có thể sử dụng nó cho các ứng dụng khác (kế thừa)).

Trong bài này chúng ta sẽ khám phá các nền tảng cơ bản được sử dụng của styles trong  Silverlight. Tôi sẽ tiếp tục với những điều phức tạp hơn về style ở Tip of the Day tiếp theo.

Trong  Silverlight, styles được khai báo với những control  tag  <UserControl.Resources> . Nếu bạn muốn thực hiện trên toàn bộ các control thì bạn đặt chúng trong tập tin  App.XAML của bạn với những tag  <Application.Resources> .

Để minh họa điểm này chúng ta tạo một style cho toàn bộ những gì chúng ta sẽ hiển thị trong  TextBlocks xuyên suốt ứng dụng đơn giản của chúng ta:

<Application xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation
             xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml 
             x:Class="MyApp.App">
    <Application.Resources>
        <Style x:Name="TextBoxStyle" TargetType="TextBlock">
            <Setter Property="FontFamily" Value="Calibri.ttf#Calibri"></Setter>
            <Setter Property="FontSize" Value="16"></Setter>
        </Style>
    </Application.Resources>
</Application>

Với mã XAML ở trên:

  1. Style - Khai báo mỗi style với thẻ  <Style></Style> trong thẻ  <Application.Resources> hay phần  <UserControl.Resources> .
  2. Name – Đặt tên cho  style (qua thuộc tính  x:Name=””) vì thế chúng ta có thể tham chiếu đến nó từ các control của chúng ta .
  3. TargetType -Tên của  FrameworkElement  mà bạn đang hướng đến. Trong trường hợp của chúng ta ở trên, ta đang hướng đến một   “TextBlock”.
  4. Setter - Mỗi thuộc tính chúng ta muốn gán cho style này được khai báo như một  Setter. Bạn có thể gán nhiều setters trên một  style. Thí dụ, FontSize, FontFamily, vv....

Tiếp theo, mã XAML sau đây hiển thị cho bạn biết bằng cách nào tạo nhiều  TextBlocks với cùng một style được áp dụng lên nó.

<TextBlock  x:Name="myTextBlock" Text="Hello There." Style="{StaticResource TextBoxStyle}"></TextBlock>

<TextBlock  x:Name="myTextBlock2" Text="How are you?" Style="{StaticResource TextBoxStyle}"></TextBlock>

<TextBlock  x:Name="myTextBlock2" Text="Good thanks!" Style="{StaticResource TextBoxStyle}"></TextBlock>

Cuối cùng, nếu bạn muốn thay đổi font size cho những TextBlocks này, tất cả những gì chúng ta phải làm  là chỉ cần thay đổi nó trong style setter đơn giản và nhanh hơn là thay đổi từng  TextBlock riêng biệt.

Trước: <Setter Property="FontSize" Value="16"></Setter>

Sau: <Setter Property="FontSize" Value="25"></Setter>

  Thank you,
--Mike Snow

Recent Comments

Leave the first comment for this page.