We Keep Coding

C# WinUI 3 frame navigation stack

In my WinUI3 C# application I have a frame with a content page. Given that I set IsNavigationStackEnabled to true on the frame, I'd expect the current page to be pushed to the navigation stack when I navigate (using MyFrame.Navigate(...)) so I could use MyFrame.GoBack() to navigate back to the previous page.
However, trying to invoke MyFrame.GoBack() after navigating from one page to another always results in an exception: System.Runtime.InteropServices.COMException: 'Error HRESULT E_FAIL has been returned from a call to a COM component.'. What's more, the CanGoBack-property is always false.
Am I missing something or is the navigation stack just not managed by the frame in WinUI3 and do I need to do this manually?

This a working sample code for Frame navigation. Note that there's no IsNavigationStackEnabled in the code. IsNavigationStackEnabled is true by default.
MainWindow.xaml
<Grid ColumnDefinitions="*,*">
<StackPanel
Grid.Column="0"
Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<Button
x:Name="Page1Button"
Click="Page1Button_Click"
Content="Page1" />
<Button
x:Name="Page2Button"
Click="Page2Button_Click"
Content="Page2" />
<Button
x:Name="Page3Button"
Click="Page3Button_Click"
Content="Page3" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button
x:Name="BackButton"
Click="BackButton_Click"
Content="Back" />
<Button
x:Name="NextButton"
Click="NextButton_Click"
Content="Next" />
</StackPanel>
<Frame x:Name="NavigationFrame" />
</StackPanel>
<ListView Grid.Column="1" ItemsSource="{x:Bind NavigationLogs}" />
</Grid>
MainWindow.xaml.cs
using Microsoft.UI.Xaml;
using System;
using System.Collections.ObjectModel;
namespace Frames;
public sealed partial class MainWindow : Window
{
public MainWindow()
{
this.InitializeComponent();
NavigateTo(typeof(Page1));
}
private ObservableCollection<string> NavigationLogs { get; } = new();
private void BackButton_Click(object sender, RoutedEventArgs e)
{
NavigateBack();
}
private void NextButton_Click(object sender, RoutedEventArgs e)
{
NavigateForward();
}
private void Page1Button_Click(object sender, RoutedEventArgs e)
{
NavigateTo(typeof(Page1));
}
private void Page2Button_Click(object sender, RoutedEventArgs e)
{
NavigateTo(typeof(Page2));
}
private void Page3Button_Click(object sender, RoutedEventArgs e)
{
NavigateTo(typeof(Page3));
}
private void NavigateTo(Type pageType)
{
this.NavigationFrame.Navigate(pageType);
NavigationLogs.Add($"Navigated to {pageType}.");
}
private void NavigateBack()
{
if (this.NavigationFrame.CanGoBack is true)
{
this.NavigationFrame.GoBack();
NavigationLogs.Add("Navigated back.");
}
else
{
NavigationLogs.Add("Cannot to navigate back.");
}
}
private void NavigateForward()
{
if (this.NavigationFrame.CanGoForward is true)
{
this.NavigationFrame.GoForward();
NavigationLogs.Add("Navigated forward.");
}
else
{
NavigationLogs.Add("Cannot to navigate forward.");
}
}
}

Xaramin.forms Button Isenable failed

I'm new to the xaramin. forms and Im designing a quiz game. I want to make the button to be disabled after the user clicks it to prevent the user from choosing it again. I tried to use Isenable but it's not working.
if I miss putting some code, please point it out.
XAML CODE
<StackLayout>
<StackLayout>
<Button x:Name="C11" Text="$1" WidthRequest="50" HeightRequest="100" Clicked="C11_Clicked" />
<Button x:Name="C12" Text="$1" WidthRequest="50" HeightRequest="100" Clicked="C12_Clicked"/>
</StackLayout>
</StackLayout>
C# code
private void C11_Clicked(object sender, EventArgs e)
{
C11.IsEnabled = false;
Navigation.PushModalAsync(new C11());
}
updated part
private void continue_Clicked(object sender, EventArgs e)
{
MainPage m = new MainPage();
m.C11btn.IsEnabled = false;
Preferences.Set("ButtonEnableFlag", false);
Navigation.PushModalAsync(new MainPage());
}
protected override void OnAppearing()
{
base.OnAppearing();
var enableValue = Preferences.Get("ButtonEnableFlag", true);
MainPage m = new MainPage();
m.C11btn.IsEnabled = enableValue;
}

