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

Update cpp-app template to use ReactNativeAppBuilder #13875

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

sharath2727
Copy link
Contributor

@sharath2727 sharath2727 commented Sep 18, 2024

Description

Why

Simplify the default template code for creating the fabric app

Resolves #12991

What

Updated the cpp-app template to use ReactNativeAppBuilder

Changelog

Should this change be included in the release notes: yes

Microsoft Reviewers: Open in CodeFlow

winrt::Microsoft::ReactNative::ReactInstanceSettingsBuilder()
.DebugBundlePath(L"index")
.JavaScriptBundleFile(L"index.windows")
.BundleRootPath(appDirectory)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this needs to maintain the file:// prefix from before

Copy link
Contributor Author

@sharath2727 sharath2727 Sep 20, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah actually this is taken care of in the reactinstancesettingsbuilder.cpp

// Enable per monitor DPI scaling
SetProcessDpiAwarenessContext(DPI_AWARENESS_CONTEXT_PER_MONITOR_AWARE_V2);

// Create a top-level window.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While this is an option with the builder, I don't want it in the template. It's fine in the sample app, but for the template i expect people to use the window we give them. and then have the title/resize specified later

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done.

auto reactNativeAppBuilder{winrt::Microsoft::ReactNative::ReactNativeAppBuilder()
.AddPackageProviders(packageProviders)
.SetReactInstanceSettings(reactInstanceSettingsBuilder.ReactInstanceSettings())
.SetAppWindow(window)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As per the above, don't set the window here.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done.

// Start the react-native instance, which will create a JavaScript runtime and load the applications bundle
host.ReloadInstance();
// Start the react-native instance by creating a javascript runtime and load the bundle.
auto reactNativeWin32App{reactNativeAppBuilder.Build()};
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

after building the app, let's use the window getter and set the title / size here.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done.

@microsoft-github-policy-service microsoft-github-policy-service bot added Area: App Template Area: Fabric Support Facebook Fabric Area: Islands New Architecture Broad category for issues that apply to the RN "new" architecture of Turbo Modules + Fabric labels Sep 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Area: App Template Area: Fabric Support Facebook Fabric Area: Islands New Architecture Broad category for issues that apply to the RN "new" architecture of Turbo Modules + Fabric
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Create public OSS new app templates for React Native Fabric
2 participants