ZIP Viewer

Displays the contents of a ZIP file.

Remarks

The ZIP Viewer control provides an interactive interface for browsing and viewing the contents of ZIP archive files within the Grooper UI. It presents a hierarchical tree of folders and files, allowing users to explore the archive and view individual files using the integrated document viewer.

Overview

• Presents ZIP file contents in a navigable tree structure, showing folders and files with appropriate icons.
• Displays file count and filename in the title bar for quick reference.
• Allows users to select files or folders to view their contents.
• Integrates the Document Viewer for previewing supported file types directly within the UI.
• Shows file size information for each file in the archive.

Interactive Components

• Title Bar:
  • Displays the ZIP file name and total file count.
• File Tree (HtmlTree):
  • Hierarchical tree view of folders and files in the ZIP archive.
  • Expandable folders and selectable files.
  • Shows file and folder icons, file names, and file sizes.
  • Keyboard navigation and selection support.
• Splitter:
  • Allows resizing between the file tree and document viewer panels.
• Document Viewer:
  • Previews the selected file from the ZIP archive.
  • Supports various file types (images, text, PDF, etc.) depending on the file extension.

Usage Guidance

Use the ZIP Viewer to explore the contents of ZIP archives in Grooper.

• Expand folders to reveal nested files and subfolders.
• Select a file to preview its contents in the document viewer panel.
• Use the splitter to adjust the layout between the file tree and viewer.
• File size is displayed as a tooltip for each file node.
• The control supports keyboard navigation for accessibility.

Example

┌─────────────────────────────────────────────────────────────────────────────┐
│ ZIP File (12 files)                sample.zip                               │
├─────────────────────────────────────────────────────────────────────────────┤
│ ┌─────────────┬───────────────────────────────────────────────────────────┐ │
│ │ {HtmlTree}  │                                                           │ │
│ │             │                                                           │ │
│ │ {Folder}    │                   {Document Viewer}                       │ │
│ │   └─{File}  │                                                           │ │
│ └─────────────┴───────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘

The layout includes a title bar with file count and name, a split panel with a hierarchical file tree on the left, and a document viewer on the right. Major UI elements are labeled in curly braces.

Child Controls

Name	Type		Summary
Viewer	Document Viewer	►	Displays the currently selected file. The Document Viewer control is integrated into the ZIP Viewer to preview files selected from the archive. It automatically chooses the best viewer for each file type, supporting images, text, PDF, and more. Usage Guidance Select a file in the ZIP tree to view its contents in the Document Viewer panel.

Used By

Document Viewer