Container in mainWindow XAML to display user controls - c#

I am trying to create a main window with buttons on the right and when a button is clicked a different user control screen should show on the left side. When creating the main XAML , what can be used as a container for the user controls to display in?

I Used a TabControl in a ScrollViewer as the container in a column of the Grid.
<ScrollViewer Grid.Column="1">
<TabControl x:Name="Container" >
</TabControl>
</ScrollViewer>
This was the code I needed to change on button click:
Container.Items.Clear();
var login = new UserRegisterUserControl();
Container.Items.Add(login);
Container.Items.Refresh();

Related

Change Windows Content Control From User Control - WPF

In my project I have a Window called AccountWindow.xaml which has a ContentControl to display the two UserControls.
AccountWindow
<Window>
<Window.Resources>
<!-- Login User Control Template -->
<DataTemplate x:Name="LoginUserControl" DataType="{x:Type ViewModels:LoginViewModel}">
<AccountViews:LoginUserControl DataContext="{Binding}"/>
</DataTemplate>
<!-- Registration User Control Template -->
<DataTemplate x:Name="RegistrationUserControl" DataType="{x:Type ViewModels:RegistrationViewModel}">
<AccountViews:RegistrationUserControl DataContext="{Binding}" />
</DataTemplate>
</Window.Resources>
<Grid>
<!-- ContentControl that displays the two User Controls -->
<ContentControl Content="{Binding}" />
</Grid>
</Window>
I then have two user controls called LoginUserControl and RegistrationUserControl
Login User Control
<Grid Background="Pink">
<Button Content="Switch To Register View" Command="{Binding SwitchToReg}" Margin="100" />
</Grid>
Register User Control
<Grid Background="Orange">
<Button Content="Press Me" Command="{Binding PressMe}" Margin="100" />
</Grid>
Both the Login User Control and the Registration User Control have their own ViewModels with a RelayCommand inside that is bound to the buttons as shown in the code.
Login View Model
public class LoginViewModel
{
public RelayCommand SwitchToReg
{
get
{
return new RelayCommand(param =>
{
Console.WriteLine("Switch To Reg");
// Somehow change the content control in the AccountWindow to show the RegistrationDataTemplate???
});
}
}
}
The Problem
I want to be able to change the content of the ContentControl in the AccountWindow when the user presses on one of the buttons in the UserControls. For example, when the user presses the button in the Login User Control called "Switch To Register View" it executes a the Command SwitchToReg and changes the content control to RegistrationUserControl & its ViewModel. How could this be possible?
To achieve that you would need to pass a reference for the AccountWindow into the UserControl when you are constructing it and then your Command can update the ContentControl using the reference you have provided.
This is introducing coupling which is better to avoid so instead I would suggest thinking about the design of the AccountWindow. I would use grid rows to separate the ContentControl area from the button which will change the UserControl.
In the window above, the blue area is where I would host the ContentControl and the red area is part of the AccountWindow.
This way, the behaviour for switching the ContentControl is entirely handled by the AccountWindow.
You can create a property and attache it to the control.
Or you can create another user control and make it visible o not controled by the property that you created.

Load .xaml page into textbox in wpf

Hi I have a problem with loading .xaml page to textbox located in MainWindow. In previous implementation I used tabs, so I could simply write something like this
<TabItem Header="First Tab" Name="firstTab">
<Frame Background="White" Name="firstTabFrame" Source="Tabs/firstTab.xaml/>
</TabItem>
Which propably handled enabled to load firstTab.xaml into mainPage.
Now I have a Ribbon in which I have some kind of groups etc. How to load page firstTab.xaml into my mainPage (maybe to textbox? grid?) after clicking RibbonMenuButton clicked.

Make user control added as child fill stackPanel

my main window consists of a Grid splitting it into two parts.
in one of the parts i have a stackPanel.
into the stackPanel i add via stackPanel.child.add(user control) (from the .cs file) the selected user control window
my question is: how do i make this one child added via the .cs fill the stackPanel completely?
Xaml code:
<StackPanel Name="myStkP" Grid.Column="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" DockPanel.Dock="Bottom"/>
.cs code:
firstAttempt fat = new firstAttempt();
this.myStkP.Children.Add(fat);
firstAttempt is the user control (wpf) i created
The child element, fat, should also have VerticalAlignment="Stretch" HorizontalAlignment="Stretch"

Silverlight RadComboBox Dropdown stays open even when not in focus

I have a user control that contains a scroll viewer. inside the scroll viewer I placed another user control with grid, and inside the grid there is a combo box.
all this is placed inside a RadWindow.
Something like this:
first user control: (displayed inside a RadWindow)
<UserControl x:class = "MyFirstUserControl">
<Grid>
<ScrollViewer>
<StackPanel x:Name="stackPanel"/>
</ScrollViewer>
</Grid>
</UserControl>
second user control:
<UserControl x:class = "MySecondUserControl">
<Grid>
<telerik:RadComboBox x:Name = "comboBox"/>
</Grid>
</UserControl>
in code behind I add the second user control to the stackPanel:
stackPanel.Children.Add(new MySecondUserControl());
Now, the problem is: when the combo-box drop down is open, and I scroll up / down the control - I expect it to close, but- it remains open...
I try to catch the MouseLeftButtonUp event of the scroll bar, and set the IsDropDownOpen of the comboBox to false, but it is false nonetheless and the drop-down still open.
How can I force the drop-down to close when focus is not on it, even if the focus is out of the combo control altogether?
Thanks,

WPF losing data in previous page when a new page is created in Navigation window

I have an app which uses the navigation window. THe page is designed this way.
<Page>
<Grid>
<ComboBox/> <TextBox/>
<Grid> <TextBox/> </Grid>
<Grid> <TextBox/> </Grid>
<ListBox/>
</Grid>
</Page>
Now when i click a "new", i create a page,
Page1 pg1 = new Page1();
this.NavigationService.Navigate(pg1);
Now when i come back to the previous page, i lose the items in the listbox and the text in those two textboxes within the grid. The text in the combobox and textbox remains as selected/typed. How do i keep the data in the page as it is?
Thanks
Set KeepAlive property of the element to "True"
WPF unloads its controls if they are not visible. I am guessing that the items in your listboxes and textboxes are not bound to anything so they get reset when the controls get reloaded.
Best way to avoid that is to bind them to something in the code behind so that they maintain their data.

Categories

Resources