Silverlight – Step by Step (phần 7)


Thành phần TextBlock cho phép bạn thêm văn bản vào Silverlight.

Để thêm văn bản vào Silverlight, bạn tạo một thành phần TextBlock và thêm nội dung vào giữa cặp thẻ <TextBlock>. Ví dụ sau sẽ dùng TextBlock để hiển thị một số văn bản.

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

  <TextBlock>hello world!</TextBlock>
</Canvas>

 

Các thuộc tính thường dùng của TextBlock

Ngoài các thuộc tính chung thừa hưởng từ UIElement, như là Clip và Opacity (xem lại phần 5), TextBlock còn cung cấp thêm một số thuộc tính khác:

– FontSize: Đặt kích thước Font, tính theo pixel.
– FontStyle: Kiểu chữ, có thể đặt là Normal hoặc Italic.
– FontStretch: Kiểu giãn font. Nhận các giá trị UltraCondensed, ExtraCondensed, Condensed, SemiCondensed, Normal, Medium, SemiExpanded, Expanded, ExtraExpanded, hoặc UltraExpanded.
– FontWeight: Độ đậm cửa chữ. Nhận các giá trị Thin, ExtraLight, Light, Normal, Medium, SemiBold, Bold, ExtraBold, Black, ExtraBlack.
– FontFamily: Họ của font chữ.
– Foreground: Bút vẽ được dùng để vẽ văn bản. Bạn có thể dùng màu đặc, gradient, hình ảnh và thậm chí là video. Xem lại phần 4 để có thêm thông tin.

Ví dụ sau sẽ mô tả các thuộc tính trên:

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <TextBlock FontSize="40"
      FontFamily="Georgia"
      FontStyle="Italic" FontWeight="Bold"
      FontStretch="Expanded"
      Canvas.Top="20" Canvas.Left="20">

      Hello world!

      <TextBlock.Foreground>
        <LinearGradientBrush>
          <GradientStop Color="SlateBlue" Offset="0.0" />
          <GradientStop Color="Black" Offset="1.0" />
        </LinearGradientBrush>
      </TextBlock.Foreground>
  </TextBlock>
</Canvas>

 

Thành phần Run

Bạn có thể dùng nhiều kiểu Font khác nhau trong cùng một TextBlock bằng cách dùng thành phần Run. Run có cùng các thuộc tính như TextBlock, mặc dù nó không thể được xác định vị trí bằng Canvas.Left và Canvas.Top. Ví dụ sau sẽ dùng Run để thay đổi kích thước của một phần văn bản trong TextBlock.

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

  <TextBlock>
    Hello <Run FontSize="30">world</Run>
  </TextBlock>
</Canvas>

 

Dùng nhiều loại font

Không chắc là tất cả các Font đều có sẵn trên máy tính của người dùng. Thuộc tính FontFamily cho phép bạn liệt kê một danh sách font (font fallback), các font sau sẽ được được dùng nếu font trước không có sẵn. Một font đặt biệt được gọi là “Portable User Interface” sẽ luôn tồn tại trên tất cả các máy, như là một phần của Silverlight. Ví dụ sau đây biểu diễn các cài đặt khác nhau của FontFamily.

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

  <TextBlock FontFamily="Arial, Times New Roman"
      Text="Hello World" FontSize="20"/>
  <TextBlock FontFamily="Times New Roman, Arial" Canvas.Top="40"
      Text="Hello World" FontSize="20"/>
  <TextBlock FontFamily="Portable User Interface" Canvas.Top="80"
      Text="Hello World" FontSize="20"/>
</Canvas>

Gửi phản hồi

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s