may i ask how to permanently disabled the button?
If you want to make the button disabled permanently, you need to save a custom status flag in device. Next time entering to this view, the button will be disabled by this custom status flag programmatically.
For example, we can use Xamarin.Essentials: Preferences to sace the custom status flag and override OnAppearing method as follows:
public partial class PageThird : ContentPage
{
public PageThird()
{
InitializeComponent();
}
private void Button_Clicked(object sender, EventArgs e)
{
MyButton.IsEnabled = false;
Preferences.Set("ButtonEnableFlag", false);
}
protected override void OnAppearing()
{
base.OnAppearing();
var enableValue = Preferences.Get("ButtonEnableFlag", true);
MyButton.IsEnabled = enableValue;
}
}
Here is the Xaml code of this page:
<ContentPage.Content>
<StackLayout Padding="20">
<Label Text="Welcome to PagePersonal!"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
<Button x:Name="MyButton" Text="Disable" Clicked="Button_Clicked"/>
</StackLayout>
</ContentPage.Content>
Now the button will be disabled permanently.
If you want to disable the button in another page, you only need to set the custom status flag in another page. Later when you back to needed page, the button will be disabled.
The another page code:
public partial class PageSecond : ContentPage
{
public PageSecond()
{
InitializeComponent();
}
private async void Button_Clicked(object sender, EventArgs e)
{
await Navigation.PushModalAsync(new PageThird());
}
private void Disable_Clicked(object sender, EventArgs e)
{
Preferences.Set("ButtonEnableFlag", false);
}
private void Enable_Clicked(object sender, EventArgs e)
{
Preferences.Set("ButtonEnableFlag", true);
}
}
Then it will work, no code need to change in the needed page.

UWP - Multiple InkCanvases stacked with IsHitTestVisible = false still capturing inking

I have two InkCanvases stacked and I'd like to get the top to pass inking to the bottom. I set the top to ishittestvisible=false but it still receives the inking. Then as a test I set both to false and the top still gets inking...what am I missing?
I created a blank project and it exhibits the same problem. Here's the code:
MainPage.xaml
<RelativePanel>
<StackPanel Name="stackPanelButtons" Orientation="Vertical">
<Button Name="buttonTop" Content="T" Height="50" Click="buttonTop_Click"/>
<Button Name="buttonBottom" Content="B" Height="50" Click="buttonBottom_Click"/>
<Button Name="buttonTopHit" Content="TH" Height="50" Click="buttonTopHit_Click"/>
<Button Name="buttonBottomHit" Content="BH" Height="50" Click="buttonBottomHit_Click"/>
</StackPanel>
<InkCanvas Name="inkCanvasBottom" RelativePanel.RightOf="stackPanelButtons" Width="500" Height="500"/>
<InkCanvas Name="inkCanvasTop" RelativePanel.RightOf="stackPanelButtons" Width="500" Height="500" Loaded="inkCanvasTop_Loaded"/>
</RelativePanel>
MainPage.cs
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private void buttonTop_Click(object sender, RoutedEventArgs e)
{
if(buttonTop.Content.Equals("T"))
{
inkCanvasTop.Visibility = Visibility.Collapsed;
buttonTop.Content = "t";
}
else
{
inkCanvasTop.Visibility = Visibility.Visible;
buttonTop.Content = "T";
}
}
private void buttonBottom_Click(object sender, RoutedEventArgs e)
{
if (buttonBottom.Content.Equals("B"))
{
inkCanvasBottom.Visibility = Visibility.Collapsed;
buttonBottom.Content = "b";
}
else
{
inkCanvasBottom.Visibility = Visibility.Visible;
buttonBottom.Content = "B";
}
}
private void buttonTopHit_Click(object sender, RoutedEventArgs e)
{
if (buttonTopHit.Content.Equals("TH"))
{
inkCanvasTop.IsHitTestVisible = false;
buttonTopHit.Content = "Th";
}
else
{
inkCanvasTop.IsHitTestVisible = true;
buttonTopHit.Content = "TH";
}
}
private void buttonBottomHit_Click(object sender, RoutedEventArgs e)
{
if (buttonBottomHit.Content.Equals("BH"))
{
inkCanvasBottom.IsHitTestVisible = false;
buttonBottomHit.Content = "Bh";
}
else
{
inkCanvasBottom.IsHitTestVisible = true;
buttonBottomHit.Content = "BH";
}
}
private void inkCanvasTop_Loaded(object sender, RoutedEventArgs e)
{
addInputs(inkCanvasTop);
addInputs(inkCanvasBottom);
}
private void addInputs(InkCanvas inkCanvas)
{
inkCanvas.InkPresenter.InputDeviceTypes = CoreInputDeviceTypes.Pen | CoreInputDeviceTypes.Mouse;
}
}

