We Keep Coding

C#/AvaloniaUI - Click a button and change Text

I am very new to AvaloniaUI.
I am really struggling to change a text when I click a button.
Here is my code:
<Window xmlns="https://github.com/avaloniaui"
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" d:DesignWidth="800" d:DesignHeight="450"
x:Class="ReadyForWar_Launcher.MainWindow"
Title="ReadyForWar_Launcher">
<StackPanel>
<TextBlock Name="TestBlock">Show my text here!</TextBlock>
<Button Command="{Binding RunTheThing}" CommandParameter="Hello World">Change the Text!</Button>
</StackPanel>
</Window>
Here is my MainWindow.xaml.cs:
using Avalonia;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;
namespace ReadyForWar_Launcher
{
public class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
#if DEBUG
this.AttachDevTools();
#endif
}
private void InitializeComponent()
{
AvaloniaXamlLoader.Load(this);
}
public void RunTheThing()
{
}
}
}
Inside RunTheThing I don't know how can I select the TextBlock with Name="TestBlock" and change the text to "Hello World".
Can you please help me out on this ?

There are two approaches, the recommended one and straightforward one.
Recommended: Use MVVM pattern. Create a view model with ButtonTextProperty and RunTheThing command, make the command to change the property, assign that model to the DataContext and bind your button text and command to view model properties. The MVVM approach is basically the same as in WPF, so you can use documentation and tutorials from there (that applies to most of the Avalonia, BTW). For example, here is a good one (not advertising, 4th link from google).
Straightforward (aka winforms-way): add x:Name="MyButton" to your button and use this.FindControl<Button>("MyButton") after calling AvaloniaXamlLoader.Load(this);. This will give you a Button reference that you can manipulate from code. Instead of using commands, you can just subscribe to the click handler directly from codebehind, add public void MyButton_OnClick(object sender, RoutedEventArgs args){} to your MainWindow class and add replace Command and CommandParameter with Click="MyButton_OnClick". That way button click will trigger your event handler.
Note, that the second approach doesn't scale well with the application size and suffers from code complexity when handling lists.

XamlParseException when adding a usercontrol into a project

I created a user control in a project that consists of just a MainWindow.xaml and the code behind. I added the .dll to the toolbox of VS, and dropped it onto a window in a new project. This created the following:
<Window
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:WpfApplication5"
xmlns:ThinkGeoClean="clr-namespace:ThinkGeoClean;assembly=ThinkGeoClean" x:Class="WpfApplication5.MainWindow"
mc:Ignorable="d"
Title="MainWindow" >
<Grid>
<ThinkGeoClean:ListBoxCustom x:Name="listBoxCustom" />
</Grid>
</Window>
The ThinkGeoClean is the name of the .dll I added which is the usercontrol. ListBoxCustom is just a public class in the control, but is NOT what I want to show. I want to show the main window of the usercontrol (not a window), but it doesn't show as an option after typing <ThinkGeoClean:. The only thing that shows up is ListBoxCustom. If I go ahead and type <ThinkGeoClean.MainWindow>, it gives a XamlParseException error on that line.
Now, if I go into the code-behind and do:
ThinkGeoClean.MainWindow newWin = new ThinkGeoClean.MainWindow();
newWin.Show();
It will pop up the usercontrol in a new window and it works fine.
Here's the beginning of usercontrol code behind:
namespace ThinkGeoClean
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window, INotifyPropertyChanged
{
And the xaml for it is just a single grid containing some buttons and a map control.
Edit: In addition to the answer below, my user control was originally just a normal WPF project. I thought changing the output type to a class library would change it into a user control automatically, but I actually had to go into the xaml and change the the into .

This XAML:
<Grid>
<ThinkGeoClean:ListBoxCustom x:Name="listBoxCustom" />
</Grid>
...is not equivalent to creating an instance of a window and call the Show() method on it programmatically.
Instead the XAML processor will try to add the window to the Children collection of the Grid and this is not possible since a window cannot be child of another control. That's why you get an exception.
Also, a UserControl must be hosted in a window or page. It is not a top-level control that you can display without any parent host.

How to get the ClientRectangle of Form or Window? [duplicate]

In WinForms, Form had a ClientSize property (inherited from Control), which returns the size of its client area, i.e., the area inside the title bar and window borders.
I'm not seeing anything similar in WPF: there's no ClientSize, ClientWidth, ClientHeight, GetClientSize(), or anything else that I can think to guess the name of.
How do I go about getting the client size of a WPF Window?

One way you could do it is to take the top most child element, cast this.Content to its type, and call .RenderSize on it, which will give you its size.
<Window x:Class="XML_Reader.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="400" Width="600" WindowStyle="SingleBorderWindow">
<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
</Grid>
</Window>
((Grid)this.Content).RenderSize.Height
((Grid)this.Content).RenderSize.Width
edit:
as Trent said, ActualWidth and ActualHeight are also viable solutions. Basically easier methods of getting what I put above.

var h = ((Panel)Application.Current.MainWindow.Content).ActualHeight;
var w = ((Panel)Application.Current.MainWindow.Content).ActualWidth;

One way to do it is with the code below. XAML:
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1"
Title="Window1" Height="300" Width="300" Loaded="Window_Loaded">
<Canvas>
</Canvas>
</Window>
C#:
using System.Windows;
using System.IO;
using System.Xml;
using System.Windows.Controls;
namespace WpfApplication1
{
/// <summary>
/// Interaction logic for Window1.xaml
/// </summary>
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
double dWidth = -1;
double dHeight = -1;
FrameworkElement pnlClient = this.Content as FrameworkElement;
if (pnlClient != null)
{
dWidth = pnlClient.ActualWidth;
dHeight = pnlClient.ActualHeight;
}
}
}
}

