Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add fluent-ui-react-native controls and update various visual styles #116

Merged
merged 15 commits into from
Mar 14, 2024

Conversation

chrisglein
Copy link
Owner

@chrisglein chrisglein commented Apr 3, 2023

Fixes #101
Fixes #115
Fixes #84
Fixes #58
Fixes #93

Related to #114
But pushed further by defining a custom Theme for Windows.

Workarounds needed:

@chrisglein
Copy link
Owner Author

chrisglein commented Apr 4, 2023

I'm occasionally seeing an app crash here when interacting with the checkbox.

Repro:

  1. Show settings menu (which has 2 Checkbox controls, each of which are going to use SVG to show their checkmark)
  2. Close settings menu (UI will be tossed out, should cause SVGs to be unloaded)
  3. Show settings menu (Checkbox controls come back... note checkmark doesn't render)
  4. Click Checkbox, crash

Exception thrown at 0x00007FFC7E21B351 (RNSVG.dll) in artificialChat.exe: 0xC0000005: Access violation reading location 0x0000000000000000.

>	RNSVG.dll!winrt::impl::consume_Microsoft_Graphics_Canvas_UI_Xaml_ICanvasControl<winrt::Microsoft::Graphics::Canvas::UI::Xaml::ICanvasControl>::Invalidate() Line 292	C++
 	RNSVG.dll!winrt::RNSVG::implementation::SvgView::InvalidateCanvas() Line 203	C++
 	RNSVG.dll!winrt::RNSVG::implementation::SvgView::UpdateProperties(const winrt::Microsoft::ReactNative::IJSValueReader & reader, bool forceUpdate, bool invalidate) Line 91	C++
 	RNSVG.dll!winrt::RNSVG::implementation::SvgViewManager::UpdateProperties(const winrt::Windows::UI::Xaml::FrameworkElement & view, const winrt::Microsoft::ReactNative::IJSValueReader & propertyMapReader) Line 69	C++
 	RNSVG.dll!winrt::impl::produce<winrt::RNSVG::implementation::SvgViewManager,winrt::Microsoft::ReactNative::IViewManagerWithNativeProperties>::UpdateProperties(void * view, void * propertyMapReader) Line 5960	C++
 	Microsoft.ReactNative.dll!winrt::impl::consume_Microsoft_ReactNative_IViewManagerWithNativeProperties<winrt::Microsoft::ReactNative::IViewManagerWithNativeProperties>::UpdateProperties(const winrt::Windows::UI::Xaml::FrameworkElement & view, const winrt::Microsoft::ReactNative::IJSValueReader & propertyMapReader) Line 2182	C++
 	Microsoft.ReactNative.dll!winrt::Microsoft::ReactNative::ABIViewManager::UpdateProperties(Microsoft::ReactNative::ShadowNodeBase * nodeToUpdate, winrt::Microsoft::ReactNative::JSValueObject & props) Line 128	C++
 	Microsoft.ReactNative.dll!Microsoft::ReactNative::ShadowNodeBase::updateProperties(winrt::Microsoft::ReactNative::JSValueObject & props) Line 32	C++
 	Microsoft.ReactNative.dll!Microsoft::ReactNative::UIManagerModule::updateView(__int64 reactTag, std::string viewName, winrt::Microsoft::ReactNative::JSValueObject && props) Line 167	C++
 	Microsoft.ReactNative.dll!Microsoft::ReactNative::UIManager::updateView::__l2::<lambda_1>::operator()() Line 590	C++

m_canvas is null:

void SvgView::InvalidateCanvas() {
  if (m_hasRendered) {
    m_canvas.Invalidate();
  }
}

From the calling function (SvgView::UpdateProperties):

◢ | propertyMap | { size=2 } | const winrt::Microsoft::ReactNative::JSValueObject &
  | ▶ [comparator] | less<> | std::_Compressed_pair<std::less<void>,std::_Compressed_pair<std::allocator<std::_Tree_node<std::pair<std::string const ,winrt::Microsoft::ReactNative::JSValue>,void *>>,std::_Tree_val<std::_Tree_simple_types<std::pair<std::string const ,winrt::Microsoft::ReactNative::JSValue>>>,1>,1>
  | ▶ [allocator] | allocator | std::_Compressed_pair<std::allocator<std::_Tree_node<std::pair<std::string const ,winrt::Microsoft::ReactNative::JSValue>,void *>>,std::_Tree_val<std::_Tree_simple_types<std::pair<std::string const ,winrt::Microsoft::ReactNative::JSValue>>>,1>
  | ▶ ["color"] | {m_type=Null (0) m_object={ size=14829735431805717965 } m_array={ size=0 } ...} | std::pair<std::string const ,winrt::Microsoft::ReactNative::JSValue>
  | ▶ ["opacity"] | {m_type=Int64 (5) m_object={ size=14829735431805717965 } m_array={ size=0 } ...} | std::pair<std::string const ,winrt::Microsoft::ReactNative::JSValue>
  | ▶ [Raw View] | {...} | const winrt::Microsoft::ReactNative::JSValueObject

It's null, because previously SvgView::Unload was hit. But afterwards we're still called in via UpdateProperties.

@chrisglein
Copy link
Owner Author

SVG crashing issues seem to have been addressed with recent patches to SVG. So this is all working and rendering:
image

Am seeing issue with SVG glyphs disappearing when popup is hidden and reshown. Better than a crash, but still not quite right:

CheckBoxGlyphDisappears.mp4

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
1 participant