Devexpress dễ sử dụng như thế nào

DevExpress là bộ công cụ cực kỳ mạnh mẽ trong việc hỗ trợ các nhà lập trình phát triển giao diện ứng dụng như Windows Form hay web ASP.Net, đơn giản dễ sử dụng, đây là một bộ phần mềm bạn không thể bỏ qua. Đối với những bạn đã và đang sử dụng bộ Visual Studio 2005 – 2008 -2010 thì có lẽ không lạ gì với bộ công cụ này.

Devexpress là một component library hỗ trợ giao diện cho .NET Framework cực mạnh. Hiện nay cũng có nhiều công ty lập trình sử dụng Devexpress để làm việc cho khách hàng, cũng có nhiều bạn sinh viên dùng để làm đề án trên trường. Hỗ trợ C#, VB, ASP.NET, WPF, Silver Light
Đặc biệt tôi thích nhất ở Devexpress chính là giao diện chính của nó, tựa tựa giao diện Word 2007, 2010, và các GridControl, TreeList ... của nó thì khỏi chê vào đâu được, hỗ trợ tận răng cho các bạn từ tìm kiếm nâng cao, hiện hình ảnh ... Crystal Report hỗ trợ báo cáo tốt hơn hẳn Report trong .NET hỗ trợ sẵn
Khi bạn tiếp cận một cái mới to lớn và đồ sộ thì bạn thường bị choáng ngợp, nhưng với Devexpress thì bạn rất dễ dàng nắm bắt nó, phần trợ giúp của nó cực kỳ tốt, có demo và tutorial cho các bạn xem, thậm chí có cả Video tutorial nữa, nên việc nắm bắt sẽ không còn quá khó với các bạn
Có lẽ tôi nói các bạn cũng khó hình dung được Devexpress là gì, và sử dụng nó như thế nào, sau đây tôi sẽ post vài hình ảnh demo để các bạn thấy
Đây là giao diện chính của Devepxress:

Devexpress dễ sử dụng như thế nào



Đây là giao diện chính của GridControl:

Devexpress dễ sử dụng như thế nào



Đây là giao diện chính của TreeList:

Devexpress dễ sử dụng như thế nào


Khi bạn cài chương trình và license xong Devexpress, bạn vào Visual Studio 2005 / 2008 nó sẽ hiện ra các control bên Toolbox cho các bạn, và sử dụng y chang như bạn làm bình thường với Winform / Webform, WPF, Silver Light
Cứ thử đi bạn sẽ thấy ngay sự khác biệt

Link download (Full):
https://shareflare.net/download/3150.3067442c0661be6c9373e090d562150f/DXperience_v9.1.3.rar.html

 

Bạn đang tìm kiếm một thư viện điều khiển Winforms để nâng cao năng suất hoạt động của teamwork? Hay chỉ đơn thuần là bạn đang tìm hiểu về ? Hoidapfun sẽ tổng hợp lại tất cả kiến thức chung nhất về devexpress để có thế giải thích cho bạn dễ hiểu nhất qua bài dưới đây.

Xem thêm:   |  

DevExpress là một Framework được viết cho nền tảng .NET Framework. Nó cung cấp các control và công nghệ để phục vụ cho quá trình phát triển phần mềm. Thành phần của DevExpress gồm:

  •           WinForms Controls: Cung cấp các control cho WinForms.
  •          ASP.NET Controls: Cung cấp các control cho WebForms.
  •           WPF Controls: Cung cấp các control cho WPF.
  •           Silverlight Controls: Cung cấp các control cho Silverlight.
  •           XtraCharts: Control cung cấp các loại biểu đồ.
  •           XtraReports: Cung cấp các control tạo báo cáo.
  •           XPO: Cung cấp môi trường làm việc với database.
  •           XAF: Một công nghệ mới giúp việc phát triển phần mềm một cách nhanh chóng.

Nếu là một lập trình viên chuyên nghiệp và đang làm việc trên một loạt các công nghệ .NET , bạn có thể chọn cho mình DXeprience Universal bao gồm đầu các chức năng, điều khiển cho các công nghệ .NET khác nhau.

Devexpress dễ sử dụng như thế nào

DevExpress giúp chúng ta như thế nào ?

DXperience gồm các công cụ hữu ích của DevExpress. Nó đi kèm với một loạt các công cụ cho các nền tảng khác nhau bao gồm Winforms, ASP.NET, WPF,.v..v.

Một số tính năng nâng cao trong bộ điều khiển tab DXperience bao gồm:

  • Tùy chỉnh giao diện với nhiều màu nền và màu xung quanh.
  • Sử dụng hình ảnh làm hình nền cho điều khiển Tab và các tiêu đề tab
  • Tùy chỉnh tiêu đề tab mà bạn muốn
  • Thêm nút đóng để kiểm soát tab
  • Thêm các nút gần đó để kích hoạt trang tab hoặc tất cả các trang tab .
  • Sử dụng màu sắc gradient
  • Chọn Skins để tùy chỉnh điều khiển.

