We Keep Coding

WinUI ListView ObservableColellection binding not working

I'm learning the new WinUI platform together with XAML and GUI programming in C# and I'm not sure if I correctly understand how the bindings and updates work, but I can't get the following code (minimal working example) to work:
MainPage.xaml
<Page
x:Class="uitest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
<ListView ItemsSource="{x:Bind Items, Mode=OneWay}"></ListView>
<Button Content="Add" Click="Button_OnClick"></Button>
</StackPanel>
</Page>
MainPage.xaml.cs
using System.Collections.ObjectModel;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
namespace uitest
{
public sealed partial class MainPage : Page
{
public ObservableCollection<string> Items = new ObservableCollection<string>();
public MainPage()
{
this.InitializeComponent();
Items.Add("A");
Items.Add("B");
}
private void Button_OnClick(object sender, RoutedEventArgs e)
{
Items.Add("Next");
}
}
}
When I start the application, I see a list with two items but when I click the button nothing happens. I wanted to use the Live Visual Tree for debugging but it's not working for some reason.

I opened an issue on the official WinUI repository for this and apparently it's a compatibility fault in the latest WinUI 3 preview. I should also note this does not work only on the UWP platform but it works on the Desktop (Win32).

Window.show not loading contents in wpf

I am trying to bring up a window as a loading screen using the system.windows.window.show() method. The program is supposed continue running code and then close the window after it is done. The problem is that the window will not show the textblock I am trying to display. But when I do ShowDialog() it will
LoadingWindow lw = new LoadingWindow();
lw.Show();
//
//do stuff
//
lw.Close();
<Window x:Class="RevitAPITest3.LoadingWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:RevitAPITest3"
mc:Ignorable="d"
Title="Loading..." Height="450" Width="800" >
<Grid>
<TextBlock x:Name="text" FontSize="20" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Height="43" Width="291">testing</TextBlock>
</Grid>
</Window>

There's a fundamental difference between lw.Show() and lw.ShowDialog().
lw.Show() will immediately return to the next line of code without waiting for the window to close.
lw.ShowDialog() will wait for the window to close manually by the user, then return a value of true/false.
In your example code, your problem is that because lw.Show() returns immediately, it will then "do stuff" and then call lw.Close() which closes your window before you even see the window.
What you'll want to do is something like this. Notice: You never have to explicitly call lw.Close() because the window will automatically be closed as soon as it completes the lw.ShowDialog() line.
var result = lw.ShowDialog();
if (result.HasValue)
{
//
//do Stuff
//
}

Here is a complete working solution. Check to see where you are doing things differently and see if you can match this implementation.
MainWindow.xaml
<Window x:Class="LoadingWindowTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="MainWindow" Height="768" Width="1024" WindowStartupLocation="CenterScreen">
<Grid>
<TextBlock Text="Main Window" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="32"/>
</Grid>
</Window>
MainWindow.xaml.cs
using System.Threading.Tasks;
using System.Windows;
namespace LoadingWindowTest
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
private LoadingWindow lw;
public MainWindow()
{
InitializeComponent();
this.Loaded += OnLoaded;
}
private async void OnLoaded(object sender, RoutedEventArgs e)
{
// Make the main window hidden until loading is done
this.Visibility = Visibility.Hidden;
// Show the Loading window
lw = new LoadingWindow();
lw.Show();
// Simulate a long running task
await Task.Delay(5000);
// Close the Loading window
lw.Close();
// Show the Main Window
this.Visibility = Visibility.Visible;
}
}
}
LoadingWindow.xaml (no xaml.cs shared because I didn't touch it)
<Window x:Class="LoadingWindowTest.LoadingWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="LoadingWindow" Height="450" Width="800" WindowStartupLocation="CenterScreen">
<Grid>
<Grid>
<TextBlock x:Name="text" FontSize="20" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Height="43" Width="291">testing</TextBlock>
</Grid>
</Grid>
</Window>
Build and Run, then this is the Expected Output:
You should see the LoadingWindow on the center of the screen, then after 5 seconds, it closes and the MainWindow shows.

Prevent user entered data from clearing on new window load

I have a small desktop app that loads numerous windows and pages into a main screen into a grid on a button click. The relevant page loads into the grid and users then enter data in text boxes, selected radio questions and so on. They can then copy the data entered and paste it into where they need to paste it. Simple macro type desktop app.
My main issue is when the users click from one loaded window and goes to another macro that then deletes all previously entered data. So if the user then goes back to a previous macro it reloads as new.
Each window/macro has a reset button and I would ultimately like to have all data saved until that is used or app is closed.
Thanks for any help!
Update: added code below. Simple app that has a main window/landing page and a grid. On button click grid loads a page (page2 or page3) dependent on which button is clicked. If A user enters text in text boxes, goes to a different page by clicking the other button and then goes to page with said button previously entered data is gone.
code breakdown:
main screen xaml
<Page
x:Class="test.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:test"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Width="1001">
<Grid x:Name="loadgrid" Height="500" Background="White" Margin="423,110,61,110">
<Button Content="Button" Margin="-298,29,0,0" VerticalAlignment="Top" Width="113" Click="Button_Click"/>
<Button Content="Button" Margin="-298,97,0,0" VerticalAlignment="Top" Width="113" Click="Button_Click_1"/>
</Grid>
</Page>
main screen CS
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409
namespace test
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
loadgrid.Children.Add(new test.BlankPage1());
}
private void Button_Click_1(object sender, RoutedEventArgs e)
{
loadgrid.Children.Add(new test.page3());
}
}
}
page1 xaml
<Page x:Name="page2"
x:Class="test.BlankPage1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:test"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="#FFF57A7A" Width="400" Height="400">
<Grid>
<TextBox HorizontalAlignment="Center" Margin="0,53,0,0" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Top" Width="178" AllowFocusWhenDisabled="True"/>
<TextBox HorizontalAlignment="Center" Margin="0,116,0,0" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Top" Width="178"/>
<TextBox HorizontalAlignment="Center" Margin="0,168,0,0" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Top" Width="178"/>
</Grid>
</Page>
page1 cs
namespace test
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class BlankPage1 : Page
{
public BlankPage1()
{
this.InitializeComponent();
}
}
}
page3 xaml
<Page x:Name="page1"
x:Class="test.page3"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:test"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="#FF5C838F" Width="400" Height="400">
<Grid>
<TextBox HorizontalAlignment="Left" Margin="123,105,0,0" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Top" Width="173"/>
<TextBox HorizontalAlignment="Left" Margin="123,168,0,0" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Top" Width="173"/>
<TextBox HorizontalAlignment="Left" Margin="123,227,0,0" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Top" Width="173"/>
</Grid>
</Page>
page3 cs
namespace test
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class page3 : Page
{
public page3()
{
this.InitializeComponent();
}
}
}