Gesture recognition blocks textbox in WP8.1

I'm implementing a control with gesture interactions for Windows Universal app. But I've found an issue, that if I define gesture setting for a container than parent TextBox control will not be clickable after that.
Here is a simplified layout code:
<Page x:Class="App.MainPage">
<Grid x:Name="RootGrid" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBox Grid.Row="0" />
<Button Grid.Row="1" Content="Click" />
</Grid>
</Page>
Here is a simplified code, which allows to reproduce the behavior:
public sealed partial class MainPage : Page
{
private GestureRecognizer _gr = new GestureRecognizer();
public FrameworkElement Container { get; set; }
public MainPage()
{
this.InitializeComponent();
this.NavigationCacheMode = NavigationCacheMode.Required;
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
this.Container = this.RootGrid;
this.Container.PointerCanceled += OnPointerCanceled;
this.Container.PointerPressed += OnPointerPressed;
this.Container.PointerMoved += OnPointerMoved;
this.Container.PointerReleased += OnPointerReleased;
_gr.CrossSlideHorizontally = true;
_gr.GestureSettings = GestureSettings.ManipulationTranslateRailsX;
}
private void OnPointerCanceled(object sender, PointerRoutedEventArgs e)
{
_gr.CompleteGesture();
e.Handled = true;
}
private void OnPointerPressed(object sender, PointerRoutedEventArgs e)
{
_gr.ProcessDownEvent(e.GetCurrentPoint(null));
this.Container.CapturePointer(e.Pointer);
e.Handled = true;
}
private void OnPointerMoved(object sender, PointerRoutedEventArgs e)
{
_gr.ProcessMoveEvents(e.GetIntermediatePoints(null));
e.Handled = true;
}
private void OnPointerReleased(object sender, PointerRoutedEventArgs e)
{
_gr.ProcessUpEvent(e.GetCurrentPoint(null));
e.Handled = true;
}
}
Debuggig said me that the main reason of this behavior is OnPointerPressed handler. This method is called when I click on the RootGrid and TextBox, but doesn't when I click on the button. object sender is always Windows.UI.Xaml.Controls.Grid so I cannot determine is it TextBox or not.
What is the most interesting that the same code work as expected for Windows app, but doesn't work for Windows Phone 8.1 app.
Could you give me any suggestion how to implement gesture recognition without affecting on controls inside?

