From ea17798c06ef4b8243c0a1c76d8b1a9ac059b0f3 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Thu, 28 Oct 2021 22:14:29 -0700 Subject: [PATCH] feat: Allow using WinUI 3 Controls (#342) --- README.md | 2 +- .../ReactNativePicker.vcxproj | 1 + windows/ReactNativePicker/ReactPickerView.cpp | 29 ++++++++++++------- windows/ReactNativePicker/ReactPickerView.h | 10 +++---- windows/ReactNativePicker/ReactPickerView.idl | 4 ++- .../ReactPickerViewManager.cpp | 2 +- .../ReactPickerViewManager.h | 4 +-- 7 files changed, 31 insertions(+), 21 deletions(-) diff --git a/README.md b/README.md index a5ba75cfcb..f4b36e03ef 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ | @react-native-picker/picker | react-native | react-native-windows | | --- | --- | --- | -| master | 0.61+ | 0.64+ | +| >= 2.0.0 | 0.61+ | 0.64+ | | >= 1.16.0 | 0.61+ | 0.61+ | | >= 1.2.0 | 0.60+ or 0.59+ with [Jetifier](https://www.npmjs.com/package/jetifier) | N/A | | >= 1.0.0 | 0.57 | N/A | diff --git a/windows/ReactNativePicker/ReactNativePicker.vcxproj b/windows/ReactNativePicker/ReactNativePicker.vcxproj index 894ddaffe5..51a9d66c26 100644 --- a/windows/ReactNativePicker/ReactNativePicker.vcxproj +++ b/windows/ReactNativePicker/ReactNativePicker.vcxproj @@ -1,5 +1,6 @@ + true diff --git a/windows/ReactNativePicker/ReactPickerView.cpp b/windows/ReactNativePicker/ReactPickerView.cpp index ca1531ecb3..4b7c0f33c3 100644 --- a/windows/ReactNativePicker/ReactPickerView.cpp +++ b/windows/ReactNativePicker/ReactPickerView.cpp @@ -7,23 +7,26 @@ #include "ReactPickerView.g.cpp" #include -#include +#include namespace winrt { using namespace Microsoft::ReactNative; using namespace Windows::Foundation; using namespace Windows::Foundation::Metadata; - using namespace Windows::UI; - using namespace Windows::UI::Xaml; - using namespace Windows::UI::Xaml::Controls; - using namespace Windows::UI::Xaml::Input; - using namespace Windows::UI::Xaml::Media; + using namespace xaml; + using namespace xaml::Controls; + using namespace xaml::Input; + using namespace xaml::Media; } // namespace winrt namespace winrt::ReactNativePicker::implementation { +#ifdef USE_WINUI3 + const bool ReactPickerView::s_isEditableComboboxSupported = true; +#else const bool ReactPickerView::s_isEditableComboboxSupported = winrt::ApiInformation::IsPropertyPresent( - L"Windows.UI.Xaml.Controls.ComboBox", L"IsEditableProperty"); + L"Windows.UI.Xaml.Controls.ComboBox", L"IsEditableProperty"); +#endif ReactPickerView::ReactPickerView(winrt::IReactContext const& reactContext) : m_reactContext(reactContext) { this->AllowFocusOnInteraction(true); @@ -64,9 +67,13 @@ namespace winrt::ReactNativePicker::implementation { this->ClearValue(winrt::ComboBox::IsEditableProperty()); } else { - if (auto iComboBox6 = this->try_as()) { - iComboBox6.IsEditable(propertyValue.AsBoolean()); - } +#ifdef USE_WINUI3 + this->IsEditable(propertyValue.AsBoolean()); +#else + if (auto iComboBox6 = this->try_as()) { + iComboBox6.IsEditable(propertyValue.AsBoolean()); + } +#endif } } } @@ -191,7 +198,7 @@ namespace winrt::ReactNativePicker::implementation { } } - void ReactPickerView::UpdateComboBoxItemForegroundResource(winrt::FrameworkElement const& item, winrt::Windows::UI::Xaml::Media::Brush const& color) { + void ReactPickerView::UpdateComboBoxItemForegroundResource(winrt::FrameworkElement const& item, xaml::Media::Brush const& color) { if (auto comboBoxItem = item.try_as()) { comboBoxItem.Foreground(color); } diff --git a/windows/ReactNativePicker/ReactPickerView.h b/windows/ReactNativePicker/ReactPickerView.h index 327763ec20..c39e9a543f 100644 --- a/windows/ReactNativePicker/ReactPickerView.h +++ b/windows/ReactNativePicker/ReactPickerView.h @@ -22,15 +22,15 @@ namespace winrt::ReactNativePicker::implementation { // FUTURE: remove when we can require RS5+ int32_t m_selectedIndex{ 0 }; std::vector m_itemValues; - winrt::Windows::UI::Xaml::Media::Brush m_comboBoxColor{ nullptr }; - winrt::Windows::UI::Xaml::Controls::ComboBox::SelectionChanged_revoker m_selectionChangedRevoker{}; - winrt::Windows::UI::Xaml::Controls::ComboBox::DropDownClosed_revoker m_dropDownClosedRevoker{}; + xaml::Media::Brush m_comboBoxColor{ nullptr }; + xaml::Controls::ComboBox::SelectionChanged_revoker m_selectionChangedRevoker{}; + xaml::Controls::ComboBox::DropDownClosed_revoker m_dropDownClosedRevoker{}; void RegisterEvents(); void RepopulateItems(winrt::Microsoft::ReactNative::JSValueArray const& items); void SetSelectedIndex(int index); - void OnSelectionChanged(winrt::Windows::Foundation::IInspectable const& sender, winrt::Windows::UI::Xaml::Controls::SelectionChangedEventArgs const& args); - void UpdateComboBoxItemForegroundResource(winrt::Windows::UI::Xaml::FrameworkElement const& item, winrt::Windows::UI::Xaml::Media::Brush const& color); + void OnSelectionChanged(winrt::Windows::Foundation::IInspectable const& sender, xaml::Controls::SelectionChangedEventArgs const& args); + void UpdateComboBoxItemForegroundResource(xaml::FrameworkElement const& item, xaml::Media::Brush const& color); }; } // namespace winrt::ReactNativePicker::implementation diff --git a/windows/ReactNativePicker/ReactPickerView.idl b/windows/ReactNativePicker/ReactPickerView.idl index 39f1a0697a..9a5063e3c6 100644 --- a/windows/ReactNativePicker/ReactPickerView.idl +++ b/windows/ReactNativePicker/ReactPickerView.idl @@ -1,7 +1,9 @@ +#include + namespace ReactNativePicker{ [default_interface] - runtimeclass ReactPickerView : Windows.UI.Xaml.Controls.ComboBox { + runtimeclass ReactPickerView : XAML_NAMESPACE.Controls.ComboBox { ReactPickerView(Microsoft.ReactNative.IReactContext context); void UpdateProperties(Microsoft.ReactNative.IJSValueReader reader); }; diff --git a/windows/ReactNativePicker/ReactPickerViewManager.cpp b/windows/ReactNativePicker/ReactPickerViewManager.cpp index 173f0e8bac..eaefe6ff75 100644 --- a/windows/ReactNativePicker/ReactPickerViewManager.cpp +++ b/windows/ReactNativePicker/ReactPickerViewManager.cpp @@ -9,7 +9,7 @@ namespace winrt { using namespace Microsoft::ReactNative; using namespace Windows::Foundation::Collections; - using namespace Windows::UI::Xaml; + using namespace xaml; } namespace winrt::ReactNativePicker::implementation { diff --git a/windows/ReactNativePicker/ReactPickerViewManager.h b/windows/ReactNativePicker/ReactPickerViewManager.h index 55e1f9ef24..41ee279a18 100644 --- a/windows/ReactNativePicker/ReactPickerViewManager.h +++ b/windows/ReactNativePicker/ReactPickerViewManager.h @@ -18,7 +18,7 @@ namespace winrt::ReactNativePicker::implementation { // IViewManager winrt::hstring Name() noexcept; - winrt::Windows::UI::Xaml::FrameworkElement CreateView() noexcept; + xaml::FrameworkElement CreateView() noexcept; // IViewManagerWithReactContext winrt::Microsoft::ReactNative::IReactContext ReactContext() noexcept; @@ -30,7 +30,7 @@ namespace winrt::ReactNativePicker::implementation { NativeProps() noexcept; void UpdateProperties( - winrt::Windows::UI::Xaml::FrameworkElement const& view, + xaml::FrameworkElement const& view, winrt::Microsoft::ReactNative::IJSValueReader const& propertyMapReader) noexcept; // IViewManagerWithExportedEventTypeConstants