Kể từ khi Delphi 11 ra mắt, hiệu suất của thành phần ListBox đã được cải thiện đáng kể. Cùng với sự hỗ trợ của Skia, việc hiển thị lượng lớn dữ liệu trong ListBox giờ đây không còn là vấn đề về hiệu năng. Tuy nhiên, so với ListView, ListBox còn thiếu hiệu ứng hiển thị khi cuộn đến đầu hoặc cuối danh sách. Trong các ứng dụng thực tế, việc tải dữ liệu theo từng phần thay vì tải toàn bộ một lần là một yêu cầu phổ biến. Hãy tưởng tượng cảnh tượng hoàn hảo khi người dùng cuộn đến cuối ListBox, một hoạt ảnh tải dữ liệu xuất hiện, tự động ẩn đi sau khi hoàn tất, và trong quá trình tải, ListBox bị vô hiệu hóa để ngăn người dùng tương tác. Để giải quyết vấn đề này, tác giả của ChinaCock đã kế thừa ListBox và đóng gói một thành phần mới: CCListBox, giúp giải quyết triệt để vấn đề trên.

Chúng ta hãy cùng khám phá những tính năng độc đáo mà CCListBox mang lại và cách sử dụng nó.

Các thuộc tính được bổ sung:

1. BoundsAnimation: Kiểu boolean. Nếu đặt là False, thành phần hoạt động giống như ListBox gốc. Thuộc tính này cho phép hoặc không cho phép hiệu ứng cuộn lên và cuộn xuống. Giá trị mặc định là True.
2. EnablePullDownRefresh: Cho phép hiệu ứng cuộn xuống (kéo xuống). Khi thuộc tính này là True, một hoạt ảnh sẽ hiển thị và sự kiện OnPullDownRefreshing sẽ được kích hoạt.
3. EnablePushUpRefresh: Cho phép hiệu ứng cuộn lên (kéo lên). Khi thuộc tính này là True, một hoạt ảnh sẽ hiển thị và sự kiện OnPushUpRefreshing sẽ được kích hoạt.
4. IsTransparent: Đặt ListBox có hiển thị trong suốt hay không. Với thuộc tính này, chúng ta có thể tùy chỉnh màu nền cho CCListBox. Ví dụ, khi đặt CCListBox lên một Form, bạn có thể thiết lập màu nền cho Form và đặt ListBox là trong suốt, khi đó Form sẽ đóng vai trò là nền cho ListBox.
5. PullDownOptions: Đây là một thuộc tính phức tạp, được sử dụng để cấu hình hoạt ảnh hiển thị ở đầu ListBox khi người dùng kéo xuống.
   • Fill: Màu tô cho hoạt ảnh kéo xuống.
   • Indicator: Biểu tượng chỉ báo cho hoạt ảnh.
   • IndicatorVisible: Cho phép hiển thị biểu tượng chỉ báo hay không.
   • Text: Văn bản hiển thị trong hoạt ảnh.
   • TextVisible: Cho phép hiển thị văn bản hay không.
6. PushUpOptions: Tương tự như PullDownOptions, thuộc tính này cấu hình hoạt ảnh hiển thị ở cuối ListBox khi người dùng kéo lên.

Hai sự kiện được bổ sung:

1. OnPullDownRefreshing: Sự kiện này được kích hoạt khi người dùng kéo ListBox xuống. Khi người dùng kéo xuống sau khi đã thấy dòng đầu tiên, hoạt ảnh sẽ hiển thị và sự kiện này sẽ được gọi. Tại đây, bạn có thể tải thêm dữ liệu và sau khi tải xong, tắt hiển thị hoạt ảnh. Tham khảo đoạn mã sau:

   procedure TMyForm.CCListBox1PullDownRefreshing(ASender: TObject);
   begin
     TTask.Run(
       procedure
       begin
         // Giả lập thời gian tải dữ liệu
         Sleep(500);
         TThread.Synchronize(nil,
           procedure
           begin
              // Logic tải dữ liệu vào CCListBox (đã được lược bỏ)
   
              // Tắt hoạt ảnh tải
              CCListBox1.IsPullDownRefreshing := False;
           end);
       end);
   end;

2. OnPushUpRefreshing: Sự kiện này được kích hoạt khi người dùng kéo ListBox lên. Khi người dùng kéo lên sau khi đã thấy dòng cuối cùng, hoạt ảnh sẽ hiển thị và sự kiện này sẽ được gọi. Nếu đã tải hết dữ liệu, bạn có thể tắt hoạt ảnh bằng cách chỉ hiển thị văn bản mà không hiển thị biểu tượng chỉ báo. Đoạn mã dưới đây minh họa cách thực hiện:

   procedure TMyForm.FinishLoadingAllData;
   begin
     with CCListBox1 do
     begin
       // Tắt hoạt ảnh tải
       IsPushUpRefreshing := False;
       // Vô hiệu hóa sự kiện kéo lên trong tương lai
       EnablePushUpRefresh := false;
       // Tắt hiển thị biểu tượng chỉ báo
       PushUpOptions.IndicatorVisible := false;
       // Hiển thị văn bản thông báo
       PushUpOptions.TextVisible := true;
     end;
   end;