Lập trình ViewPhotos 5 bước Với WPF

Bước 1:  Nhấn New Project chọn WPF Applycation và đặt tên là ViewPhotos rồi click OK!

Lưu ý: nhấn vào hình để xem rõ hơn!

Bước 2: Sử dụng Tools Box và thêm 4 button và 1 Image như trong hình

Ngoài thiết kế bằng Design bạn còn có thể thiết kế theo XAML

Bước 3: Thêm một lớp mới bằng cách nhấn tổ hợp phím Ctrl+Shift+A và đặt tên là  Photocollection.cs

Bước 4: Viết code cho  Photocollection.cs như hình, mình đã giải thích tất cả trong hình

Bước 5: Bước tiếp quay trở lại MailWindow.XAML.cs để thiết lập sự kiện

Hoàn thành! Nhấn F5 để chạy thử. Chúc bạn thành công!

Source: http://www.mediafire.com/?5jb7hen7dytdtfk

TỔNG QUAN VỀ WINDOWS PRESENTATION FOUNDATION PHẦN 2

Some Features in Wpf 4.0

Những cải tiến mới của wpf 4.0

Wpf là một trong những core components của .Net Framework, cho phép developer xây dựng những ứng dụng wondow client đẹp mắt.

WPF 4.0 bao gồm những cải tiến mới về năng suất, hiệu suất cũng như năng lực đặc biệc của các controls, XAML, Text, Graphics, những tích hợp cho Window7 (multitouch, taskbar integration, etc), những nguyên tắc cốt lõi và việc triển khai.

Controls

Những controls cho ứng dụng client

WPF 4.0 thêm vào hang loạt các control mới giúp cho việc xây dựng các bisiness application một cách dể dàng và nhanh chóng.Những Tính năng mới được thiết lặp trong các controls Vd như : DataGrid, DatePicker, and Calendar controls…..và hầu như 99% các controls mới đều là API có khả năng tương thích cao với Silverlight, tạo ra một môi trường nhất quán chung cho các ứng dụng Client và web, tối ưu hóa việc triển khai code dung chung giữa Silverlight và WPF

image

Bag O’Tricks

Đây là bộ gồm 8 controlsAnimatingTilePanel, ColorPicker, InfoTextBox, ListPager, NumericUpDown, Reveal, TransitionsPresenter, TreeMapPanel.

Windows 7 & Office Ribbon Control

Bộ Ribbon control đã được cho phép download trước khi phát hành WPF 4.0 , nó là những tính năng mới cho giao diện Window7 và Office, và cho đến bây giờ thì Ribbon controls đã được sử dụng rất rộng rãi với những tính năng quen thuộc như : các tabs and groups, dynamic resizing, quick access toolbar, application menu, contextual tabs, key tips…….

image

WPF Ribbon sẽ ngày càng phát triển và mở rộng những tính năng mới trong tương lai, bạn có thể tham khảo các chức năng hiện tại tại đây : http://www.codeplex.com/wikipage?ProjectName=wpf&title=WPF%20Ribbon%20Preview

Graphic

Cached Composition

Thành phần tính năng mới trong WPF 4.0 , cho phép các ứng dụng với nội dung tùy ý hoàn toàn tương tác với các controls, vector hình học …. Như là bitmap mà vẫn tồn tại trong bộ nhớ Video. Sau khi lưu trữ, từng phần tử này có thể tùy ý chuyển đổi, animated, chế tác và có thể có những hiệu ứng áp dụng, không cần trả lại phần tử lưu trữ.

Pixel Shader 3 Support

WPF 4.0 Xây dựng và hổ trợ rất nhiều hiệu hứng, phổ biến là ShaderEffect được giới thiệu lần đầu tiên trong WPF 3.5 SP1 cho phép viết những ứng dụng có nhiều hiệu ứng sử dụng Pixel Shader version 3.0.

