Riot Slider
이 레포지터리(RiotSlider)는 리그 오브 레전드 게임에서 영감을 받은 슬라이더 컨트롤로, WPF와 OpenSilver 환경에 맞게 구현되었습니다. 이 프로젝트는 WPF와 OpenSilver에서 동일한 XAML을 사용하면서 각 환경에 맞는 구현 방법을 제시합니다. 이를 통해 두 기술 스택에서 컨트롤 구현 기술의 유사점과 차이점을 Slider라는 비교적 가벼운 범위를 두고 이해할 수 있는 기회를 제공하는 것이 목적입니다. 그리고 이 프로젝트의 향후 로드맵으로는, OpenSilver 뿐만 아니라 Avalonia-UI, Uno Platform 크로스 플랫폼도 추가할 계획이며 튜토리얼 영상으로도 만들 예정입니다. 그렇게 된다면 아마도 소스코드를 파격적으로 리펙토링할 것입니다. 
새로은 플랫폼이 추가되면 Slog에 내용을 추가하도록 하겠습니다. 아래 레포지터리를 통해 연구에 도움이되길 기대합니다.
RiotSlider
Implementing a Slider Control as a CustomControl in WPF and OpenSilver
WPF (Windows Presentation Foundation) was the first platform to introduce XAML (eXtensible Application Markup Language). It is recognized as one of the most powerful methods for application development on the Windows operating system to this day and has significantly contributed to the evolution of XAML-based platforms.
WPF provides a rich user interface and advanced graphics capabilities, with XAML enabling an effective separation of user interface and logic. Similarly, the Silverlight platform shares a development approach with WPF, but primarily focuses on web-based applications.
Recently, OpenSilver has evolved to version 2.0, further stabilizing and offering a near-identical implementation to WPF and Silverlight, while enabling website development based on WebAssembly. This opens new possibilities for applying WPF and Silverlight development techniques in web environments.
Cross-platform development tools like Avalonia UI and Uno Platform are also continuously evolving. These platforms enable robust application development across various environments, offering developers a wide range of choices.
All these developments are examples of how XAML-based platforms have evolved and expanded over time, supporting developers in creating effective and efficient applications in diverse environments.
Introduction
League of Legends Style Slider: Implemented in WPF and OpenSilver with the Same XAML, Different Approaches
RiotSlider is a slider control inspired by the League of Legends game, adapted for the WPF and OpenSilver environments. This project uses the same XAML in both WPF and OpenSilver while adopting unique implementation methods suitable for each environment. It provides an opportunity to explore and understand the similarities and differences in control implementation techniques across these two technology stacks.
Features
Custom Implementation of Slider Inheritance in WPF and OpenSilver
- Support for WPF and OpenSilver: Provides the RiotSlider control usable in both WPF and OpenSilver environments.
- Custom Control Approach: Extends the basic Slider functionality to implement a user interface and interactions styled after League of Legends.
- Consistent Experience, Diverse Technologies: Offers a consistent user experience in both environments while highlighting their technical differences.
Installation and Usage
What to Know Before Getting Started
Requirements
- .NET Version:
- WPF version requires .NET 8.0 or higher.
- OpenSilver version requires .NET 7.0 or higher.
- Development Environment: Visual Studio 2022
Starting Projects
- Starting project for WPF version:
WpfRiotSlider - Starting project for OpenSilver version:
OpenSilverRiotSlider.Browser - OpenSilver Simulator Project:
OpenSilverRiotSlider.Simulator
Unlike the OpenSilverRiotSlider.Browser project, which runs as a WebAssembly-converted application, the Simulator runs the application in a structure similar to its original XAML form. This allows for debugging in an environment akin to WPF. It serves as a simulator enabling easier debugging and testing of the OpenSilver application, greatly aiding developers in their workflow.
Project Structure
The repository is organized as follows:
- WPF (Solution Folder): The RiotSlider project based on WPF.
- OpenSilver (Solution Folder): The RiotSlider project based on OpenSilver.
Each solution folder contains project files and source code suitable for the respective environment.
Screenshots
Showcasing the RiotSlider in Action on Each Platform
The images below illustrate the RiotSlider, inherited from the Slider control, as it appears when executed on each respective platform. These visuals demonstrate the implementation and appearance of the RiotSlider in both the WPF and OpenSilver environments, highlighting the successful adaptation of the control across different technologies.
Roadmap
Future Plans and Expansions
Alongside our ongoing efforts with WPF and OpenSilver versions, we are excited to announce plans to extend the RiotSlider to additional platforms. Our roadmap includes:
- Avalonia UI Implementation: We are looking forward to adapting RiotSlider for Avalonia UI, a cross-platform framework that will enable RiotSlider to function seamlessly across different operating systems.
- Uno Platform Version: Plans are also in place to develop a version for the Uno Platform, which will allow RiotSlider to be utilized in a wide range of environments, including mobile and web applications.
These expansions will ensure that RiotSlider remains versatile and accessible across various development platforms, making it an even more valuable tool for developers worldwide.
License
Embracing Openness and Collaboration with the MIT License
This project is open-sourced under the MIT License. This means anyone can freely use, copy, modify, merge, publish, distribute, grant sublicenses, and/or sell the software, and it requires that users comply with these terms when receiving the software.
For more details, refer to the LICENSE file.