Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/microsoft/react-native-xaml
A React Native Windows library to use XAML / WinUI controls
https://github.com/microsoft/react-native-xaml
codegen cppwinrt metadata react-native react-native-windows uwp uwp-app windows windows-sdk winrt winui winui3 xaml xaml-ui
Last synced: 3 days ago
JSON representation
A React Native Windows library to use XAML / WinUI controls
- Host: GitHub
- URL: https://github.com/microsoft/react-native-xaml
- Owner: microsoft
- License: mit
- Created: 2021-01-31T06:37:47.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2024-11-21T23:04:15.000Z (2 months ago)
- Last Synced: 2025-01-14T11:14:13.897Z (10 days ago)
- Topics: codegen, cppwinrt, metadata, react-native, react-native-windows, uwp, uwp-app, windows, windows-sdk, winrt, winui, winui3, xaml, xaml-ui
- Language: C++
- Homepage:
- Size: 3.19 MB
- Stars: 101
- Watchers: 16
- Forks: 28
- Open Issues: 30
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
- Security: SECURITY.md
Awesome Lists containing this project
README
[![CI](https://github.com/microsoft/react-native-xaml/actions/workflows/main.yml/badge.svg)](https://github.com/microsoft/react-native-xaml/actions/workflows/main.yml)
# react-native-xaml
A React Native Windows view manager that allows directly using the [Windows XAML](https://docs.microsoft.com/windows/uwp/xaml-platform/xaml-overview) framework.## Cheat sheet
To see examples of the syntax and available controls, check out the [Usage guide](https://github.com/microsoft/react-native-xaml/tree/main/USAGE.md).## Main advantages
- Allows developers writing [react-native-windows](https://microsoft.github.io/react-native-windows/) apps (React Native apps targeting Windows 10) to quickly get started, if they are familiar with XAML.
- Developers are not limited by the set of controls present today in RNW and community modules that support Windows.
- Best of all, this solution is available *today*!
- The set of types/properties/events are the XAML ones, however JS libraries can wrap those to expose the Windows control in a platform-agnostic way (e.g. as a way to implement a cross-plat control for Windows).react-native-xaml works by leveraging metadata for XAML properties, types and events. This metadata is automatically generated ([code-gen](https://github.com/microsoft/react-native-xaml/tree/main/package/Codegen)) from the Windows SDK.
This means we can have a full projection of all of XAML – or any WinRT components written by app devs, that export a [UserControl](https://docs.microsoft.com/uwp/api/Windows.UI.Xaml.Controls.UserControl) – without manual intervention.## Technical details
See [Technical Guide](TechnicalGuide.md).## Contributing
Pull Requests are welcome. See [Contribution Guide](CONTRIBUTING.md) for details.## Demo
![react-native-xaml demo](https://raw.githubusercontent.com/microsoft/react-native-xaml/main/example/rnx.gif)