microsoft / react-native-windows-samples

A repository showcasing React Native samples and templates for Windows, macOS, and Surface Duo.
https://microsoft.github.io/react-native-windows/
MIT License
481 stars 198 forks source link

Port photo-lab from UWP to RNW #228

Open stmoy opened 4 years ago

stmoy commented 4 years ago

Proposal: Port photo-lab from UWP to RNW

Summary

https://github.com/microsoft/Windows-appsample-photo-lab

asdf

Photo-lab is a mini-app for viewing and editing image files. The UWP version demonstrates XAML layout, data binding, and UI customization features.

Updating this to RNW would provide a sample that helps provide a comparison between various techs.

Motivation

Porting this sample to React Native has several benefits:

TatianaKapos commented 2 years ago

I was thinking of doing this example for EIM but after researching this, it seemed out-of-scope with the time I had. Thought I would add my research in case someone comes back to this!

Purpose: This is an app for viewing a editing image files. It also seemed to serve as a tutorial for creating XAML applications but the links for the tutorial are currently broken. Seems abandoned as last commit was 2020.

Core Components in XAML: • XAML layout, styling, and UI customization • XAML data binding with x:Bind • Image effects from Windows.UI.Composition • WinUI with ReorderGridAnimation - Windows Community Toolkit | Microsoft Docs • Loading Images from picture library using data virtualization

Issues with converting into RNW (through a very basic search of repo): • I couldn’t' find any references of ReorderGridAnimation or ItemsReorderAnimation • There's not a lot of information on altering images (ie exposure, saturation, ect.) for RNW, may need to use react-native-xaml