So I am completely stuck. All i am trying to do is add a button outside a grid.
I am getting the error "The property 'Content' can only be set once.
I am trying to make a minesweeper game, which ofcourse contains a grid. And additional features such as restarting.
I have tried adding a stackpanel(and various other containers) around both the grid and the button ,then the content error goes away and i get a new error...
"An unhandled exception of type 'System.ArgumentException' occurred in PresentationCore.dll
Additional information: Must disconnect specified child from current parent Visual before attaching to new parent Visual."
I just need to know which container to use to have a button and potentially other components above the grid.
<Window x:Class="MineSweeper.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:MineSweeper"
mc:Ignorable="d"
Title="MineSweeper" Height="500" Width="525">
<Grid Name="oGrid" HorizontalAlignment="Left" Height="100" Margin="200,75,0,0" VerticalAlignment="Top" Width="100" Background="Transparent" PreviewMouseLeftButtonDown="oGrid_PreviewMouseLeftButtonDown"
PreviewMouseRightButtonDown="oGrid_PreviewMouseRightButtonDown">
</Grid>
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Canvas.Left="200" Canvas.Top="10"/>
Here is what i tried with stackpanel
<StackPanel>
<Grid Name="oGrid" HorizontalAlignment="Left" Height="100" Margin="200,75,0,0" VerticalAlignment="Top" Width="100" Background="Transparent" PreviewMouseLeftButtonDown="oGrid_PreviewMouseLeftButtonDown"
PreviewMouseRightButtonDown="oGrid_PreviewMouseRightButtonDown">
</Grid>
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Canvas.Left="200" Canvas.Top="10"/>
</StackPanel>
Your Problem is this: A window can only have 1 Content.
If you want to add multiple controls into a window you will Need to put them in some Kind of Container, like stackpanel or grid - So If you dont want it to be in your 'oGrid' you should place another Container around it.
<StackPanel>
<Grid Name="oGrid" HorizontalAlignment="Left" Height="100" Margin="200,75,0,0" VerticalAlignment="Top" Width="100" Background="Transparent" PreviewMouseLeftButtonDown="oGrid_PreviewMouseLeftButtonDown"
PreviewMouseRightButtonDown="oGrid_PreviewMouseRightButtonDown">
</Grid>
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Canvas.Left="200" Canvas.Top="10"/>
</StackPanel>
Edit: you just changed your Question... please post the code you tried with the Stackpanel e.g.
Related
I want to build a "gaze enabled" app, where most controls could be activated just using one's gaze.
Doing that with a button is pretty easy. Just add gaze:GazeInteraction.Interaction = Enable to the button in XAML and when I dwell at it it's as if I've clicked on it with the cursor.
But it doesn't work with a TextBox that way. Maybe I should do something from code-behind?
I'm still a beginner with C# and I've already read this, but I coldn't understand it well, so I used that instead.
Here's my code so far:
<Page
x:Class="gazebox.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:gazebox"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:gaze="using:Microsoft.Toolkit.Uwp.Input.GazeInteraction"
Width="500" Height="250">
<Grid Background="#FF1A3163" VerticalAlignment="Stretch">
<Button Content="Exit" HorizontalAlignment="Right" Margin="0,0,25,0" Height="100" Width="100" Background="#66E8E5E5" gaze:GazeInput.Interaction="Enabled"/>
<TextBox x:Name="textBox" Text="" TextWrapping="Wrap" HorizontalAlignment="Left" VerticalAlignment="Top" Height="50" Width="200" Margin="25,150,0,0" gaze:GazeInput.Interaction="Enabled"/>
<TextBox x:Name="textBox2" Text="" TextWrapping="Wrap" HorizontalAlignment="Left" VerticalAlignment="Top" Height="50" Width="200" Margin="25,50,0,0"/>
</Grid>
</Page>
and my .cs file is pretty much empty yet.
So, how do I make the TextBox(or any other element for that matter) be clicked when I dwell at it?
Any help would be greatly appreciated.
Pavel
p.s. I have a Tobii eye tracker
I'm just new and messing around with the WPF C#.
I noticed that the design view and have some minor differences. Most noticeable at the button.
Design View:
Ouput # 1:
Ouput # 2:
It seems that the window/container is resizing/shrinking even when both min and max width's and height's were set with fixed values and resize mode is set to NoResize.
I could easily deal with some of the controls by setting up the vertical and horizontal alignments since the adjustments are not too noticeable, but for the Add button the differences are noticeable from the supposed output.
I did try setting the min size of the button so that it would not be affected by the resizing and there would still be space for the margins but the button properly renders only a part of it. (please see output 1)
The only compromise that I could is to set both vertical and horizontal alignment to stretch and not put any size constraints on the button but the button would end up shrinking from its original size. (please see output 2)
Here's the XAML for the window.
<Window x:Class="Game_Viewer.NewApp"
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:Game_Viewer"
mc:Ignorable="d"
Title="Add New Program" Height="155" Width="250" ResizeMode="NoResize" Background="#FF515151" WindowStyle="ToolWindow" WindowStartupLocation="CenterScreen" MinHeight="155" MinWidth="250">
<Grid Margin="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0*"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
</Grid.RowDefinitions>
<Image x:Name="appicon_img" Margin="10,10,0,0" Source="Resources/menu_bg.png" Stretch="Fill" Height="35" VerticalAlignment="Top" HorizontalAlignment="Left" Width="35" Grid.ColumnSpan="2"/>
<TextBox x:Name="apppath_txtbox" HorizontalAlignment="Left" Margin="10,55,0,0" Width="154" Foreground="White" Background="#FF6E6E6E" Text="Program Path" VerticalContentAlignment="Center" BorderBrush="#FF707070" MaxLines="1" Height="25" VerticalAlignment="Top" FontSize="10" Grid.ColumnSpan="2"/>
<Button Content="Search" Margin="169,55,10,0" Click="BrowseApp_Click" Foreground="White" Background="#FF515151" FontWeight="Medium" Height="25" VerticalAlignment="Top" FontSize="10" Grid.ColumnSpan="2"/>
<Button x:Name="add_btn" Content="Add Program" Margin="72,89,72,8" Foreground="White" Background="#FF515151" Click="AddProgram_Click" FontWeight="Medium" Grid.ColumnSpan="2" MinHeight="30" MinWidth="100"/>
<TextBox x:Name="appname_txtbox" Margin="50,10,10,0" TextWrapping="WrapWithOverflow" Foreground="White" Text="Program Name" MaxLines="1" IsUndoEnabled="True" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" BorderBrush="#FF707070" FontWeight="Medium" Background="#FF6E6E6E" Height="35" VerticalAlignment="Top" Grid.ColumnSpan="2"/>
</Grid>
</Window>
I would like to know a solution or round-about for this kind of issue.
It's not really a problem having this issue as it is only aesthetic but I would at least know the reason why this is happening. And could you refer me to good tutorials for wpf using c#.
Thanks in advance and have a wonderful day!
I took this example of making round glass buttons and make a User Control from it with minimum influence. Third button is my from User Control, all others - original from the example: (sorry, reputation not enough to put images in comfortable way)
But just after I add image to Control I see
Image is added the same way as to second button
<Button Style="{StaticResource GlassButton}" Width="50" Height="50" Background="#FF1D5BBA" Margin="10">
<Image Width="40" Height="35" Source="images\vista_flag.png"/>
</Button>
<GlassButtonControl:GlassButton Width="70" Height="70" Margin="0">
<Image Width="40" Height="35" Source="images\vista_flag.png"/>
</GlassButtonControl:GlassButton>
Full solution
What am I doing wrong?
EDIT1 -> EDIT3
EDIT2:
as Peter Duniho sujested, minimal code for reproduce case
UserControl project's XAML. Button with colored background:
<UserControl x:Class="GreenButtonControl.GreenButton"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:GreenButtonControl"
mc:Ignorable="d"
d:DesignHeight="400" d:DesignWidth="400">
<Grid>
<Button Width="50" Height="50" Background="Green" Margin="10"/>
</Grid>
</UserControl>
UserControl project's C#:
using System.Windows.Controls;
namespace GreenButtonControl
{
public partial class GreenButton : UserControl
{
public GreenButton()
{
InitializeComponent();
}
}
}
Window XAML (image itself should be changed to any existsing with transparency):
<GreenButtonControl:GreenButton Width="50" Height="50">
<Image Width="40" Height="40" Source="images\vista_flag.png"/>
</GreenButtonControl:GreenButton>
The problem is that UserControl disapear and Window backround is shown under the transparent image.
EDIT3:
Solutions I found for now to avoid such a behaviour:
Place Image in UserControl code and make parameter to set it from Window code.
Place image not inside a control, but over it:
<Grid Width="70" Height="70">
<GlassButtonControl:GlassButton/>
<Image Width="40" Height="40" Source="images\vista_flag.png"/>
</Grid>
But that's bring new problems to catch triggers "MouseOver" and others...
Place UserControl in container and make Image transparent to Mouse events
<Grid Width="50" Height="50">
<GreenButtonControl:GreenButton Width="Auto" Height="Auto"/>
<Image Width="40" Height="40" IsHitTestVisible="False" Source="images\vista_flag.png"/>
</Grid>
That's perfect decision for required behaviour for now
But the question still is. Why any internal Element makes UserControl invisible?
Consider the below WPF -
The issue is the text that appears in the label is being cut off if it is longer than the width of the label.
XAML - label name is 'factTxt'
<Window x:Name="mainScreen" x:Class="FactsOnAll.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:FactsOnAll"
mc:Ignorable="d"
Title="Random Facts" Height="450" Width="800" Icon="Properties/checklist.png">
<Grid>
<Button x:Name="getFactBtn" Content="Get Random Fact" HorizontalAlignment="Left" Margin="304,331,0,0" VerticalAlignment="Top" Width="177" Click="getFactBtn_Click" FontSize="20" Background="#FF8ECF87" Foreground="#FF444444"/>
<Label x:Name="factTxt" Content="" Margin="10,98,10,0" VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="20"/>
<Label x:Name="titleTxt" Content="Random Facts" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="772" Height="46" FontSize="24"/>
</Grid>
</Window>
Expect result
Allow the text to go to a new line. I thought increasing the height of the label would fix this but no luck.
The Label has no wrapping but a TextBlock.
You can just create custom content like, that will wrap automatically:
<Label Width="100">
<TextBlock Text="Get Random Fact" TextWrapping="Wrap"/>
</Label>
I'm splitting my GUI in few xaml files using resources. For the toolbar I have a xaml file (Resources/MainWindowToolbar.xaml):
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Resources="http://cansniff.com/resources">
<ToolBar DataContext="{StaticResource MainWindowViewModel}" x:Key="MainWindowToolbar"
Background="Transparent"
VerticalAlignment="Center"
DockPanel.Dock="Left"
HorizontalAlignment="Left"
Margin="8,0,0,0">
<Grid HorizontalAlignment="Left" Height="32" Margin="10,0,-2,-1" VerticalAlignment="Top" Width="356">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="170*"/>
<ColumnDefinition Width="173*"/>
</Grid.ColumnDefinitions>
<Label Content="Device:" HorizontalAlignment="Left" VerticalAlignment="Top" RenderTransformOrigin="0.521,-0.346"/>
<ComboBox x:Name="cboxDevices" HorizontalAlignment="Left" Margin="53,4,0,0" VerticalAlignment="Top" Width="167" Grid.ColumnSpan="2"/>
<Button x:Name="btnConnect" Content="Connect" HorizontalAlignment="Right" Margin="0,4,0,0" VerticalAlignment="Top" Width="68" Grid.Column="1" Command="{Binding ConnectDeviceCommand}"/>
<Button x:Name="btnRefresh" Content="Refresh" Grid.Column="1" HorizontalAlignment="Left" Margin="49,4,0,0" VerticalAlignment="Top" Width="58" Command="{Binding RefreshDevicesCommand}"/>
</Grid>
</ToolBar>
</ResourceDictionary>
Then in my window (MainWindow.xaml) I just merge resources:
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources/MainWindowMenus.xaml" />
<ResourceDictionary Source="Resources/MainWindowToolbar.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
How can I get an instance of control in my code (MainWindow.xaml.cs)?
I'm gonna answer your question, and then I'm gonna tell you why it won't work :P
To fetch an object you've declared as a Resource, you do it as follows:
ToolBar toolBar = FindResource("MainWindowToolbar") as ToolBar;
But... This probably won't work for what you're trying to do. An instance of a Control can only have one visual parent. In most cases, trying to reuse that instance for several views would either throw an exception, or result in weird behaviors.
The correct way to do this is using UserControls, or Styles and Templates. The easiest way would be creating a UserControl with your ToolBar inside, and then adding that UserControl to every view you want it to have it.