A cross-platform implementation of the League of Legends-inspired slider using OpenSilver
OpenSilver RiotSlider is a cross-platform implementation of a custom slider control inspired by League of Legends, built using OpenSilver. This project demonstrates how WPF developers can leverage their existing XAML and C# skills to create web applications using WebAssembly technology.


- Utilization of OpenSilver for WebAssembly-based web applications
- Seamless transition for WPF developers to web development
- Consistent XAML-based development experience
- Implementation of RiotSlider as a CustomControl
- Use of ControlTemplate for flexible and customizable design
- Demonstration of advanced XAML techniques in a web context
- Leveraging WPF design patterns in web development
- Showcasing the power of MVVM in OpenSilver
- Utilizing DependencyProperties for robust property system
- Efficient rendering tailored for web environments
- Optimized for WebAssembly execution
- Use of OpenSilver Simulator for easier debugging and testing
- Seamless integration with existing .NET development tools
- OpenSilver 2.0+
- .NET 7.0+
- C# 10.0
- XAML
- Visual Studio 2022 or later
- .NET 7.0 SDK or later
- OpenSilver extension for Visual Studio



git clone https://github.com/jamesnet214/riotslider-opensilver.git
- Visual Studio
- Set OpenSilverRiotSlider.Browser as the startup project
- Build and run the project
- For debugging, use OpenSilverRiotSlider.Simulator
This project offers valuable insights for WPF developers transitioning to web development:
- XAML in Web Development: Learn how to use familiar XAML in a web context
- CustomControl in OpenSilver: Understand the nuances of creating custom controls for web
- WebAssembly Integration: Explore how .NET applications can run in browsers via WebAssembly
- Cross-Platform UI Design: Master techniques for creating consistent UIs across platforms
- Performance Optimization: Learn to optimize XAML-based controls for web environments
Contributions to OpenSilver RiotSlider are welcome! Feel free to submit issues, create pull requests, or suggest improvements.
This project is licensed under the MIT License - see the LICENSE file for details.
- Website: https://jamesnet.dev
- Email: [email protected], [email protected]
Explore the possibilities of cross-platform development with OpenSilver RiotSlider!