I used a Grid with VerticalAlignment=Top. As a result the Grid unfortunately didn't fill the parent Window anymore (which is its default behaviour, but the VerticalAligment property spoils it).
I solved it by putting an empty Border around the Grid. This border fills the complete content of the window, it has the same dimensions as the default border that a wpf window has anyways.
To get the Grid to fill the main window, I used the binding:
<Border BorderThickness="0" x:Name=Main>
<Grid VerticalAlignment="Top" Height="{Binding ElementName=Main, Path=ActualHeight}"> ...
</Grid>
</Border>

All the suggested solutions are based on the idea to use the size of Windows.Content to know what is the actual size available within the window, like this:
var h = ((Panel)Application.Current.MainWindow.Content).ActualHeight;
This of course only works if Window.Content is not null. Which is a problem if you want to set Window.Content from your code and you already then need to know exactly how much space is available.
The other problem is that the above code only provides the available space once a first layout cycle has completed (i.e. in the Window_Loaded event). But what do you do if you need to know the available space during the first layout cycle, for example because you draw to the window during Windows.OnRender() ?
The first control in the visual tree of any Window is always a Border, even if Window.Content is null. Interestingly, Border.RenderSize has already a value, even when RenderSize.ActualSize might still be zero. I guess the reason is that the size of the Border does not depend on Window.Content, but only on the size of the window (unless, of course, if Window.SizeToContent is used).
I recommend to place your code into the Window.SizeChanged event. Because each time the Window size changes, your content needs to change too. You cannot use the size provided in the event parameters, which gives you the size of the complete window, but you can get the the available size within the window like this:
var h = ((Border)GetVisualChild(0)).RenderSize.Height;
You can use that line of code also if you override Windows.OnRender().

How to show user control on button click in wpf?

I have created a user control in wpf. I have also create a mainwindow. Now, what i want is that, when i click on a button (which is in mainWindow), a user control is shown like a dialog box. suppose i have a button named i-e create new user. Now, what i want is to show the control (that i have created for new user) on button click whithout calling it in mainWindow.

In the WPF demo application Family Show, user controls are created in the main window (MainWindow.xaml)
<!-- New User Control -->
<local:NewUserControl x:Name="NewUserControl"
HorizontalAlignment="Center" VerticalAlignment="Center"
AddButtonClick="NewUserControl_AddButtonClick"/>
Then in the code behind (MainWindow.xaml.cs), the different user controls are hidden or shown as a result of click actions from the button.
/// <summary>
/// Hides the New User Control.
/// </summary>
private void HideNewUserControl()
{
NewUserControl.Visibility = Visibility.Hidden;
DiagramControl.Visibility = Visibility.Visible;
enableButtons();
if (family.Current != null)
DetailsControl.DataContext = family.Current;
}
/// <summary>
/// Shows the New User Control.
/// </summary>
private void ShowNewUserControl()
{
HideFamilyDataControl();
HideDetailsPane();
DiagramControl.Visibility = Visibility.Collapsed;
WelcomeUserControl.Visibility = Visibility.Collapsed;
if (PersonInfoControl.Visibility == Visibility.Visible)
((Storyboard)this.Resources["HidePersonInfo"]).Begin(this);
NewUserControl.Visibility = Visibility.Visible;
NewUserControl.ClearInputFields();
NewUserControl.SetDefaultFocus();
... //Removed for brevity
}
I encourage you to download the Family Show app to look at the source code, or to browse it at least on-line.
You could put it in a separate window like Johannes Hofmeister suggested with his answer.
The main advantage of a User Control is that this user interface block might be used at multiple points in an application. (eg. a graph control user control with scroll, zoom and screenshot buttons would appear next to every graph, making it an ideal candidate for a user control).