Phiên bản PS 3.0 hổ trợ những hiệu ứng phức tạp và tinh vi hơn phiên bản PS 2.0, cho phép những hiệu ứng hấp dẫn hơn mà phần cứng hổ trợ.

image

TEXT STACK

The WPF text rendering stack đã được thay đổi hoàn toàn, một sự thay đổi đó đã mang đến những cải tiến đáng kể về những nét vẽ, độ nét trong văn bản, về cấu hình cũng như hổ trợ cho các ngôn ngữ quốc tế .  Bây giờ Text Stack mới hổ trợ tối ưu hiển thị ký tự, để tạo văn bản với độ sắc nét hơn hẳn so với win32/GDI :

image

WPF Text Stack hổ trợ vẽ theo chế độ  aliased, grayscale, or ClearType :

image

Selection and Caret Brush

SelectionBrush and CaretBrush khá rõ ràng với hai VD sau :

 imageimage

Hổ trợ Windows 7 Multitouch

Với việc hổ trợ Multitouch và xử lý đa thao tác , WPF cung cấp những tính năng tuyệt vời để làm nổi bậc những ứng dụng Client trên Window7. Xử lý đa tương tác với những sự kiện đầu vào. Bao gồm một số tính năng mới như :

image

•Multi-touch Manipulation, Inertia (Pan, Zoom, Rotate) events on UIElement

•Raw multi-touch events (Up, Move, Down) on UIElement, UIElement3D and ContentElement

•Multiple capture supporting multiple active controls

•ScrollViewer enhancement to support multi-touch panning

•Touch device extensibility

•Future Surface SDK compatibility

Theo Pham Phuong

 

TỔNG QUAN VỀ WINDOWS PRESENTATION FOUNDATION PHẦN 1

1.WPF là gì?

