Làm việc với điều khiển hình ảnh: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 18

Làm việc với điều khiển hình ảnh: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 18
Làm việc với điều khiển hình ảnh: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 18

Video: Làm việc với điều khiển hình ảnh: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 18

Video: Làm việc với điều khiển hình ảnh: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 18
Video: Ultimate Windows Tweaker 4 for Windows 10 - Official Video - YouTube 2024, Tháng tư
Anonim

Bây giờ chúng ta đã giới thiệu về XAML Event And Input Controls, trong nghệ thuật này của loạt phát triển ứng dụng Mango Windows Phone 7.5, chúng ta sẽ xem xét điều khiển hình ảnh cho phép bạn hiển thị hình ảnh trong ứng dụng Silverlight Windows Phone 7.

Vậy hãy bắt đầu!

Tạo một dự án Windows Phone 7 mới với một tên duy nhất như “ImageControlDemo”. Bây giờ kéo và thả Điều khiển hình ảnh từ hộp công cụ đến bề mặt thiết kế. Bây giờ để hiển thị hình ảnh trong điều khiển hình ảnh, chúng tôi sử dụng thuộc tính ‘Nguồn’ của Điều khiển hình ảnh. Bạn có thể tìm thấy thuộc tính này trong Cửa sổ thuộc tính ngay trước thuộc tính 'Kéo dài'. Thuộc tính Source xác định vị trí hình ảnh sẽ được hiển thị trong Điều khiển hình ảnh. Khi nhấp vào dấu ba chấm bên cạnh thuộc tính Nguồn, cửa sổ mới bật mở yêu cầu chúng tôi chọn hình ảnh. Nhấp vào nút Thêm hình ảnh để thêm hình ảnh vào dự án.

Khi chọn một hình ảnh, một vài điều thú vị sẽ xảy ra. Đầu tiên của Visual Studio tự động tạo một thư mục bằng tên Images và thêm tệp hình ảnh mà bạn đã chọn. Thứ hai, nó tạo ra một đường dẫn URI (Mã định danh tài nguyên đồng nhất) / để truy cập hình ảnh, giống như '/Images;component/Images/Picture1.jpg'. / Hình ảnh tham chiếu đến gói triển khai và những gì xuất hiện sau dấu chấm phẩy sẽ tham chiếu tệp đó trong gói triển khai khi tệp được triển khai trên điện thoại, tức là tệp xap. Khi bạn nhấp vào nút OK của cửa sổ Chọn hình ảnh, hình ảnh sẽ được tải vào điều khiển hình ảnh.

Một đặc tính đáng chú ý khác của điều khiển hình ảnh là thuộc tính ‘Stretch’. Thiết lập thuộc tính Stretch để Fill; lấp đầy toàn bộ diện tích của điều khiển hình ảnh bằng hình ảnh bất kể kích thước của hình ảnh. Thay đổi kích thước của điều khiển hình ảnh sẽ thay đổi kích thước của hình ảnh. Không có liên quan đến tỷ lệ hình ảnh được đưa ra do đó bóp méo hình ảnh. Đặt thuộc tính Stretch thành Uniform giữ cho phối cảnh chính xác bằng cách tôn trọng chiều cao hoặc chiều rộng của hình ảnh nhưng nó sẽ không cắt ảnh. Đặt thuộc tính Stretch thành ‘UniformToFill’ tôn vinh tỷ lệ dọc và ngang của hình ảnh. Hình ảnh được cắt bớt nếu cần thiết để duy trì tỷ lệ. Việc cắt có thể được giải quyết bằng cách cho phép người dùng cuộn hình ảnh lên hoặc xuống, sang trái hoặc sang phải. Để làm điều này, tất cả những gì bạn phải làm là bao quanh hình ảnh với một điều khiển ScrollViewer và thiết lập khả năng hiển thị thanh cuộn ngang và dọc của nó để hiển thị.
Một đặc tính đáng chú ý khác của điều khiển hình ảnh là thuộc tính ‘Stretch’. Thiết lập thuộc tính Stretch để Fill; lấp đầy toàn bộ diện tích của điều khiển hình ảnh bằng hình ảnh bất kể kích thước của hình ảnh. Thay đổi kích thước của điều khiển hình ảnh sẽ thay đổi kích thước của hình ảnh. Không có liên quan đến tỷ lệ hình ảnh được đưa ra do đó bóp méo hình ảnh. Đặt thuộc tính Stretch thành Uniform giữ cho phối cảnh chính xác bằng cách tôn trọng chiều cao hoặc chiều rộng của hình ảnh nhưng nó sẽ không cắt ảnh. Đặt thuộc tính Stretch thành ‘UniformToFill’ tôn vinh tỷ lệ dọc và ngang của hình ảnh. Hình ảnh được cắt bớt nếu cần thiết để duy trì tỷ lệ. Việc cắt có thể được giải quyết bằng cách cho phép người dùng cuộn hình ảnh lên hoặc xuống, sang trái hoặc sang phải. Để làm điều này, tất cả những gì bạn phải làm là bao quanh hình ảnh với một điều khiển ScrollViewer và thiết lập khả năng hiển thị thanh cuộn ngang và dọc của nó để hiển thị.
Thuộc tính thống nhất kiểm soát hình ảnh
Thuộc tính thống nhất kiểm soát hình ảnh

Một điều cuối cùng trước khi chúng ta kết thúc bài học này. Trong trường hợp bạn muốn đặt hình ảnh thông qua mã C #, tất cả những gì bạn phải làm là tạo một đối tượng của đối tượng BitmapImage và chỉ định URI trong hàm dựng sẵn đã nạp chồng. Khi đối tượng BitmapImage được tạo, tất cả những gì bạn phải làm là đánh giá nó với thuộc tính nguồn của Image Control.

BitmapImage myImage = new BitmapImage (new Uri ("/ Images; component / Images / Penguins.jpg", UriKind.Relative));

image1.Source = myImage;

Nó là kiểm soát khá đơn giản và có tính hữu dụng của nó phục vụ ở nhiều nơi.

Bây giờ, trong hướng dẫn tiếp theo, chúng ta sẽ tìm hiểu thêm về Styles và Resources.

Bài viết liên quan:

  • GPS, API vị trí và dịch vụ web gọi điện: Hướng dẫn phát triển ứng dụng Windows Phone - 25
  • Tìm hiểu cách phát triển các ứng dụng Mango của Windows Phone 7.5: Phần 1
  • Hướng dẫn sử dụng Windows Phone 8: Tạo nút tùy chỉnh trong Expression Blend-I
  • Hướng dẫn sử dụng Windows Phone 4: Thiết kế giao diện người dùng
  • Làm việc với các phong cách và tài nguyên: Hướng dẫn phát triển ứng dụng Windows Phone - Phần 19

Đề xuất: