https://github.com/diyari-kurdi/shimmerui
Shimmer effect control for WPF to indicate loading state.
https://github.com/diyari-kurdi/shimmerui
csharp shimmer shimmer-effect ui ux windows-presentation-foundation wpf
Last synced: 10 months ago
JSON representation
Shimmer effect control for WPF to indicate loading state.
- Host: GitHub
- URL: https://github.com/diyari-kurdi/shimmerui
- Owner: Diyari-Kurdi
- License: mit
- Created: 2025-06-25T04:47:12.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-06-27T09:42:12.000Z (about 1 year ago)
- Last Synced: 2025-08-24T21:55:37.099Z (11 months ago)
- Topics: csharp, shimmer, shimmer-effect, ui, ux, windows-presentation-foundation, wpf
- Language: C#
- Homepage:
- Size: 31.3 KB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# Shimmer.Wpf
**Shimmer.Wpf** is a customizable WPF control that displays a shimmer loading effect to enhance the user experience during data loading.
 
## ✨ Features
- ⚡ **Fast & Lightweight** – Optimized for smooth WPF performance.
- 🎨 **Fully Customizable** – Shimmer color, speed, width, opacity, duration, and corner radius.
- 🔄 **MVVM-Friendly** – `IsShimmering` is a bindable dependency property.
- 🚀 **Auto-Start Support** – Automatically starts shimmer on load if enabled.
- 🖥️ **Design-Time Support** – Preview shimmer directly in XAML designer.
- 🧩 **Group Control** – Manage grouped shimmer controls via `StartGroup`, `StopGroup`, and `ToggleGroup`.
- 🌐 **Global Control** – Control all shimmer instances using static methods: `StartAll`, `StopAll`, `ToggleAll`.
- 📡 **Event Hooks** – React to shimmer lifecycle events at instance, group, or global level.
## 📦 Installation
```sh
Install-Package Shimmer.Wpf
```
or with .NET CLI:
```sh
dotnet add package Shimmer.Wpf
```
### 🚀 Example Usage
#### ✅ **1. Content with its own CornerRadius**
```xml
```
> ✅ The control detects `CornerRadius` from the content if present.
---
#### ✅ **2. ShimmerControl with CornerRadius**
```xml
```
> ✅ Use this when your content (e.g., `TextBlock`) doesn’t support `CornerRadius`.
---
#### ✅ **3. Compact placeholder bars (often for skeleton loaders)**
```xml
```
---
## 🧩 Usage
### XAML Binding
Bind the shimmer state to your view model:
```xml
```
### Automatic Start
Use `AutoStart` to shimmer immediately when the control loads:
```xml
```
### Controlling Shimmer Programmatically
You can control shimmer effects globally, by group, or individually using static methods:
- **StartAll()** — Starts shimmer on all existing `ShimmerControl` instances.
```csharp
ShimmerControl.StartAll();
```
- **StopAll()** — Stops shimmer on all instances.
```csharp
ShimmerControl.StopAll();
```
- **ToggleAll()** — Toggles shimmer state on all instances.
```csharp
ShimmerControl.ToggleAll();
```
- **StartGroup(string groupName)** — Starts shimmer on all controls in the specified group.
```csharp
ShimmerControl.StartGroup("LoadingCards");
```
- **StopGroup(string groupName)** — Stops shimmer on all controls in the specified group.
```csharp
ShimmerControl.StopGroup("LoadingCards");
```
- **ToggleGroup(string groupName)** — Toggles shimmer on all controls in the specified group.
```csharp
ShimmerControl.ToggleGroup("LoadingCards");
```
### Individual Control Methods
You can also start, stop or toggle shimmer on individual controls:
```csharp
myShimmerControl.StartShimmering();
myShimmerControl.StopShimmering();
myShimmerControl.ToggleShimmering();
```
### Events
Subscribe to static events to react to shimmer changes globally or per group:
```csharp
ShimmerControl.ShimmeringGroupStarted += (s, e) => {
string group = e.GroupName;
int count = e.Count;
// handle group started
};
ShimmerControl.ShimmeringGroupStopped += (s, e) => {
string group = e.GroupName;
int count = e.Count;
// handle group stopped
};
ShimmerControl.ShimmeringGroupToggled += (s, e) => {
string group = e.GroupName;
int count = e.Count;
// handle group toggled
};
ShimmerControl.AllShimmeringStarted += (s, e) => {
int count = e.Count;
// handle all shimmer started
};
ShimmerControl.AllShimmeringStopped += (s, e) => {
int count = e.Count;
// handle all shimmer stopped
};
ShimmerControl.AllShimmeringToggled += (s, e) => {
int count = e.Count;
// handle all shimmer toggled
};
```
## 🎥 Preview
The recording is from the included `WPF_Demo` project, showcasing various usages of the control.
https://github.com/user-attachments/assets/a18bda0a-75df-4751-952e-8366c51554a4
## 🛠 Properties
| Property | Description |
|--------------------------|----------------------------------------------|
| `IsShimmering` | Starts or stops the shimmer animation |
| `AutoStart` | Starts shimmering automatically on load |
| `ShimmerColor` | Highlight color of the shimmer |
| `ShimmerWidth` | Width of the shimmer band |
| `ShimmerOpacity` | Opacity of the shimmer effect |
| `ShimmerDuration` | Total animation cycle duration |
| `CornerRadius` | Rounding of shimmer border |
| `ShimmerGroup` | Optional group identifier for group control |
| `ShimmerEasingFunction` | Easing function for animation |
| `DesignModeShimmering` | Enables shimmer effect in design view |
## 📄 License
This project is licensed under the [MIT License](https://github.com/Diyari-Kurdi/ShimmerUI/blob/master/LICENSE.txt).
© 2025 Diyari Ismael