Tăng tốc phát triển ứng dụng UWP với Toolkit

Nhân dịp mình đang tham gia vào một dự án lập trình ứng dụng Windows 10 hay còn được gọi là Universal Windows Platform (UWP), bài viết ngày hôm nay mình sẽ chia sẻ với các bạn về một số “toolkit” giúp những ai yêu thích lập trình UWP như mình 🙂 có thể nhanh chóng xây dựng được một ứng dụng UWP có giao diện đẹp mắt cùng chất lượng “không thể tin nổi”!

Bài toán

Trong phát triển phần mềm với đối tượng cụ thể trong bài viết này là những ứng dụng cho Windows 10, thời gian là yếu tố vô cùng quan trọng. Cùng một đề bài, ai đưa ra được sản phẩm nhanh, chạy ổn định hơn, người đó có lợi thế cạnh tranh. Để có được lợi thế đó, không phải ai cũng có thể dễ dàng làm được thậm trí với những người có nhiều năm kinh nghiệm huống chi là những bạn mới bắt đầu làm quen với nền tảng ứng dụng UWP này.

Giải pháp

Có nhiều giải pháp để giúp bạn có được lợi thế cạnh tranh về mặt thời gian nói trên và một trong số đó là sử dụng các bộ công cụ bổ sung (toolkit) bên ngoài. Những bộ toolkit này bao gồm các function helper, các UI control có khả năng tùy chỉnh được, các animation, behavior cùng các service hỗ trợ khác, cung cấp những tính năng hữu ích để giúp bạn nhanh chóng xây dựng được ứng dụng UWP của mình.

Ở bài viết này, mình sẽ giới thiệu với các bạn 2 bộ toolkit khá “nổi” trong cộng đồng lập trình ứng dụng UWP và điều đặc biệt là đây là những bộ open source toolkit tức là những bộ toolkit được mở nguồn, cho phép bạn có thể tải source code về tùy chỉnh theo nhu cầu riêng hoặc tham gia đóng góp chung để phát triển những bộ toolkit này.

Hai bộ open source toolkit được mình chia sẻ có tên:

• UWP Community Toolkit
• Telerik UI for UWP

UWP Community Toolkit

UWP Community Toolkit là bộ toolkit được phát triển ban đầu bởi chính Microsoft và được đóng góp mạnh mẽ bởi cộng đồng. Bộ công cụ này bao gồm:

• các function helper như các IValueConverter converter, StorageFileHelper bao gồm các hàm hỗ trợ tương tác đọc/ghi với file, …;
• các service để nhanh chóng tương tác với các dịch vụ bên ngoài như Bing, Facebook, Twitter, …;
• các animation behavior để tạo hiệu ứng chuyển động đẹp mắt như Blur, Fade, Light, Scale, …;
• các UI control có khả năng tùy chỉnh như Carousel, Expander, AdaptiveGridView, …

Được “chống lưng” bởi Microsoft, bộ toolkit này có tính hoàn thiện cũng như tính tương thích rất cao với các phiên bản Windows SDK của Windows 10 được hỗ trợ. Sở dĩ có được chất lượng cao như vậy bởi Microsoft sẽ lựa chọn những tính năng hữu ích, thu hút được đông sự quan tâm của cộng đồng trong bộ toolkit này để đưa vào các phiên bản Windows 10 SDK tiếp theo của họ.

1 trong 3 nguyên tắc phát triển UWP Community Toolkit đó là “đơn giản” do vậy việc sử dụng UWP Community Toolkit rất dễ, chỉ với vài dòng code là bạn đã có thể có được những hiệu ứng đẹp mà nếu tự viết thì mình nghĩ bạn sẽ mất kha khá thời gian đấy!, hay nhanh chóng xử lý được bài toán tích hợp với các dịch vụ bên ngoài như Facebook chẳng hạn.

Ví dụ đoạn code sau giúp bạn thêm được hiệu ứng làm mờ cho 1 control nào đấy với độ mờ là 10 Gaussian trong 5 giây:

<interactivity:Interaction.Behaviors>
	<behaviors:Blur x:Name="BlurBehavior" 
					Value="10" 
					Duration="500" 
					Delay="250" 
					AutomaticallyStart="True" />
</interactivity:Interaction.Behaviors>

hoặc viết bằng C#:

MyControl.Blur(value: 10, duration: 500, delay: 250);

Hay đoạn code sau giúp bạn đăng tải một nội dung nào đấy lên “tường” (News Feed) cá nhân của Facebook:

// Khởi tạo service
FacebookService.Instance.Initialize("Facebook App ID");

// Đăng nhập vào Facebook
if (!await FacebookService.Instance.LoginAsync())
{
    return;
}

// Đăng status lên tường cá nhân
await FacebookService.Instance.PostToFeedAsync("Tiêu đề", "Nội dung", "Miêu tả", "Đường dẫn đính kèm");

Phiên bản hiện tại tính đến thời điểm viết bài viết này của UWP Community Toolkit là 1.5 và bộ source code của nó hiện có sẵn trên GitHub để các bạn có thể tham gia đóng góp cho bộ toolkit này. Ngoài ra, UWP Community Toolkit cũng được cung cấp tới cho lập trình viên dưới dạng các package trên Nuget.

Nếu bạn muốn có ngay trải nghiệm các tính năng có trong bộ toolkit này mà không muốn phải code, bạn có thể tải ứng dụng UWP Community Toolkit Sample App, một ứng dụng cho phép bạn xem trước hầu hết tất cả các tính năng có trong bộ UWP Community Toolkit này.

Telerik UI for UWP

Nếu bạn hay dùng các UI control bên ngoài, Telerik không phải là một cái tên quá xa lạ. Đây là một công ty (mới được mua lại bởi Progress) chuyên xây dựng các UI control có chất lượng rất cao cho các nền tảng ứng dụng như Windows Forms, WPF, Windows Phone, ASP.NET, …

Tại những thời gian đầu UWP được ra mắt cộng đồng lập trình viên, Telerik là một trong những công ty đầu tiên phát triển các bộ UI control hỗ trợ cho nền tảng này (Telerik UI for UWP) và cung cấp dưới dạng trả phí để sử dụng. Tuy nhiên vào đầu tháng 2 năm 2017, Telerik đã chính thức open source bộ UI control cho UWP của họ.

Telerik UI for UWP cung cấp hơn 20 các UI control có khả năng tùy chỉnh được và được hoàn thiện khá tốt nổi bật như: RadDataGrid với khả năng hỗ trợ xây dựng các bảng dữ liệu có thể sort, filter, group hoặc chỉnh sửa dữ liệu trực tiếp, hay RadChart với khả năng cho phép bạn nhanh chóng biểu diễn dữ liệu dưới dạng biểu đồ với các loại biểu đồ khác nhau như Bar, Line, Pie, Area, …

Telerik UI for UWP hiện được open source trên GitHub và cũng được cung cấp tới cho lập trình viên dưới dạng package thông qua kênh Nuget.

Mặc dù open source, nhưng Telerik vẫn cung cấp gói hỗ trợ kỹ thuật cho bộ UI control này của họ. Tuy nhiên mức giá cho gói hỗ trợ này khá “chát”, $599 cho 1 năm hỗ trợ (xem chi tiết tại đây).

Kết luận

Với những khả năng ấn tượng của 2 bộ toolkit trên, phần nào chúng sẽ giúp cho những ai đang lập trình ứng dụng UWP đặc biệt là những bạn mới bắt đầu làm quen với nền tảng này nhanh chóng xây dựng được một ứng dụng UWP có chất lượng tốt.

2 bộ toolkit này có những tính năng nổi bật riêng và gần như chúng bổ sung lẫn nhau. Do vậy bạn hoàn toàn có thể sử dụng chung chúng trong cùng 1 dự án nhằm khai thác tối đa sức mạnh của từng bộ toolkit cũng như của cả 2 bộ toolkit khi chúng được kết hợp với nhau.

Happy coding!