WPF, viết tắt của Windows Presentation Foundation, là hệ thống API mới hỗ trợ việc xây dựng giao diện đồ hoạ trên nền Windows. Được xem như thế hệ kế tiếp của WinForms, WPF tăng cường khả năng lập trình giao diện của lập trình viên bằng cách cung cấp các API cho phép tận dụng những lợi thế về đa phương tiện hiện đại. Là một bộ phận của .NET Framework 3.0, WPF sẵn có trong Windows Vista và Windows Server 2008. Đồng thời, WPF cũng có thể hoạt động trên nền Windows XP Service Pack 2 hoặc mới hơn, và cả Windows Server 2003. cho đến nay WPF đã được sử dụng khá phổ biến qua Window7, window server 2008 … và tiếp tục là một bộ phận quan trọng của .NET Framework 4.0
WPF được xây dựng nhằm vào ba mục tiêu cơ bản:
1) Cung cấp một nền tảng thống nhất để xây dựng giao diện người dùng;
2) Cho phép người lập trình và người thiết kế giao diện làm việc cùng nhau một cách dễ dàng
3) Cung cấp một công nghệ chung để xây dựng giao diện người dùng trên cả Windows và trình duyệt Web.
1.1 Nền tảng thống nhất để xây dựng giao diện người dùng :
Trước khi WPF ra đời, việc tạo giao diện người dùng theo những yêu cầu mô tả ở ví dụ trên đòi hỏi sử dụng rất nhiều công nghệ khác nhau (xem Bảng 2.1). Để tạo form, các control và các tính năng kinh điển khác của một giao diện đồ họa Windows, thông thường lập trình viên sẽ chọn Windows Forms, một phần của .NET Framework. Nếu cần hiển thị văn bản, Windows Forms có một số tính năng hỗ trợ văn bản trực tiếp hoặc có thể sử dụng Adobe’s PDF để hiển thị văn bản có khuôn dạng cố định. Đối với hình ảnh và đồ họa 2 chiều, lập trình viên sẽ dùng GDI+, một mô hình lập trình riêng biệt có thể truy nhập qua Windows Forms. Để hiển thị video hay phát âm thanh, lập trình viên lại phải sử dụng Windows Media Player, và với đồ họa 3 chiều, anh ta lại phải dùng Direct3D, một thành phần chuẩn khác của Windows. Tóm lại, quá trình phát triển giao diện người dùng theo yêu cầu trở nên phức tạp, đòi hỏi lập trình viên quá nhiều kỹ năng công nghệ.
21.png picture by phamnguyenit
Bảng 0.1 – Thành phần giao diện theo yêu cầu và những công nghệ chuyên biệt cần thiết để tạo chúng.
WPF là giải pháp hợp nhất nhằm giải quyết tất cả những vấn đề công nghệ nêu trên, hay nói cách khác, WPF cung cấp nhiều tính năng lập trình giao diện trong cùng một công nghệ đơn nhất. Điều này giúp cho quá trình tạo giao diện người dùng trở nên dễ dàng hơn đáng kể. Hình 2.2 cho thấy một giao diện quản lý và theo dõi bệnh nhân có sự kết hợp của hình ảnh, text, đồ họa 2 chiều/3 chiều và nhiều thông tin trực quan khác. Tất cả đều được tạo ra bằng WPF – lập trình viên không cần viết code để sử dụng các công nghệ chuyên biệt như GDI+ hay Direct3D.
22.png picture by phamnguyenit
Hình 0.1 – Một giao diễn người dùng quản lý và theo dõi bệnh nhân sử dụng WPF có thể kết hợp hình ảnh, text, đồ họa 2 chiều/3chiều và nhiều tính năng trực quan khác
Việc tạo ra một giao diện người dùng hiện đại không chỉ là việc hợp nhất các công nghệ sẵn có khác nhau. Nó còn thể hiện ở việc tận dụng lợi điểm của card đồ họa hiện đại. Để giải phóng những hạn chế của đồ họa bitmap, WPF dựa hoàn toàn trên đồ họa vector, cho phép hình ảnh tự động thay đổi kích thước để phù hợp với kích thước và độ phân giải của màn hình mà nó được hiển thị. Bằng việc hợp nhất tất cả các công nghệ cần thiết để tạo ra một giao diện người dùng vào một nền tảng đơn nhất, WPF đơn giản hóa đáng kể công việc của lập trình viên giao diện. Với việc yêu cầu lập trình viên học một môi trường phát triển duy nhất, WPF góp phần làm giảm chi phí cho việc xây dựng và bảo trì ứng dụng. Và bằng việc cho phép tích hợp đa dạng nhiều cách biểu diễn thông tin trên giao diện người dùng, WPF góp phần nâng cao chất lượng, và theo đó là giá trị công việc, của cách thức người dùng tương tác với ứng dụng trên Windows.
2. Khả năng làm việc chung giữa người thiết kế giao diện và lập trình viên
Trong thực tế, việc xây dựng một giao diện người dùng phức hợp như trong ví dụ về ứng dụng quản lý bệnh nhân trên đòi hỏi những kỹ năng ít thấy ở những lập trình viên đơn thuần, mà chỉ có thể tìm thấy ở những người thiết kế giao diện chuyên nghiệp. Nhưng câu hỏi đặt ra là làm sao để người thiết kế và lập trình viên có thể làm việc cùng nhau? Thông thường, người thiết kế giao diện sử dụng một công cụ đồ họa để tạo ra những ảnh tĩnh về cách bố trí giao diện trên màn hình. Những hình ảnh này sau đó được chuyển tới lập trình viên với nhiệm vụ tạo ra mã trình để hiện thực hóa giao diện đã thiết kế. Đôi lúc vẽ ra một giao diện thì đơn giản với người thiết kế, nhưng để biến nó thành hiện thực có thể là khó khăn hoặc bất khả thi với lập trình viên. Hạn chế về công nghệ, sức ép tiến độ, thiếu kỹ năng, hiểu nhầm hoặc đơn giản là bất đồng quan điểm có thể khiến lập trình viên không đáp ứng được đầy đủ yêu cầu từ người thiết kế. Do vậy, điều cần thiết ở đây là một cách thức để hai nhóm công tác độc lập này có thể làm việc với nhau mà không làm thay đổi chất lượng của giao diện đã thiết kế.
Để thực hiện được điều này, WPF đưa ra ngôn ngữ đặc tả eXtensible Application Markup Language (XAML). XAML định ra một tập các phần tử XML như Button, TextBox, Label…, nhằm định nghĩa các đối tượng đồ họa tương ứng như nút bấm, hộp thoại, nhãn…, và nhờ đó cho phép mô tả chính xác diện mạo của giao diện người dùng. Các phần tử XAML cũng chứa các thuộc tính, cho phép thiết lập nhiều tính chất khác nhau của đối tượng đồ họa tương ứng. Ví dụ, đoạn mã sau sẽ tạo ra một nút bấm màu đỏ có nhan đề “Bỏ qua”. <Button Background=”Red”>No</Button> Mỗi phần tử XAML lại tương ứng với một lớp WPF, và mỗi thuộc tính của phần tử đó lại tương ứng với thuộc tính hay sự kiện của lớp này. Chẳng hạn, nút bấm màu đỏ trong ví dụ trên có thể tạo bằng C# code như sau: Button btn = new Button(); btn.Background = Brushes.Red; btn.Content = “No”; Nếu như mọi thứ có thể biểu diễn bằng XAML thì cũng có thể biểu diễn bằng đoạn mã, thì câu hỏi đặt ra là XAML có ý nghĩa gì? Câu trả lời là việc xây dựng các công cụ sinh và sử dụng các đặc tả bằng XML dễ dàng hơn nhiều so với xây dựng một công cụ tương tự làm việc với đoạn mã. Bởi vậy, XAML mở ra một cách thức tốt hơn để lập trình viên và người thiết kế làm việc với nhau
Người thiết kế có thể mô tả giao diện người dùng và tương tác với nó thông qua một công cụ, chẳng hạn như Microsoft Expression Blend. Chỉ tập trung vào việc định ra diện mạo và cảm quan cho giao diện đồ họa WPF, công cụ này sinh các đoạn mô tả giao diện thể hiện qua ngôn ngữ XAML. Lập trình viên sau đó sẽ nhập đoạn mô tả XAML đó vào môi trường lập trình, chẳng hạn như Microsoft Visual Studio. Thay vì lập trình viên phải tái tạo lại giao diện từ đầu dựa trên một ảnh tĩnh mà người thiết kế cung cấp, bản thân các đoạn XAML này sẽ được Microsoft Visual Studio biên dịch để tái tạo thành giao diện đồ họa đúng theo mô tả. Lập trình viên chỉ tập trung vào việc viết mã trình cho giao diện được sinh ra, chẳng hạn như xử lý các sự kiện, theo những chức năng đề ra của ứng dụng. Việc cho phép người thiết kế và lập trình viên làm việc chung như vậy sẽ hạn chế những lỗi phát sinh khi hiện thực hóa giao diện từ thiết kế. Thêm vào đó, nó còn cho phép hai nhóm công tác này làm việc song song, khiến mỗi bước lặp trong quy trình phát triển phần mềm ngắn đi và việc phản hồi được tốt hơn. Vì cả hai môi trường đều có khả năng hiểu và sử dụng XAML, ứng dụng WPF có thể chuyển qua lại giữa hai môi trường phát triển để sửa đổi hay bổ sung giao diện. Với tất cả những lợi điểm này, vai trò của người thiết kế trong việc xây dựng giao diện được đặt lên hàng đầu.
3. Công nghệ chung cho giao diện trên Windows và trên trình duyệt Web
Trong thời đại bùng nổ của Internet, các ứng dụng Web ngày một phát triển. Việc trang bị giao diện người dùng với đầy đủ tính năng như một ứng dụng desktop sẽ thu hút nhiều người sử dụng;, và do đó góp phần làm tăng giá trị doanh nghiệp. Tuy nhiên, như đã nêu trong phần đầu, với những công nghệ truyền thống, để phát triển một giao diện đồ họa vừa hoạt động trên desktop vừa trên trình duyệt Web, đòi hỏi phải sử dụng những công nghệ
hoàn toàn khác nhau, giống như việc xây dựng hai giao diện hoàn toàn độc lập. Điều này tạo ra chi phí không cần thiết để phát triển giao diện. WPF là một giải pháp cho vấn đề này. Lập trình viên có thể tạo ra một ứng dụng trình duyệt XAML (XBAP) sử dụng WPF chạy trên Internet Explore. Trên thực tế, cùng đoạn code này có thể được dùng để sinh ứng dụng WPF chạy độc lập trên Windows.
Mỗi ứng dụng XBAP được download khi cần từ một Web server, nên nó phải tuân theo những yêu cầu về an ninh khắt khe hơn đối với một ứng dụng Windows độc lập. Theo đó, XBAP chạy trong phạm vi sandbox an ninh do hệ thống an ninh truy nhập mã của .NET Framework cung cấp. XBAP chỉ chạy với các hệ thống Windows có cài đặt WPF và chỉ với Internet Explore phiên bản 6 và 7 trở lên.
Các thành phần của WPF Giống như các thành phần khác của .NET Framework, WPF tổ chức các chức năng theo một nhóm
namespace cùng trực thuộc namespace System.Windows. Bất kể chức năng nào được sử dụng, cấu trúc cơ bản của mọi ứng dụng WPF đều gần như nhau. Là ứng dụng Windows độc lập hay là một XBAP, một ứng dụng WPF điển hình bao giờ cũng gồm một tập các trang XAML và phần code tương ứng được viết bằng C# hoặc Visual Basic, còn gọi là các file code-behind. Tất cả các ứng dụng đều kế thừa từ lớp chuẩnApplication của WPF. Lớp này cung cấp những dịch vụ chung cho mọi ứng dụng, chẳng hạn như các biến lưu trữ trạng thái của ứng dụng, các phương thức chuẩn để kích hoạt hay kết thúc ứng dụng. Mặc dù WPF cung cấp một nền tảng thống nhất để tạo giao diện người dùng, những công nghệ mà WPF chứa đựng có thể phân chia thành những thành phần độc lập. Nhân của WPF là cơ chế tạo sinh đồ họa dựa trên vector và độc lập với độ phân giải nhằm tận dụng những lợi thế của phần cứng đồ họa hiện đại. WPF được mở rộng với các tập tính năng phát triển ứng dụng bao gồm XAML, các control, cơ chế móc nối dữ liệu, layout, đồ họa 2 chiều, ba chiều, hoạt họa, style, khuôn dạng mẫu, văn bản, media, text và in ấn. WPF nằm trong .NET Framework, nên ngoài ra, ứng dụng WPF có thể kết hợp các thành phần khác có trong thư viện lớp của .NET Framework.
Capture.png picture by phamnguyenit
Hình 0.5. Các thành phần cơ bản của WPF
4.Công cụ phát triển WPF
Như đã trình bày ở trên, WPF cung cấp rất nhiều tính năng cho những lập trình viên. Tuy nhiên, một công nghệ dù có hữu dụng đến đâu cũng cần một công cụ và môi trường tốt để phát huy những lợi điểm của nó. Đối với WPF, Microsoft cung cấp một công cụ chuyên dùng cho lập trình viên, và một công cụ khác phục vụ người thiết kế giao diện. Phần dưới đây đề cập ngắn gọn về những công cụ này.
Microsoft Visual Studio – Công cụ cho lập trình viên
Visual Studio là công cụ chủ đạo của Microsoft dành cho lập trình viên phần mềm. Microsoft cung cấp thành phần mở rộng cho Visual Studio 2005 cho phép lập trình viên có thể tạo ra các ứng dụng WPF. Phiên bản tiếp theo của Visual Studio (2008) có bổ sung thêm các tính năng phát triển ứng dụng WPF, trong đó bao gồm Visual Designer, môi trường thiết kế giao diện cho WPF. Sử dụng công cụ này, lập trình viên có thể tạo ra giao diện WPF một cách trực quan, trong khi sản sinh các đặc tả XAML tương ứng một cách tự động…đến Visual Studio 2010 WPF bổ sung rất nhiều tính năng mới mà tiêu biểu là Ribbon Control .
Hình Ribbon Control trong Visual Studio 2010
Về cụ thể từng chức năng cũng như từng control mình sẽ giới thiệu ở bài sau …..
Microsoft Expression Design – Công cụ cho người thiết kế
Như đã giới thiệu trong phần trước, mục tiêu cơ bản của WPF là nâng cao vị thế của người thiết kế trong việc tạo giao diện người dùng. Để đạt mục tiêu này, ngoài XAML là công nghệ cốt lõi, Microsoft cũng đưa ra một công cụ mới cho phép người thiết kế làm việc thuận tiện hơn, đó là Microsoft Expression Blend
Capture1.png picture by phamnguyenit
Microsoft Expression Design cung cấp những tính năng truyền thống của một công cụ thiết kế, cho phép người dùng làm việc theo cách quen thuộc. Ngoài ra, công cụ này đặc biệt tập trung vào việc hỗ trợ tạo giao diện cho các ứng dụng WPF. Tất cả các tính năng WPF mô tả ở trên đều sẵn có trong môi trường thiết kế này, và cho phép người dùng thiết kế một cách trực quan. Kết quả thiết kế được biểu diễn dưới dạng file XAML do công cụ này sinh ra, và sau đó có thể được nhập vào môi trường Visual Studio.
5. Ứng dụng đầu tiên với WPF – Hello World
Phần này giúp các bạn làm quen với lập trình WPF thông qua một ví dụ kinh điển: Hello World. Ứng dụng chỉ bao gồm một nút bấm có nhãn ban đầu là Hello World. Khi nhắp chuột vào nút, nút sẽ đổi tên thành “From Hanoi, Vietnam”. Môi trường lập trình ở đây là bộ Visual Studio 2008 với .NET Framework 3.5. Quy trình thực hiện như sau:
Tạo ứng dụng WPF
Ở đây, ta chú ý chọn .Net Framework 4.
Giao diện thiết kế ứng dụng:
Chúng ta sẽ làm 2 phương pháp, một là viết code C# trực tiếp trong ứng dụng, hai là viết bằng mã XAML kết hợp với kéo thả control.
Tạo ứng dụng Hello World bằng code C#
Mở Toolbox lên bằng cách ấn tổ hợp phím Ctrl+W+X
-các bạn kéo một button vào trong bảng thiết kế và thiết lập thuộc tính Content cho nó là Click me!

để thiết lập sự kiện cho button bạn nhấn đúp click vào button vừa tạo, sau khi click đúp một cửa sổ mới hiện ra nơi này giúp bạn thiế lập sự kiện cho chương trình.

các bạn thêm dòng lệnh : button1.content=”Xin chào!”; vào trong vùng sử lý sự kiện

//Nhấn F5 để biên dịch project và chạy kết quả.

Tạo ứng dụng Hello World bằng XAML

WPF hỗ trợ trên nền tảng XAML nên ta có thể tạo đối tượng hoàn toàn bằng ngôn ngữ XAML. Lưu ý, với cùng project trên, muốn viết đặc tả bằng XAML tương đương ta cần xóa bỏ phần mã trình C# cũ đi, vì C# và XAML không thể cùng sinh một đối tượng. Cách thực hiện: Mở file Window1.xaml tương ứng với file code Window1.xaml.cs ở trên. Thêm đoạn mã đặc tả XAML tương đương sau:4.png picture by phamnguyenit

Nhấn f5 để chạy và xem kết quả

Nguồn Phamnguyen