I am new to WPF and i can not figure some things out. I just started an new project and i wanted to make a StackPanel because i saw that on a tutorial. But now i've implemented the StackPanel and i get 2 errors.
The object 'Window' already has a child and cannot add 'StackPanel'. 'Window' can accept only one child. Line 9 Position 116.
The property 'Content' is set more than once.
Can someone explain to me what i am doeing wrong.
This is my code:
<Window x:Class="CheckDatabase.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="CheckDatabase" Height="350" Width="525">
<Grid Margin="10,80,10,10" >
<TextBox TextWrapping="Wrap"/>
</Grid>
<StackPanel Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Name="ButtonPanel" VerticalAlignment="Top">
<Button Margin="0,10,0,10">Button 1</Button>
<Button Margin="0,10,0,10">Button 2</Button>
</StackPanel>
Thanks in advance
A Window can only contain one child. However, your Window contains both a Grid and a StackPanel.
To fix this you need to put the StackPanel inside the grid (if that is the intention) or wrap both the Grid and the StackPanel inside another panel that positions the two elements in the way you want.
Some Controls like Window can only have a single child. You will have to remove the Grid or either nest another Grid arround your Grid and Stackpanel.
Example:
<Grid x:Name="outerGrid">
<Grid x:Name="innerGrid"></Grid>
<StackPanel x:Name="innerStackPanel></StackPanel>
</Grid>
Window is a ContentControl and hence can have only one Content. You can do the following to have the expected layout
<Window x:Class="CheckDatabase.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="CheckDatabase" Height="350" Width="525">
<StackPanel>
<Grid Margin="10,80,10,10" >
<TextBox TextWrapping="Wrap"/>
</Grid>
<StackPanel Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Name="ButtonPanel" VerticalAlignment="Top">
<Button Margin="0,10,0,10">Button 1</Button>
<Button Margin="0,10,0,10">Button 2</Button>
</StackPanel>
</StackPanel>
Related
There is a window on how to make it so that after clicking on the button, a page opens inside this window, while it moves along with the window, the background of the window darkens and when you click on, all the elements of the window become non-clickable.
You don't necessarily need actual Flyout. The combination of ordinary Grids would surffice.
<Window x:Class="WpfApp1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="800" Height="400">
<Grid>
<!-- Main content -->
<!-- Flyout Grid -->
<Grid Visibility="Visible"
Background="#22000000">
<Grid Width="400" Height="300" Background="Black">
<TextBlock Text="Flyout" Foreground="White"
HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
</Grid>
</Grid>
</Window>
This Flyout Grid covers the entire Window and looks as a Flyout. You can show/hide this Grid by changing its Visibility somehow by binding.
Edit
Assuming you have a System.Windows.Controls.Page named "FlyoutPage", You can add it in design time:
<!-- Flyout Grid -->
<Grid Visibility="Visible"
Background="#22000000">
<Grid x:Name="FlyoutGrid" Width="400" Height="300" Background="Black">
<Frame>
<Frame.Content>
<local:FlyoutPage/>
</Frame.Content>
</Frame>
</Grid>
</Grid>
You can add it at run time as well.
this.FlyoutGrid.Children.Clear();
this.FlyoutGrid.Children.Add(new Frame { Content = new FlyoutPage() });
If you are not bound to the default WPF controls, you could check out Material Design in XAML. This library provides a DialogHost control which does exactly what you want. For more information, please refer to the Wiki on Dialogs. The library is available as NuGet package MaterialDesignThemes.
<materialDesign:DialogHost>
<materialDesign:DialogHost.DialogContent>
<StackPanel>
<TextBlock Text="This is the dialog content."
Margin="10"/>
<Button Content="Close dialog"
Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}"/>
</StackPanel>
</materialDesign:DialogHost.DialogContent>
<Button DockPanel.Dock="Bottom"
Content="Open dialog"
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
VerticalAlignment="Bottom"/>
</materialDesign:DialogHost>
There is the regular content and a dialog content, as well as special commands for open and close.
The following Combobox in WPF project needs to always have exactly two Rectangles of heights 256 and 36 in each item respectively. And when user clicks on the dropdown button of the Combobox I would like to have it display both ComboboxItems without user having to scroll.
Question: How can we achieve it? Currently it displays only first ComboboxItem (Aqua color rectangle inside), and you have to scroll to get to see the second ComboboxItem (YellowGreen color rectangle inside). I have tried setting ScrollViewer.VerticalScrollBarVisibility="Hidden" on combo box but that makes it even worst since it does not even allow to show the second item.
XANL:
<Window x:Class="Wpf_TestApp.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:Wpf_TestApp"
mc:Ignorable="d"
Title="MainWindow" Height="569.455" Width="800">
<Grid>
<StackPanel Margin="5" Width="15">
<ComboBox DockPanel.Dock="Top" Width="25">
<DockPanel>
<ComboBoxItem DockPanel.Dock="Top">
<StackPanel Width="180" Height="260">
<Rectangle x:Name="MyRectangle" Fill="Aqua" Width="176" Height="256"/>
</StackPanel>
</ComboBoxItem>
</DockPanel>
<DockPanel>
<ComboBoxItem DockPanel.Dock="Top">
<StackPanel Width="180" Height="38">
<TextBlock Text="Second Item:" />
<Rectangle x:Name="MyOtherRectangle" Fill="YellowGreen" Width="176" Height="36"/>
</StackPanel>
</ComboBoxItem>
</DockPanel>
</ComboBox>
</StackPanel>
</Grid>
</Window>
Screenshot of the above combobox:
Display when user first clicks on dropdown of the combobox:
User has to scroll to get to the second item of the combobox:
You can use dependency property MaxDropDownHeight of ComboBox as shown below to display both combo box items in the drop down without having to scroll,
<ComboBox DockPanel.Dock="Top" Width="25" MaxDropDownHeight="Auto">
I have tested your code with 320 Height and it works perfectly fine. If you need to add more items, you can increase the MaxDropDownHeight value accordingly.
How do I copy WrapPanel?
I have window in which I have WrapPanel with some controls inside. I'd like to copy it inside my code so I would have 2 or more exact looking panels on the same window but with different names for controls.
This is how my XAML looks like:
<Window x:Class="WpfApplication1.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:WpfApplication1"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<StackPanel x:Name="stackPanel" HorizontalAlignment="Left" Height="301" Margin="10,10,0,0" VerticalAlignment="Top" Width="498">
<WrapPanel x:Name="Wrap1" Height="142" Margin="0,0,345.6,0" VerticalAlignment="Top" Width="152">
<Button x:Name="wrap1_button" Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75"/>
<Button x:Name="wrap1_button1" Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75"/>
<Label x:Name="wrap1_label" Content="Label" HorizontalAlignment="Left" VerticalAlignment="Top" Width="74"/>
</WrapPanel>
</StackPanel>
</Grid>
I would like to get another WrapPanel placed next to first one, named Wrap2 with controls inside wrap2_button, wrap2_button1, wrap2_label.
I tried inserting it in StackPanel and doing something like that:
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
WrapPanel Wrap2 = Wrap1;
stackPanel.Children.Add(Wrap2);
}
}
but it doesnt work...
In short, you will have to create another WrapPanel, add it to the StackPanel, and add children to the second WrapPanel.
Now, if your reaction is to recoil from the duplication, that is a good instinct. This may be a good use case for a UserControl which is a way to bundle groups of standard WPF controls to allow for their reuse.
What I would suggest is to create a new UserControl which is a WrapPanel with the children you have, then add 2 instances of that new UserControl to the StackPanel in your window.
Here is a link to the Remarks of the UserControl class with some of the considerations of creating your own custom controls.
In my example wpf app I've added one button and one popup to the window. The button is in the bottom right corner and the popup has set "PlacementTarget" property to it and "Placement" set to top. The popup consists of one very long textblock.
What I expect this popup will behave is not to go outside of the window and therefore automatically set his "HorizontalOffset" to the appropriate value, but the popup behaves against my intentions.
Here's my xaml file:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1" x:Name="window" x:Class="WpfApplication1.MainWindow"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<local:Converters x:Key="Converters"/>
</Window.Resources>
<Grid>
<Button x:Name="button" Content="Button" VerticalAlignment="Bottom" Width="75" HorizontalAlignment="Right"/>
<Popup Placement="Top" PlacementTarget="{Binding ElementName=button, Mode=OneWay}" IsOpen="True">
<TextBlock TextWrapping="Wrap" Text="aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" Background="White"/>
</Popup>
</Grid>
Do anyone know how to fix it?
I've read that this should be default popup behavior to take care of going out of the boundaries, but not in my case. Thanks in advance.
Have you tried to set the width of the Popup or Textblock ?
Sorry, I can't write this poor answer as a comment..
I have a simple window with a simple composite control embedded within it.
(Main Window)
<Window x:Class="TabOrder.Window1"
xmlns:local="clr-namespace:TabOrder"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Grid>
<Label HorizontalAlignment="Left" VerticalAlignment="Top">First</Label>
<TextBox TabIndex="0" HorizontalAlignment="Stretch" VerticalAlignment="Top" Margin="80,0,0,0"/>
<Label HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,30,0,0">Second</Label>
<TextBox TabIndex="1" HorizontalAlignment="Stretch" VerticalAlignment="Top" Margin="80,30,0,0"/>
<local:MyControl Margin="0,60,0,0" VerticalAlignment="Top" HorizontalAlignment="Stretch" TabIndex="2"/>
</Grid>
(Composite control)
<UserControl x:Class="TabOrder.MyControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<Label HorizontalAlignment="Left" VerticalAlignment="Top">Third</Label>
<TextBox HorizontalAlignment="Stretch" VerticalAlignment="Top" Margin="80,0,0,0"/>
<Label HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,30,0,0">Fourth</Label>
<TextBox HorizontalAlignment="Stretch" VerticalAlignment="Top" Margin="80,30,0,0"/>
</Grid>
As expected on my form I get 4 text boxes...
First
Second
Third
Fourth
But when "First" has focus and I hit tab the focus is switched to "Third". WPF seems to be seeing the tab list as a single flat list rather than as a tree where MyControl is TabIndex 3 and the text box "Third" the first tabbed control within it.
Is this a bug in WPF or is there another way of doing this? The composite control is used in many windows, it could even be used more than once on a single window.
I know this response is quite late... but have you tried:
<UserControl ... KeyboardNavigation.TabNavigation="Local">
Doing so will ensure once your UserControl has recieved focus, you will navigate only through TabStop within your UserControl (instead of worring about conflicting TabIndex values throughout your app). After looping through the TabStops of your UserControl, TabNavigation will resume to the TabStop outside of it.
http://msdn.microsoft.com/en-us/library/system.windows.input.keyboardnavigationmode.aspx