School Grade Sheet WPF Datagrid Demo

A WPF desktop application demonstrating a comprehensive school grade sheet system using Syncfusion's SfDataGrid control. This application showcases advanced data grid features including filtering, grouping, sorting, and column management.

Overview

This application displays student grades across multiple subjects with comprehensive grade management features. It demonstrates best practices for building data-driven WPF applications with the MVVM (Model-View-ViewModel) pattern.

Features

Data Display

• 20 Student Records: Pre-populated sample data with student information and grades
• Multiple Subjects: Math, Science, History, English, and Art
• Comprehensive Scoring: Assignment, Quiz, Exam, and Project scores
• Calculated Final Grade: Automatic calculation of final grades (average of all scores)
• Comments: Teacher comments for each student record

DataGrid Controls (Top Toolbar)

Hide Columns

• Click "Hide Columns" to toggle visibility of specific columns
• Popup displays checkboxes for each column
• Use "Hide All" and "Show All" buttons for bulk operations
• First column (StudentID) is frozen for easy reference

Filter Columns

• Click "Filter" to filter data by specific criteria
• Select from filter conditions: Contains,Equals, Not Equals.
• Enter search text to filter records in real-time
• Clear filters with the "x" button to reset view

Group Columns

• Click "Group" to group data by selected column
• Choose any column from the dropdown to organize data hierarchically
• Clear grouping to return to flat list view
• AutoExpandGroups feature shows all group details by default

Sort Columns

• Click "Sort" to sort data by selected column
• Choose sort order: Ascending or Descending
• Toggle sort order button to quickly reverse direction
• Clear sort to return to default order

Data Model

Each grade record contains:

• ID: Student ID (1-20)
• StudentName: Full name of the student
• SubjectName: Subject being graded (Math, Science, History, English, Art)
• AssignmentScore: Assignment score (0-100)
• QuizScore: Quiz score (0-100)
• ExamScore: Exam score (0-100)
• ProjectScore: Project score (0-100)
• Grade: Calculated final grade (average of all four scores)
• Comments: Teacher feedback

Sample Data

The application comes with 20 pre-populated student records:

All 20 students are loaded with diverse score ranges and comments.

System Requirements

• .NET Runtime: .NET 8.0 or higher
• Operating System: Windows 10 or later
• Memory: Minimum 512 MB RAM
• Visual Studio: Visual Studio 2022 (for development)

Installation & Setup

Prerequisites

1. Install .NET 8.0 SDK or later
2. Install Visual Studio 2022 with WPF workload

Using Visual Studio

1. Open DataGridWPF.sln in Visual Studio 2022
2. Right-click the project in Solution Explorer and select "Set as Startup Project"
3. Press F5 or click Debug > Start Debugging
4. The application window will launch with sample data pre-loaded

Project Structure

+-- MainWindow.xaml          # Main application UI
+-- MainWindow.xaml.cs       # Code-behind for main window
+-- App.xaml                 # Application configuration
+-- App.xaml.cs              # Application code-behind
+-- DataGridWPF.csproj       # Project file
+-- Helper/
¦   +-- DataGridBehavior.cs  # Behavior for DataGrid events
¦   +-- GridColumnInfo.cs    # Column information model
¦   +-- RelayCommand.cs      # ICommand implementation
+-- Model/
¦   +-- Grade.cs             # Grade data model
+-- ViewModel/
    +-- GradeSheetViewModel.cs # MVVM ViewModel

Key Components

Grade.cs - Data model representing a student's grade record

• Implements INotifyPropertyChanged for data binding
• Provides CalculateFinalGrade() method for grade calculation

GradeSheetViewModel.cs - Handles UI logic and data manipulation

• Manages DataGrid state (visibility, filters, groups, sorts)
• Implements all command handlers
• Provides sample data population

DataGridBehavior.cs - Extends DataGrid functionality

• Handles unbound columns (StudentID combination, calculated Grade)
• Manages filter events and real-time filtering

GridColumnInfo.cs - Represents column metadata

• Tracks column visibility state
• Maps between column names and display names

Expected Behavior

On Application Launch

1. Window titled "School Gradesheet" opens (800x450 pixels)
2. Toolbar appears with 4 control buttons: Hide Columns, Filter, Group, Sort
3. DataGrid displays all 20 student records with 8 columns
4. First column (StudentID) is frozen, showing combined name and ID
5. Data is immediately interactive

User Interactions

Hiding Columns:

• Click "Hide Columns" ? popup appears with checkboxes
• Uncheck desired columns ? they disappear from grid
• Re-check columns ? they reappear

Filtering:

• Click "Filter" ? enter search text and select condition
• Grid updates in real-time to show matching records
• Click "x" to clear filter ? all records reappear

Grouping:

• Click "Group" ? select column from dropdown
• Grid organizes data hierarchically by selected column
• Click "x" to clear grouping ? returns to flat view

Sorting:

• Click "Sort" ? select column and sort direction
• Grid re-orders based on selection
• Toggle button to reverse sort order

Combined Operations:

• All features work together: hide columns while filtering, group while sorting, etc.
• No data is lost; all operations are reversible

Dependencies

The application uses the following NuGet packages:

Development Notes

MVVM Pattern

• Uses GradeSheetViewModel as the primary view model
• All commands are RelayCommand implementations
• Data binding through XAML and code-behind

Data Binding

• ItemsSource bound to Grades ObservableCollection
• Column visibility bound to GridColumns list
• Filter/Group/Sort bound to respective descriptions

Real-Time Updates

• INotifyPropertyChanged implementation ensures UI updates
• Filter events trigger grid refresh automatically
• Unbound columns calculated on-demand for Grade and StudentID

Troubleshooting

Application Won't Start

• Verify .NET 8.0 is installed: dotnet --version
• Ensure all NuGet packages are restored: dotnet restore

DataGrid Shows No Data

• Check that Syncfusion NuGet packages are properly installed
• Verify license key if using premium Syncfusion features
• Check Debug output for binding errors

Column Operations Not Working

• Ensure Microsoft.Xaml.Behaviors.Wpf is installed
• Verify DataGridBehavior is properly attached to the grid
• Check that ViewModel is set as DataContext

Support & Feedback

For issues or questions about Syncfusion controls, visit:

• Syncfusion Documentation
• Syncfusion Community Forums