hi you can enable the page cache mode at the start of the page it store the entire page cache data check boxes data n all.
this.NavigationCacheMode = Windows.UI.Xaml.Navigation.NavigationCacheMode.Enabled;

As #Ed_Plunkett said, if you want to save the state of user input, you can use MVVM. Simply put, the user's input is saved to a variable for the next page load.
But as far as your current code is concerned, Page is best to use Frame for navigation. If you need to add some controls directly to the Page, you can create a UserControl.
Here is the document about UserControl.
Here is the document about Navigation.
Best regards.

How to create child window by the context menu of page in wpf?

I have a context menu what is triggered by each list item of listbox.
And, I want to create child window when I select a context menu as below:
xaml
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Width="150" Orientation="Vertical" Margin="15, 5, 15, 5">
<StackPanel.ContextMenu>
<ContextMenu FontSize="16">
<MenuItem Header="{x:Static localRes:Resources.ID_STRING_SETTING}" Margin="5" Command="Setting_Click"/>
</ContextMenu>
It is already a sub page of main window.
So, I can't find a way how to set MainWindow instance as the owner of new window.
Behind Code
private void Setting_Click(object sender, RoutedEventArgs e)
{
SettingWindow SettingWindow = new SettingWindow();
SettingWindow.Owner = /* I do not know how to do */
SettingWindow.Show();
}

If your click command handler is in the code behind for your main window, then you need to set
deviceSettingWindow.Owner = this;
https://learn.microsoft.com/en-us/dotnet/api/system.windows.window.owner?view=netframework-4.8
Here's a small example. It includes a button with a handler whose code is in the code behind -
<Window x:Class="MainWindow.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ChildWindow"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Button Content="Button" HorizontalAlignment="Left" Margin="114,137,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click"/>
</Grid>
</Window>
CodeBehind:
using System.Windows;
namespace MainWindow
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
var childWindow = new ChildWindow.Window1();
childWindow.Owner = this;
childWindow.Show();
}
}
}
Child Window - just an empty window
<Window x:Class="ChildWindow.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ChildWindow"
mc:Ignorable="d"
Title="Window1" Height="450" Width="800">
<Grid>
</Grid>
</Window>
Child Window Code Behind
using System.Windows;
namespace ChildWindow
{
/// <summary>
/// Interaction logic for Window1.xaml
/// </summary>
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
}
}
In my example, Since you are in the code behind for the MainWindow, this is a reference to the MainWindow, and setting 'childWindow.Owner = this' is setting the childWindow's owner to the MainWindow which is what I believe you want.
One thing that is a little confusing to me is that you are using a Command and a reference to an event handler in the code behind. I'm pretty sure that's not going to work. Commands need to Bind to an ICommand reference - you'll have to implement your own ICommand class, or use one from MVVM Light or another WPF MVVM Framework. Once you've got that you can pass a reference from the parent window through the Command as a CommandParameter. For an example of how to do this, see passing the current Window as a CommandParameter
If you are using an event handler on a control, then that can bind to the event handler implementation in the code behind like in my example. You need to choose one or the other.
If you're able to provide more details on how you're setup, it would make it easier for me to provide input on which way you need to go.

how to show auth0 client loginasync in webview

I am trying to build an app with login page that uses auth0, now when I call LoginAsync the sdk will popup the login page in a different frame, I want to show the login page in a webview that is defined in xaml.
I want to show login page that popup in this [ in a webview defined in this is xaml:
<Page
x:Class="Auth0App.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Auth0App"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<StackPanel Margin="10,0">
<StackPanel>
<TextBlock Style="{ThemeResource SubheaderTextBlockStyle}">Log in using widget</TextBlock>
<Grid HorizontalAlignment="Center" Margin="0,10">
<Button Content="Login" x:Name="LoginButton" Click="LoginButton_OnClick"/>
</Grid>
</StackPanel>
<StackPanel>
<WebView Name="loginWebView"/>
</StackPanel>
</StackPanel>
</Page>
and the code behind is:
using Auth0.SDK;
using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
namespace Auth0App
{
public sealed partial class MainPage : Page
{
private Auth0Client auth0Client;
public MainPage()
{
this.InitializeComponent();
auth0Client = new Auth0Client("mydomain", "**************************");
}
private async void LoginButton_OnClick(object sender, RoutedEventArgs e)
{
try
{
var user = await auth0Client.LoginAsync();
}
catch (Exception ex)
{
}
}
}
}
How would I wire auth0 client with my webview?

I would start by looking at the Auth0 quickstart for this kind of project. I think you're about halfway there, and the quickstart would get you the rest of the way.
Feel free to reach out if there's anything missing or you need further assistance!
--Kassandra Perch, Developer Evangelist