You can easily add another window with the your usercontrol on it!
First, create another window (right click in the solution explorer, add new item, Window).
Second, drag you usercontrol onto the window:
<Window x:Class="MyWpfApplication.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:DeleteMeTest="clr-namespace:DeleteMeTest"
Title="Window1" Height="300" Width="300">
<Grid>
<MyWpfApplication:UserControl1 />
</Grid>
</Window>
Then you must setup the button click handler to show the window:
MainWindow.xaml:
<Window x:Class="MyWpfApplication.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Button Content="Click Me" Click="Button_Click"/>
</Grid>
</Window>
The Button_Click Handler in MainWindow.xaml.cs:
private void Button_Click(object sender, RoutedEventArgs e)
{
new Window1().ShowDialog();
}
The ShowDialog() Method opens a dialog, which means that the window comes on top and must be interacted with (Closed) before you can return to interacting with your main window.
You can also use the Show Method, to have a non blocking window.

How to manipulate a window object from another class in WPF

I'm new in WPF and C#. I know a lot of VB.NET and I'm used to the way when I call a form object like textboxes, etc. I'm calling it from another form. Now, I'm using WPF, I'm confused. Because I have a Main Window. And I want to add and item to a listbox in the Main Window from a Class. In VB.Net , its just like this.
IN FORM2
Form1.Textbox.Text = "";
Wherein I can't do it in WPF. Can someone please Help me. Thanks!

WPF windows defined in XAML have their controls publicly accessible from other classes and forms, unless you specifically mark them with the x:FieldModifier attribute as private.
Therefore, if you make an instance of your main window accessible in another class, be it a Window or anything else, you'll be able to populate controls from within this second class.
A particular scenario is when you want to update the contents of a control in your main window from a child window that you have opened on top of it. Is such a case, you may set the child window's Owner property to the current, main window, in order to access it while the child is visible. For instance, let's say you have defined these two windows:
// MainWindow
<Window x:Class="TestApplication.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ListBox Name="mainListBox" Height="250" HorizontalAlignment="Stretch" VerticalAlignment="Top"/>
<Button Content="Open Another Window" HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin="20" Click="OpenAnotherWindow_Click"/>
</Grid>
</Window>
and
// AnotherWindow
<Window x:Class="TestApplication.AnotherWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="AnotherWindow" Height="300" Width="300">
<Grid>
<Button Content="Add New Item to Main Window" HorizontalAlignment="Center" VerticalAlignment="Center" Click="AddNewItem_Click"/>
</Grid>
</Window>
each in its own XAML file.
In MainWindow's code behind, inside the button click handler, you show an instance of AnotherWindow as a dialog and set its Owner property to MainWindow's instance:
private void OpenAnotherWindow_Click(object sender, RoutedEventArgs e)
{
AnotherWindow anotherWindow = new AnotherWindow();
anotherWindow.Owner = this;
anotherWindow.ShowDialog();
}
Now, you can access the MainWindow's instance from AnotherWindow's Owner property, in order to add a new item to the ListBox control defined on it, in the button click handler in AnotherWindow's code behind:
private void AddNewItem_Click(object sender, RoutedEventArgs e)
{
MainWindow mainWindow = Owner as MainWindow;
mainWindow.mainListBox.Items.Add(new Random().Next(1000).ToString());
}
It simply adds a new random number to the ListBox, in order to show how the code accesses and modifies the control's data in MainWindow.

Pure WPF solution, but also may be easiest in your case, is using a Data Binding in WPF.
Every form's control is binded to some data on ModelView (pure MVVM approach) or to data (more or less like yuo can do it in WindowsForms). So the "only" thing you have to do is to read/write data binded to controls on UI of that form.
For example, you have TextBox on Windows and want to read a data from it.
This TextBox is binded to some string property of the class that is responsible for holding the data for the controls on that form (just an example, in real world could be 1000 other solutions, based on developer decisions). So what you need, is not to say: "window give textbox" and after read TextBox's content, but simply read binded string property.
Sure it's very simply description of a stuff. But just to give you a hint. Follow databinding link provided above to learn more about this stuff. Do not afraid of a lot of stuff there, it's after all is not a complicated idea and also pretty intuitive. To make that stuff to work in simply case you will not need to make huge efforts by me. The stuff becomes really complex when you end up into real world applications.

This will get all active windows:
foreach (Window item in Application.Current.Windows)
{
}