Silverlight Tutorial 2 – Dùng User Control để cho phép xem theo dạng Master/Detail (phần 2)


(tiếp theo phần 1)


Chuyển dữ liệu cho đối tượng StoryDetailsView
Khi StoryDetailsView hiện ta, chúng ta cần đưa thông tin chi tiết kết quả tìm kiếm mà người dùng đã chọn trong ListBox.
Bên trong hàm xử lý sự kiện “SelectionChanged” của ListBox (trong file code-behind), chúng ta sẽ truy cập vào đối tượng DiggStory tương ứng với dòng mà người dùng đã chọn trong ListBox bằng cách truy cập vào thuộc tính “SelectedItem”.
Một cách khác cũng có thể dùng là truyền đối tượng DiggStory này vào cho StoryDetailsView bằng cách gán nó cho thuộc tính “DataContext” của StoryDetailsView ngay trước khi cho control này hiện ra.

Sau đó ta có thể viết các lệnh bên trong UserControl của chúng ta để hiển thị kết quả. Hoặc một cách khác là chúng ta có thể dùng các biểu thức gắn nối dữ liệu để gắn các control với giá trị của nó.
Lấy ví dụ, chúng ta có thể cập nhật lại đoạn XAML của StoryDetailsView để hiển thị kết quả được chọn bằng cách dùng biểu thức gắn nối như sau:

Và đây là kết quả khi người dùng nhấn vào danh sách:

Hàm xử lý sự kiện của ListBox sẽ xử lý việc lựa chọn, đặt DataContext của UserControl thành đối tượng DiggStory trước khi làm nó hiện ra:

Chú ý là tiêu đề của DiggStory sẽ xuất hiện trong control, đó là vì chúng ta đã thêm biểu thức gắn nối dữ liệu và cho nó.
Hoàn chỉnh User Control Layout
Chương trình mẫu ở trên đã biểu diễn các bước cơ bản để thêm vào một hộp thoại dạng master/details. Giờ chúng ta sẽ hoàn chỉnh StoryDetailsView bằng cách thêm một số điều khiển và biểu thức gắn nối dữ liệu vào cho User Control.

Chúng ta có thể cập nhật StoryDetailsView để nó trông giống như trên bằng cách sửa lại <Border> cho nó có nội dung bên trong:

Như bạn thấy, không có bất kỳ đoạn mã lệnh nào được thêm vào, vì chúng ta đã dùng phép gắn nối dữ liệu (databinding) để “kéo” các giá trị từ DataContext, do vậy chúng ta không cần thêm bất kỳ đoạn lệnh nào.
Bước tiếp theo
Giờ chúng ta đã có tất cả các chức năng cơ bản và các tính năng tương tác với người đều đã được xây dựng.
Bước cuối cùng, chúng ta sẽ chỉnh sửa lại giao diện thêm một chút, đặc biệt là thay đổi hình thức của ListBox và Button.
Để làm điều này, bạn hãy đọc bài hướng dẫn tiếp theo: Dùng các mẫu để tùy biến Look and Feel của control.

2 Comments on “Silverlight Tutorial 2 – Dùng User Control để cho phép xem theo dạng Master/Detail (phần 2)

  1. Pingback: Silverlight Tutorial 2 - Dùng User Control để cho phép xem theo dạng Master/Detail (phần 1) « Nam Già

  2. Ad cho mình hỏi vậy việc điều hướng trong usercontrol sẽ như thế nào, vị dụ mình có 1 mainwindow(1 frame,2 button)=>mỗi button sẽ gọi 1 usercontrol và gán vào frame (navigate) => điều mình muốn ở đây, là khi frame đang chứa usercontrol A, bấm button B để gọi UC B, thì A sẽ remove hết event của nó, trong SLight có OnNavigatedFrom và OnNavigatedTo, trong WPF ko có, có cách nào sử dụng như SL ko.Thanks ad.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: