diff --git a/index.js b/index.js index 69303b34..9d6ac8eb 100644 --- a/index.js +++ b/index.js @@ -2,6 +2,7 @@ * @format */ +import 'react-native-winrt'; import {AppRegistry} from 'react-native'; import App from './src/App'; import {name as appName} from './app.json'; diff --git a/package.json b/package.json index c9f989fb..376d26bb 100644 --- a/package.json +++ b/package.json @@ -45,6 +45,7 @@ "react-native-tts": "ak1394/react-native-tts", "react-native-webview": "^13.2.2", "react-native-windows": "0.73.10", + "react-native-winrt": "^0.72.1", "react-native-xaml": "^0.0.74" }, "devDependencies": { diff --git a/src/RNGalleryList.ts b/src/RNGalleryList.ts index 0975df2f..3e208eb5 100644 --- a/src/RNGalleryList.ts +++ b/src/RNGalleryList.ts @@ -36,6 +36,7 @@ import {TrackPlayerExamplePage} from './examples/TrackPlayerExamplePage'; import {WindowsHelloExamplePage} from './examples/WindowsHelloExamplePage'; import {ExpanderExamplePage} from './examples/ExpanderExamplePage'; import {VirtualizedListExamplePage} from './examples/VirtualizedListExamplePage'; +import {WinRTExamplePage} from './examples/WinRTExamplePage'; let RNGalleryCategories = [ 'Basic Input', @@ -266,6 +267,12 @@ export const RNGalleryList: Array = [ icon: '\uE8A4', type: 'Layout', }, + { + key: 'WinRT', + component: WinRTExamplePage, + icon: '\uEF15', + type: 'Layout', + }, { key: 'Xaml', component: XamlExamplePage, diff --git a/src/components/Notifications.tsx b/src/components/Notifications.tsx new file mode 100644 index 00000000..b6030e06 --- /dev/null +++ b/src/components/Notifications.tsx @@ -0,0 +1,55 @@ +const Notifications = Windows.UI.Notifications; +const ToastTemplateType = Notifications.ToastTemplateType; +const ToastNotificationManager = Notifications.ToastNotificationManager; +const ToastNotification = Notifications.ToastNotification; + +export function showNotification(notification) { + var type = ToastTemplateType.toastText01; + + var obj = {}; + if (typeof notification === 'string') { + obj.text = notification; + } else { + obj = notification; + } + + if (obj.template != undefined) { + type = obj.template; + } + + var xml = ToastNotificationManager.getTemplateContent(type); + for (var tagName in obj) { + var xmlElements = xml.getElementsByTagName(tagName); + var value = obj[tagName]; + if (typeof value === 'string') { + fillXmlElements(xml, xmlElements, [value]); + } else if (Array.isArray(value)) { + fillXmlElements(xml, xmlElements, value); + } else if (typeof value === 'object') { + fillXmlElements(xml, xmlElements, [value]); + } + } + + var toast = new ToastNotification(xml); + ToastNotificationManager.createToastNotifier().show(toast); +} + +function fillXmlElements(xml, xmlElements, arr) { + var i = 0; + for (var arrValue of arr) { + var node = xmlElements[i++]; + if (typeof arrValue === 'string') { + node.appendChild(xml.createTextNode(arrValue)); + } else if (typeof arrValue === 'object') { + for (var attrName in arrValue) { + var attr = node.attributes.getNamedItem(attrName); + if (!attr) { + attr = xml.createAttribute(attrName); + node.attributes.setNamedItem(attr); + } + + attr.nodeValue = arrValue[attrName]; + } + } + } +} diff --git a/src/examples/WinRTExamplePage.tsx b/src/examples/WinRTExamplePage.tsx new file mode 100644 index 00000000..7639e238 --- /dev/null +++ b/src/examples/WinRTExamplePage.tsx @@ -0,0 +1,121 @@ +'use strict'; +import React, {useState} from 'react'; +import {Example} from '../components/Example'; +import {Page} from '../components/Page'; +import { + Image, + SafeAreaView, + StyleSheet, + ScrollView, + View, + Text, + StatusBar, + Platform, + PlatformColor, + Pressable, + Linking, +} from 'react-native'; + +import {useTheme} from '@react-navigation/native'; + +import {showNotification} from '../components/Notifications'; + +export const WinRTExamplePage: React.FunctionComponent<{}> = () => { + const {colors} = useTheme(); + const example1jsx = ` + + { + showNotification({ + template: + Windows.UI.Notifications.ToastTemplateType + .toastImageAndText01, + // The template schema can be found at https://docs.microsoft.com/previous-versions/windows/apps/hh761494(v=win.10) + text: 'hello world', + image: { + src: 'https://microsoft.github.io/react-native-windows/img/header_logo.svg', + alt: 'React logo', + }, + }); + }}> + + Press Me + + + `; + + return ( + + + + { + showNotification({ + template: + Windows.UI.Notifications.ToastTemplateType + .toastImageAndText01, + // The template schema can be found at https://docs.microsoft.com/previous-versions/windows/apps/hh761494(v=win.10) + text: 'hello world', + image: { + src: 'https://microsoft.github.io/react-native-windows/img/header_logo.svg', + alt: 'React logo', + }, + }); + }}> + + Press Me + + + + + + ); +}; diff --git a/windows/ExperimentalFeatures.props b/windows/ExperimentalFeatures.props index b0384433..f24bee36 100644 --- a/windows/ExperimentalFeatures.props +++ b/windows/ExperimentalFeatures.props @@ -34,6 +34,18 @@ false true + + + -include Windows.Foundation + -include Windows.UI.StartScreen + -include Windows.UI.ViewManagement + -include Windows.Storage + -include Windows.Security.Cryptography.CryptographicBuffer + -include Windows.Security.Cryptography.ICryptographicBufferStatics + -include Windows.Security.Cryptography.BinaryStringEncoding + -include Windows.UI.Notifications + -include Windows.Data.Xml.Dom + diff --git a/windows/rngallery.sln b/windows/rngallery.sln index f027655b..7a46df0d 100644 --- a/windows/rngallery.sln +++ b/windows/rngallery.sln @@ -69,6 +69,8 @@ Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "ReactNativeXaml", "..\node_ EndProject Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "ReactNativeWindowsHello", "..\node_modules\react-native-windows-hello\windows\ReactNativeWindowsHello\ReactNativeWindowsHello.vcxproj", "{82BF2B2C-EDA5-47CA-A9F5-56BA622A15EA}" EndProject +Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "WinRTTurboModule", "..\node_modules\react-native-winrt\windows\WinRTTurboModule\WinRTTurboModule.vcxproj", "{E13C9C82-0013-422C-945E-848A258AC4DB}" +EndProject Global GlobalSection(SolutionConfigurationPlatforms) = preSolution Debug|ARM64 = Debug|ARM64 @@ -375,6 +377,18 @@ Global {82BF2B2C-EDA5-47CA-A9F5-56BA622A15EA}.Release|x64.Build.0 = Release|x64 {82BF2B2C-EDA5-47CA-A9F5-56BA622A15EA}.Release|x86.ActiveCfg = Release|Win32 {82BF2B2C-EDA5-47CA-A9F5-56BA622A15EA}.Release|x86.Build.0 = Release|Win32 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Debug|ARM64.ActiveCfg = Debug|ARM64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Debug|ARM64.Build.0 = Debug|ARM64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Debug|x64.ActiveCfg = Debug|x64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Debug|x64.Build.0 = Debug|x64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Debug|x86.ActiveCfg = Debug|Win32 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Debug|x86.Build.0 = Debug|Win32 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Release|ARM64.ActiveCfg = Release|ARM64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Release|ARM64.Build.0 = Release|ARM64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Release|x64.ActiveCfg = Release|x64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Release|x64.Build.0 = Release|x64 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Release|x86.ActiveCfg = Release|Win32 + {E13C9C82-0013-422C-945E-848A258AC4DB}.Release|x86.Build.0 = Release|Win32 EndGlobalSection GlobalSection(SolutionProperties) = preSolution HideSolutionNode = FALSE diff --git a/windows/rngallery/App.cpp b/windows/rngallery/App.cpp index bd795ca1..660c3a4b 100644 --- a/windows/rngallery/App.cpp +++ b/windows/rngallery/App.cpp @@ -26,7 +26,8 @@ App::App() noexcept InstanceSettings().UseFastRefresh(false); #else JavaScriptBundleFile(L"index"); - InstanceSettings().UseWebDebugger(true); + InstanceSettings().UseWebDebugger(false); + InstanceSettings().UseDirectDebugger(true); InstanceSettings().UseFastRefresh(true); #endif diff --git a/windows/rngallery/AutolinkedNativeModules.g.cpp b/windows/rngallery/AutolinkedNativeModules.g.cpp index 2450fe39..b9a9cf2d 100644 --- a/windows/rngallery/AutolinkedNativeModules.g.cpp +++ b/windows/rngallery/AutolinkedNativeModules.g.cpp @@ -51,6 +51,9 @@ // Includes from react-native-webview #include +// Includes from react-native-winrt +#include + // Includes from react-native-xaml #include @@ -94,6 +97,8 @@ void RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collecti packageProviders.Append(winrt::RNTTS::ReactPackageProvider()); // IReactPackageProviders from react-native-webview packageProviders.Append(winrt::ReactNativeWebView::ReactPackageProvider()); + // IReactPackageProviders from react-native-winrt + packageProviders.Append(winrt::WinRTTurboModule::ReactPackageProvider()); // IReactPackageProviders from react-native-xaml packageProviders.Append(winrt::ReactNativeXaml::ReactPackageProvider()); // IReactPackageProviders from react-native-windows-hello diff --git a/windows/rngallery/AutolinkedNativeModules.g.targets b/windows/rngallery/AutolinkedNativeModules.g.targets index 7f553e4e..145023f5 100644 --- a/windows/rngallery/AutolinkedNativeModules.g.targets +++ b/windows/rngallery/AutolinkedNativeModules.g.targets @@ -66,6 +66,10 @@ {00AA3765-C6A0-4713-B3F9-BFE47B9C83F5} + + + {E13C9C82-0013-422C-945E-848A258AC4DB} + {0ff7027a-222c-4ffb-8f17-91d18bbaf7a8} diff --git a/yarn.lock b/yarn.lock index 200dfabc..8599e8f7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3320,10 +3320,10 @@ resolved "https://registry.yarnpkg.com/@opentelemetry/semantic-conventions/-/semantic-conventions-1.22.0.tgz#d7502533a7c96e25baab86bac965468e0703a8b4" integrity sha512-CAOgFOKLybd02uj/GhCdEeeBjOS0yeoDeo/CA7ASBSmenpZHAKGB3iDm/rv3BQLcabb/OprDEsSQ1y0P8A7Siw== -"@react-native-clipboard/clipboard@^1.13.2": - version "1.13.2" - resolved "https://registry.yarnpkg.com/@react-native-clipboard/clipboard/-/clipboard-1.13.2.tgz#28adcfc43ed2addddf79a59198ec1b25087c115e" - integrity sha512-uVM55oEGc6a6ZmSATDeTcMm55A/C1km5X47g0xaoF0Zagv7N/8RGvLceA5L/izPwflIy78t7XQeJUcnGSib0nA== +"@react-native-clipboard/clipboard@^1.14.0": + version "1.14.0" + resolved "https://registry.yarnpkg.com/@react-native-clipboard/clipboard/-/clipboard-1.14.0.tgz#ae3b7b59f51b1da1fc6a362244c18ddec113d1f6" + integrity sha512-kDLfA6HzP4T+kfGTEGdbsc2r4q0xQALshRQp8Ph/5YD5qT4CZdgkQM3oloKHIdh+AVks+QjtVHK1cZ1xb0Or7w== "@react-native-community/checkbox@^0.5.16": version "0.5.16" @@ -9956,6 +9956,11 @@ react-native-windows@0.73.10: ws "^6.2.2" yargs "^17.6.2" +react-native-winrt@^0.72.1: + version "0.72.1" + resolved "https://registry.yarnpkg.com/react-native-winrt/-/react-native-winrt-0.72.1.tgz#d5b2bc0fe27080c03a85c33bd477b6da3e70f0f9" + integrity sha512-uhUAzKjOFpsfeoByBBA1FTgsCZuwLYN9y9C/Zg+StZRUYVBcqpOT46avwxHKkgWHN1ixoDc/jUFdE5lmV4DuoQ== + react-native-xaml@^0.0.74: version "0.0.74" resolved "https://registry.yarnpkg.com/react-native-xaml/-/react-native-xaml-0.0.74.tgz#fc747308320eb1fda6dd69f5317bfeae37686b57"