I haven't found a better solution than adding PointerPressed event handler for TextBox control:
private void TextBox_OnPointerPressed(object sender, PointerRoutedEventArgs e)
{
e.Handled = true;
}
It prevents calling OnPointerPressed for this.Container and allows using TextBox in a typical way. Not the best solution but it works as well for me.

WPF: How do I use one User control for multiple different Click events

I'm trying to create a User control for all the buttons on my homepage, every user control should have a different Click event. I'm trying to solve this by adding a property to the User control (which works for the label and image) but i can't find any solution for the Click event.
ImageLabelButton.xaml:
<UserControl x:Class="SC.UI.WPF.Controls.ImageLabelButton"
<Grid>
<Button Name="BtnClick">
<StackPanel>
<Image Name="ImageButton"/>
<Label Name="LabelButton"/>
</StackPanel>
</Button>
</Grid>
ImageLabelButton.xaml.cs:
....
<!-- works -->
public string Name
{
get { return this.LabelButton.Content.ToString(); }
set { this.LabelButton.Content = value; }
}
<!-- works -->
public ImageSource SetSource
{
get { return ImageButton.Source; }
set { ImageButton.Source = value; }
}
<!-- doesn't work -->
public EventHandler ButtonAction
{
get { return BtnClick.Click; }
set { BtnClick.Click= value; }
}
Implementation.xaml:
....
<controls:ImageLabelButton Name="first" SetSource="test.png" ButtonAction="Click1"/>
<controls:ImageLabelButton Name="first" SetSource="test.png" ButtonAction="Click2"/>
<controls:ImageLabelButton Name="first" SetSource="test.png" ButtonAction="Click3"/>

You just need to set the event handler up as a property of the user control and set it in the usage code:
User control XAML:
<Grid>
<Button Name="BtnClick" Click="BtnClick_DoClick">
<StackPanel>
<Image Name="ImageButton"/>
<Label Name="LabelButton"/>
</StackPanel>
</Button>
</Grid>
User control codebehind:
public EventHandler<RoutedEventArgs> ButtonAction;
private void BtnClick_DoClick(object sender, RoutedEventArgs e)
{
if (ButtonAction != null) ButtonAction(sender, e);
}
Implementation XAML:
<controls:ImageLabelButton Name="first1" SetSource="test.png" />
<controls:ImageLabelButton Name="first2" SetSource="test.png" />
<controls:ImageLabelButton Name="first3" SetSource="test.png" />
Implementation code behind:
public MainWindow()
{
InitializeComponent();
first1.ButtonAction = Button1;
first2.ButtonAction = Button2;
first3.ButtonAction = Button3;
}
private void Button3(object sender, RoutedEventArgs e) { MessageBox.Show("Pressed 3"); }
private void Button2(object sender, RoutedEventArgs e) { MessageBox.Show("Pressed 2"); }
private void Button1(object sender, RoutedEventArgs e) { MessageBox.Show("Pressed 1"); }
Although you can't set the event handling in XAML this way.

You need a RoutedEvent on your user control that can be accessed from Implementation.xaml
ImageLabelButton.xaml
<Button Name="BtnClick" Click="Submit_Click">
<StackPanel>
<Image Name="ImageButton"/>
<Label Name="LabelButton"/>
</StackPanel>
</Button>
ImageLabelButton.cs
private void Submit_Click(object sender, RoutedEventArgs e)
{
RaiseEvent(new RoutedEventArgs(ClickEvent, this));
}
public static readonly RoutedEvent ClickEvent = EventManager.RegisterRoutedEvent(
"Click", RoutingStrategy.Bubble, typeof(RoutedEventHandler), typeof(MyUserControl));
public event RoutedEventHandler Click
{
add { AddHandler(ClickEvent, value); }
remove { RemoveHandler(ClickEvent, value); }
}
Implementation.xaml
<controls:ImageLabelButton Name="first" SetSource="test.png" Click="Click1"/>
Implementation.xaml.cs
private void Click1(object sender, RoutedEventArgs e)
{
}