Bài giảng Mạng Silverlight - Chương 6: Media và Animation

Nội dung text: Bài giảng Mạng Silverlight - Chương 6: Media và Animation

1. CHƢƠNG VI: MEDIA VÀ ANIMATION 1 Animation Animation là một ảo giác đƣợc tạo ra bằng cách thay đổi một loạt các hình ảnh. Não nhận các hình ảnh nhƣ là một thay đổi cảnh. Trong phim ảo giác này đƣợc tạo bằng cách sử dụng các camera có ghi lại rất nhiều hình ảnh, khi hình ảnh đƣợc phát trở lại bằng một máy chiếu, các khán giả thấy một hình ảnh chuyển động. Silverlight có chứa rất nhiều các đối tƣợng có thể thực hiện đƣợc việc tạo ra ảo giác chuyển động. 1.1 Storyboard Kiểm soát các animation với một timeline và cung cấp các đối tƣợng và tài nguyên nhằm mục đích cung cấp thông tin cho các animation con Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 1
2. private void Animation_Begin(object sender, RoutedEventArgs e) { myStoryboard.Begin(); } private void Animation_Pause(object sender, RoutedEventArgs e) { myStoryboard.Pause(); } private void Animation_Resume(object sender, RoutedEventArgs e) { myStoryboard.Resume(); } private void Animation_Stop(object sender, RoutedEventArgs e) { myStoryboard.Stop(); } 1.2 Key-Frame Animations Key-frame animations cho phép bạn tƣơng tác vào animation nhiều hơn hai đối tƣợng và kiểm soát một animation bằng phƣơng pháp nội suy. Key-frame ko có các thuộc tính nhƣ From / To / bởi Animation. Bạn tạo ra key-frame, các đối tƣợng animation đƣợc key-frame kiểm soát, khi các hình ảnh động chạy nó sẽ chuyển giữa các frame mà bạn xác định tạo ra một chuỗi chuyển động liền mạch <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MyAnimatedTranslateTransform" Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 2
3. Storyboard.TargetProperty="X" Duration="0:0:10"> // When the user clicks the Rectangle, the animation // begins. private void Mouse_Clicked(object sender, MouseEventArgs e) { myStoryboard.Begin(); } es/ClientBin/TestPage.html 1.3 Double Animation Double Animation biến đổi giá trị giữa hai biến của đối tƣợng Animation bằng cách sử dụng nội suy tuyến tính trên một khoảng thời gian xác định Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 3
4. private void Start_Animation(object sender, EventArgs e) { myStoryboard.Begin(); } stPage.html 1.4 Color Animation Color Animation biến đổi màu giữa hai biến của đối tƣợng Animation bằng cách sử dụng nội suy tuyến tính trên một khoảng thời gian xác định private void Start_Animation(object sender, EventArgs e) { colorStoryboard.Begin(); } tBin/TestPage.html 1.5 Point Animation Point Animation biến đổi giá trị toạ độ của một điểm giữa hai biến của đối tƣợng Animation bằng cách sử dụng nội suy tuyến tính trên một khoảng thời gian xác định Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 4
5. // Start the animation when the object loads private void Start_Animation(object sender, EventArgs e) { myStoryboard.Begin(); } tBin/TestPage.html 2 Media Các tính năng đa phƣơng tiện của Silverlight và mô tả cách tích hợp audio và video vào trang Silverlight 2.1 MediaElement Object Để them media(video, audio) vào trang web của bạn ta sử dụng MediaElement . MediaElement sẽ cung cấp cho bạn một Form để hiển thị media , bạn chỉ cần cung cấp các nguồn tài nguyên media cho URI, nhƣ là một file video chẳng hạn. Các MediaElement bắt đầu play khi trang web của bạn tải về. mple.html Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 5
6. 2.2 Controlling Media Playback Interactively Bạn có thể tƣơng tác điều khiển media bằng cách sử dụng Play, Pause, Stop, và các thuộc tính của một đối tƣợng MediaElement. Ví dụ nhƣ định nghĩa một đối tƣợng MediaElement với một số nút điều khiển cho các file (video, audio) phát. private void StopMedia(object sender, RoutedEventArgs e) { media.Stop(); } private void PauseMedia(object sender, RoutedEventArgs e) { media.Pause(); } private void PlayMedia(object sender, RoutedEventArgs e) { media.Play(); } ntBin/TestPage.html Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 6
7. 2.3 Timeline Markers Một timeline marker là siêu dữ liệu liên kết với một điểm trong một tập tin media. các đánh dấu thƣờng đƣợc tạo trƣớc và đƣợc lƣu trữ trong các tập tin media riêng. chúng thƣờng đƣợc sử dụng để đặt tên khác nhau trong một cảnh quay video, cho phép ngƣời sử dụng tìm đến một vị trí hoặc cung cấp các phân cảnh. Khi MediaElement đạt đến một thời gian đánh dấu trong quá trình phát, nó sẽ tăng MarkerReached, sự kiện này có thể sử dụng để kích hoạt hành động khác. Một MediaElement của đối tƣợng Marker đều cho phép bạn truy cập vào tiêu đề (nhúng, đánh dấu lƣu trữ trong tập tin media). Một tập tin có thể chứa cả hai bao gồm tiêu đề nhúng tập lệnh và tập lệnh riêng biệt Time: Type: Value: private void OnMarkerReached(object sender, TimelineMarkerRoutedEventArgs e) { timeTextBlock.Text = e.Marker.Time.Seconds.ToString(); typeTextBlock.Text = e.Marker.Type.ToString(); valueTextBlock.Text = e.Marker.Text.ToString(); } 2.4 Server-Side Playlist Một server-side playlist là một dãy các tài nguyên media cho phép quản trị viên trên máy chủ kiểm soát các tài nguyên media của ngƣời sử dụng. một danh sách media phía máy chủ đƣợc sử dụng để phục vụ việc phát media, nó có thể ko không cho phép download từ client. Silverlight sử dụng tập tin wsx để cấu hình xác định một server-side playlist(SSPL) có thể đƣợc phục vụ cho client thông qua các đối tƣợng MediaElement. Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 7
8. Một số lợi ích của việc sử dụng (SSPL) nhƣ sau - Giảm băng thông do giảm số lần phía client kết nối tới server để lấy nội dung. - Bạn có thể tuỳ chọn danh sách media khi mà bạn đang phát một danh sách media từ trƣớc. - Bạn có thể kiểm soát, bổ sung media. Ví dụ bạn có thể chơi chỉ một phần của một tập tin media. Microsoft Vietnam LLC – DPE team | Chương VI: Media và Animation 8