Vì nhiều tính năng như vậy nên bộ thư viện cũng khá là nặng và tốn thời gian khi chạy chương trình trong lần đầu load form.

Giao diện là một trong những thành phần thể hiện sự chuyên nghiệp của ứng dụng. Một giao diện tối giản nhưng vẫn cung cấp đầy đủ khả năng thao tác là điều được khuyến khích. Một phần mềm có nhiều tính năng nhưng khó thao tác, khó sử dụng sẽ khiến người dùng dễ dàng từ bỏ và tìm đến những phần mềm khác dễ sử dụng hơn. Trong bài viết này mình sẽ chia sẻ cách thiết kế giao diện đẹp, nhanh chóng và dễ dàng sử dụng trên winform bằng DevExpress (DE).

Trước khi cài DE bạn phải cài sẵn visual studio, khuyên bạn nên cài bản mới nhất với net framework mới nhất luôn nhé. Bạn tải DE từ trang của nó tại đây: https://www.devexpress.com. Sau khi tải thì bạn cứ cài bình thường theo các bước của nó, việc này đơn giản nên mình không hướng dẫn. Mất công cài lại hehe. Dùng cái này thì bạn phải trả phí những cũng có một và part crack share trên mạng, nhưng mình thì không có nên bạn tự tìm nhé.

Tạo Project với DevExpress

Sau khi cài xong thì khởi động Visual Studio lên.

Devexpress dễ sử dụng như thế nào

Mình thường viết phần mềm C# nên mình sẽ chọn visual C#, Nếu đã cài đặt thành công DE thì sẽ có phần template Galley để bạn có thể chọn các mẫu có sẵn của DE.

Devexpress dễ sử dụng như thế nào

Sau khi bạn chọn Teamplate Galley thì một khung sẽ xuất hiện để bạn chọn các mẫu. Mình sẽ chọn Black Application cho dễ, chọn mấy cái kia nó sinh ra nhiều thứ không cần thiết làm, chọn cái này rồi thì mình sẽ kéo thả vào những cái cần thiết cho ứng dụng của mình.

Devexpress dễ sử dụng như thế nào

Như vậy là mình đã tạo ra một project với DE, bây giờ mình sẽ sử dụng các công cụ cơ bản của DevExpress để thiết kế giao diện.

Thiết kế giao diện winform sử dụng DevExpress

Trong hộp Toolbox, các công cụ của DE thường có màu khá nổi bật, còn của Windows form thông thường thì chỉ có một màu xám. Các công cụ có công dụng giống với công cụ sẵn thì thường có thêm từ Edit phía sau, ví dụ simple button edit.

Devexpress dễ sử dụng như thế nào

Một số công cụ của DE

Tùy theo yêu cầu và bố cục phát thảo của bạn như thế nào mà bạn có thể thiết kế cho phù hợp. Mình sẽ thiết kế giao diện này theo cách mà mình vẫn hay thường làm đó là sử dụng các Tab con trong 1 from (thực tế là các form trong 1 form) bằng cách dùng một công cụ đặt biệt của DE.

  • Đầu tiên mình sẽ sử dụng một cái Ribbon để chứa các nút điều hướng cho đẹp. Tìm đến RibbonControl và kéo thả vào Form.

Devexpress dễ sử dụng như thế nào

  • Sau đó bạn kéo thả thêm cái XtraTabbedMdiManager để tạo ra vùng chưa tab và các form con sau này.

Devexpress dễ sử dụng như thế nào

  • Bạn run thử thì được kết quả như sau:

Devexpress dễ sử dụng như thế nào

Bây giờ mình sẽ tạo một vài nút trên khung Ribbon.

  • Ribbon của DE có 3 phần chính đó là: Page, Category, và Group.
  • Phần category là lớn nhất, Nó sẽ chứa các Page. Trong 1 page thì bạn có thể chia ra nhiều Group khác nhau.

Nếu thiết kế đầy đủ thì nó sẽ như thế này

Devexpress dễ sử dụng như thế nào

Tuy nhiên mình không khuyến khích bạn sử dụng cái category đâu vì nó rất bất tiện. Mình không hiểu vì sao mà khi add nó vào mình không thể đổi tên các Group được. Run thì nó báo lỗi Ribbon. Cái này thì mình không chắc nhưng mình sẽ bỏ qua nó.

Để thực hiện thêm các page, group thì bạn vào cái mũi tên nhỏ nằm ở góc phải khi nhấn và Ribbon, và chọn Design.

Devexpress dễ sử dụng như thế nào

Sau khi nhấn vào đó thì một bảng sau sẽ hiện ra. Có đầy đủ thông tin cho bạn thực hiện thêm xóa sửa các control phù hợp.

Devexpress dễ sử dụng như thế nào

  • 1: Thêm Category
  • 2: Thêm Page
  • 3: Thêm Group
  • 4: Thay đổi thứ tự của các category, page, group.
  • 5. Xóa một category, page, group bất kỳ.
  • 6. Tạo nút. Nút sau khi tạo phải kéo thả qua phần nó cần hiển thị nhé nếu không nó k hiện gì đâu.
  • 7. Xóa nút bất kỳ đã tạo.
  • 8. Bảng thuộc tính của đối tượng.

Bây giờ mình sẽ thiết kế giao diện cho các form con.

  • Một phần mềm với giao diện tốt bạn không thể cố định kích thước cho nó. Hãy để người dùng tự tùy chỉnh kích thước phù hợp. Bạn có thể sử dụng MaximumSize và MinimumSize để đặt kích thước tối đa hoặc tối thiểu ngăn việc kích thước hiển thị sai quy cách.

Trong DE có một công cụ giúp các công cụ khác nằm trong nó có thể được điều chỉnh kích thước phù hợp có tên là LayoutControl.

Devexpress dễ sử dụng như thế nào

Sau khi kéo thả LayoutControl vào thì cần Dock nó ra full form như dưới.

Devexpress dễ sử dụng như thế nào

Bây giờ có thể kéo thả các control khác vào đây. Một control được kéo vào sẽ được hiển thị kèm một cái nhãn (label) ở bên như dưới đây.

Devexpress dễ sử dụng như thế nào

Mỗi một layout sẽ bao gồm 1 label và một control, bạn có thể ẩn đi cái label bằng thuộc tính TextVisible của layout.

Devexpress dễ sử dụng như thế nào

kết quả này mình sử dụng 3 cái textedit, 3 cái simplebutton, 1 cái GridViewControl. và một cái GroupBox để đẩy 3 cái button qua. Bạn có thể thực hành kéo thả rồi sẽ có kinh nghiệm, lúc đầu mình dùng thì nó cũng nhảy lung tung lên.

Add form con sử dụng xtraTabbedMdiManager

Việc kéo thả trên rất đơn giản, bạn có thể tiếp tục nghiên cứu. Bước tiếp theo mình sẽ hướng dẫn bạn cách gọi các form con vào form chính.

Bây giờ mình sẽ mở code behind của cái from chính lên. và code đoạn này vào

private Form kiemtraform(Type ftype) {    foreach (Form f in this.MdiChildren)    {        if (f.GetType() == ftype)        {           return f;        }     }     return null; }

Đây là một hàm From để mình kiểm tra là from đã đươc ở hay chưa, và trả về kết quả, nếu null mình mới add ngược lại thì không. Trường hợp này lúc đầu mình có gặp phải do khách hàng nhấn nút 2 lần nó hiện ra hai form y chang nhau.

Tiếp theo bạn nhấn đôi vào một nút bất kỳ ở form chính để mở thuộc tính event click của nó và cho đoạn code này vào.

Form frm = kiemtraform(typeof(fm.frm_thongkekhohang)); if (frm == null) {    fm.frm_thongkekhohang forms = new fm.frm_thongkekhohang();    forms.MdiParent = this;    forms.Show(); }    else {    frm.Activate(); }

fm.frm_thongkekhohang là tên form bạn cần add vào nhé, fm là cái thư mục mình tạo để nhét nó vào để dễ quản lý thôi.

sau đó thì bạn run thử để xem kết quả nhé.

Devexpress dễ sử dụng như thế nào

Trong bài viết này mình chỉ chia sẻ như vậy thôi, còn những thứ khác bạn có thể xem thêm trong blog của mình, nếu không tìm thấy bạn có thể để lại bình luận dưới blog mình sẽ trả lời, nếu quá dài mình sẽ viết một bài riêng để hướng dẫn. Nếu bạn muốn nhận tin nhanh nhất đừng quên đăng ký nhận tin bằng cái chuông đỏ ở bên nhé.

Chúc bạn thành công.

5/5 - (2 bình chọn)

Devexpress dễ sử dụng như thế nào

Tác giả: ĐOÀN CÔNG TUẤN

Với niềm đam mê về khoa học công nghệ thông tin, đặc biệt là lập trình. Tôi đã thành lập blog Tuandc.com để lưu trữ và chia sẻ những kiến thức thực tế có được trong quá trình làm việc. Với kinh nghiệm gần 10 năm làm việc trong lĩnh vực, những kiến thức tôi chia sẻ hy vọng sẽ giúp được phần nào đó.