ÁP dụng tài nguyên phong cách và chủ đề cho điều khiển: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 20

Trong hướng dẫn cuối cùng, chúng ta đã học cách áp dụng kiểu dáng và tài nguyên chủ đề cho các điều khiển của chúng ta. Bây giờ trong phần này của loạt bài hướng dẫn, chúng ta sẽ tiếp tục làm việc với các kiểu và tài nguyên và tìm hiểu cách áp dụng các tài nguyên màu của sự lựa chọn của chúng ta.

Hãy bắt đầu làm việc với cùng một dự án mà chúng ta đã tạo trong hướng dẫn trước bằng một nút. Chọn nút đó và đi về phía cửa sổ thuộc tính. Khi bạn bấm vào phím mũi tên nhỏ nằm bên cạnh tài sản Foreground, bạn sẽ nhận thấy rằng một cửa sổ nhỏ mở ra với gạch màu khác nhau và các tab trên đó. Có bốn tab nhỏ trên cửa sổ nhỏ đó là Null Brush, Solid Color Brush, Gradient Brush và Image Brush. Theo mặc định, nó được đặt thành bàn chải cứng với màu trắng (RGB: 0,0,0 và kênh trong suốt alpha được đặt thành 255). Bạn có thể chọn màu bạn muốn bằng cách di chuyển thanh trượt dọc theo thanh dọc và sau đó là con trỏ hình tròn để chọn bóng chính xác. Bạn cũng có thể chọn iDropper bằng cách sử dụng màu sắc của bất kỳ công cụ nào có sẵn. Có rất nhiều cách để sửa đổi màu sắc trên bàn chải màu này.

Cũng giống với Gradient Brush. Nó thực hiện nhiệm vụ tương tự như bàn chải màu rắn nhưng thể thao vài tùy chọn bổ sung. Nó cung cấp cho bạn một loạt các điểm dừng. Bạn có thể sử dụng những điểm dừng sáng tạo để có được sắc thái khác nhau giữa các màu sắc được lựa chọn. Bạn cũng có thể thay đổi kết cấu của màu bằng cách sử dụng các tùy chọn như gradient ngang và gradient dọc. Bàn chải hình ảnh cho phép bạn chọn hình ảnh làm tài nguyên của chúng tôi. Bạn có thể thêm một hình ảnh giống như chúng ta đã thêm một hình ảnh trong điều khiển hình ảnh.

Bây giờ, sử dụng bàn chải màu gradient bằng cách sử dụng điểm dừng giống như tôi đã thực hiện nó (Xem hình ảnh). Bây giờ nếu bạn thấy cửa sổ XAML, bạn sẽ thấy rằng một số mã được thêm vào cửa sổ XAML cho nút.

Bây giờ, giả sử, nếu chúng ta muốn thêm cùng một màu gradient chúng ta đã thêm vào nút của chúng ta cho tất cả các điều khiển khác trên trang của chúng ta, Chúng ta làm điều đó như thế nào? Đối với điều đó đi đến tài sản foreground, nơi chúng tôi đặt brush màu gradient sôi nổi và nhấp chuột phải vào nó và chọn "Extract value to resource". Nó sẽ mở một cửa sổ popup nhỏ “Create Resource”. Bạn có thể đặt tên tài nguyên như bạn muốn hoặc bạn có thể để nguyên như vậy. Sau đó, bạn có thể chọn nơi bạn muốn lưu nó, tùy thuộc vào nơi bạn muốn sử dụng tài nguyên này. Nếu bạn muốn sử dụng nó trên một trang duy nhất, chọn MainPage.xaml khác chọn App.xaml và nhấp vào Ok.

Bây giờ kéo một nút khác trên bề mặt thiết kế và đi đến tài sản nền trước. Bây giờ bạn sẽ tìm thấy tài nguyên tùy chỉnh của chúng tôi dưới tên tài nguyên cục bộ. Một khi bạn nhấp vào nó, bạn sẽ thấy nút thứ hai mang cùng màu như đầu tiên. Điều gì sẽ xảy ra nếu có nhiều thuộc tính mà chúng tôi muốn áp dụng cho kiểm soát của mình? Chúng tôi có thể làm như vậy bằng cách sử dụng phong cách. Một phong cách là một bộ sưu tập của những người định cư bất động sản. Bây giờ chúng ta hãy tạo một phong cách mới. Đầu tiên xóa tất cả các sửa đổi chúng tôi đã làm trong ví dụ cuối cùng và nhận được một nút mới để bắt đầu mới. Dán đoạn mã sau bên dưới các khai báo xmlsns.

Trong mã này, chúng tôi đã tạo hai thuộc tính setter để thay đổi màu đường viền và màu nền trước. Sau đó, hãy vào mã của nút và thêm đoạn mã sau:

Style = "{StaticResource myStyle}".

Bạn sẽ thấy rằng màu đường viền của nút và màu nền trước chuyển thành màu đỏ.

Bây giờ nếu bạn muốn để áp dụng kiểu này cho toàn bộ ứng dụng của bạn, hãy cắt mã giữa. Mở tệp App.xaml và dán vào giữa các thẻ tài nguyên ứng dụng. Bây giờ nếu bạn quay trở lại và kiểm tra nút, bạn sẽ thấy nút đó vẫn hiển thị màu đỏ.

Vì vậy, đây là tất cả về Styles và tài nguyên trong Windows Phone 7.5. Trong chương tiếp theo, chúng ta sẽ tìm hiểu về việc điều hướng giữa các trang xaml.