[Request] Update MainLandingPage UI to WinUI Gallery one + Template fix + Questions

[tinodin]

Update MainLandingPage UI to WinUI Gallery one

I mainly want the new/updated HeaderTiles at the top.

Template fix

You forgot to update the template for the refactored ThemeService. When creating a new project from template it has:

private void ThemeButton_Click(object sender, RoutedEventArgs e)
{
    ThemeService.ChangeThemeWithoutSave(App.MainWindow);
}

correct would be:

private void ThemeButton_Click(object sender, RoutedEventArgs e)
{
    App.Current.ThemeService.SetElementThemeWithoutSaveAsync();
}

Questions

Im currently not updating from 9.0.0 preview1 to 9.0.0 because the new FileOpenPicker from WinAppSDK doesn't support InitialDirectory. I know that there is SuggestedStartLocation but I need more specific paths. Is there a way to circumvent this limitation or that you could reintroduce your custom Picker until they add it?

Also how exactly do you manually change the TintColor now and is it possible to do it using the DropdownColorPicker again?

[ghost1372]

Hi @tinodin
Thank you for your report. The wrong VSIX was uploaded to the marketplace, but I’ve now uploaded the updated version. It should be available soon.

Also, the MainLandingPage already supports header tiles — you can check it out here. I’ve removed the custom picker, so I can’t add it back, but if you need it, you can copy and paste the code into your own repository. (you can find it from git commit history) The initial directory will be added soon; there’s already an active PR in the WASDK repo.

I also removed the TintColor methods because they were a bit confusing and difficult to maintain. However, you can still access the backdrop and modify the TintColor property yourself — see here for reference.

[tinodin]

Thanks @ghost1372
I know that HeaderTiles already exist, what I meant was that they updated the design of them (smaller titles, smaller icon, different width).

Glad to hear they are working to get InitialDirectory added.

Ok. I got the TintColor to work now.

[ghost1372]

Hi @tinodin
Thank you for your suggestion.
MainLandingPage is now Updated to latest changes.
there is some breaking changes.

[tinodin]

The wrong VSIX was uploaded to the marketplace, but I’ve now uploaded the updated version. It should be available soon.

@ghost1372 I tested the new VSIX, but the issue is still present. The problem occurs only in VSIX/DevWinUI_Template/WinUIApp-NavigationView/MainWindow.xaml.cs, where the old ThemeService code is still used. Because of this, it doesn’t work out of the box.

private void ThemeButton_Click(object sender, RoutedEventArgs e)
{
    ThemeService.ChangeThemeWithoutSave(App.MainWindow);
}

[ghost1372]

Sorry @tinodin
I missed this one. i uploaded a new version will be available soon

[tinodin]

I’ve removed the custom picker, so I can’t add it back, but if you need it, you can copy and paste the code into your own repository. (you can find it from git commit history)

@ghost1372 I added the code that was removed in the commit and realized I also needed NativeMethods and added all of those and replaced the namespaces with mine but still I get a lot of errors. How exactly can I set it up correctly. Do I need any other packages?

[ghost1372]

Hi @tinodin
make sure you add a NativeMethods.json file and copy-paste following codes:

{
  "$schema": "https://aka.ms/CsWin32.schema.json",
  "allowMarshaling": false,
  "public": false
}

Picker is designed to work with Native AOT, which is why marshaling must be disabled.

see my sample app.

App8.zip

[tinodin]

Thanks, I needed Microsoft.Windows.CsWin32 nuget package.

[tinodin]

@ghost1372 Somehow the HeaderImage is cut off or smaller than in the Gallery:

[ghost1372]

This is because in the past, Win2D and complex layers were used to create the image effect. However, in the new version, all of that has been removed, and the OpacityMaskView control is now used to achieve the effect, which has resulted in some minor changes. Also, try adjusting the HeaderImageHeight to see if it meets your needs.

Related Commits:
3638e5e
38e777f
ec731e2
1ea4a31