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
Related
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.
how to set focus on this when i log in to my application ,when log in window will open i want to type the password on this without using mouse
<PasswordBox x:Name="passwordbox" Grid.Row="1" Grid.Column="1" Margin="5,35,5,5" Width="280" Height="27" app:PasswordBoxAssistant.BindPassword="true" app:PasswordBoxAssistant.BoundPassword="{Binding TechUserModel.UserId,Mode=TwoWay,ValidatesOnDataErrors=True,UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Left" VerticalAlignment="Center">
I have tried various solutions for this scenario and the most effective that I have found is using FocusManager.FocusedElement:
<Window x:Class="StackOverflow.Test"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Test" Height="300" Width="300"
FocusManager.FocusedElement="{Binding ElementName=Box}">
<Grid>
<TextBox x:Name="Box"/>
</Grid>
</Window>
SOLUTION:
passwordbox.Focus();
or in .xaml file include the following in the element as its attributes.
FocusManager.FocusedElement="{Binding ElementName=passwordbox}">
NOTE:
If you want to decide which control to give focus to when the form first appears, put the code in the Loaded event.
Loaded += (o, e) => {
passwordbox.Focus();
};
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>
I have a popup that opens on the MainPage with a couple of textboxes. When ever you focus on the lower textbox the keyboard obscures it from view. Usually the textboxes slide into view. i don't know why that is not happening here.
please help!
<UserControl x:Class="Controls.EditControl"
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:SampleData="clr-namespace:SampleData"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Height="800" Width="480"
d:DataContext="{d:DesignData ../SampleData/sampleEditPopup.xaml}">
<Grid x:Name="LayoutRoot" Background="#FF000000" Opacity="0.995">
<StackPanel Margin="0,20,0,0" Orientation="Horizontal" VerticalAlignment="Top">
<TextBlock TextWrapping="Wrap" Text="Name" HorizontalAlignment="Left" Height="26" Margin="15,10,0,10" Width="110" TextAlignment="Right"/>
<TextBox x:Name="tb_name"
TextWrapping="Wrap"
Width="340" Height="75"
Margin="10,13,15,12"
InputScope="Text" MaxLength="1000"
Text="{Binding Title, Mode=TwoWay}"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="0,150,0,0" VerticalAlignment="Top">
<TextBlock TextWrapping="Wrap" Text="Description" HorizontalAlignment="Left" Height="26" Margin="15,40,0,10" Width="110" VerticalAlignment="Top" TextAlignment="Right"/>
<TextBox x:Name="tb_description"
TextWrapping="Wrap"
Width="340" Height="254"
Margin="10,13,15,12"
InputScope="Text" MaxLength="1000"
Text="{Binding Description, Mode=TwoWay}"/>
</StackPanel>
</Grid>
and here is the code to open it:
EditControl ec = new EditControl();
ec.Title = cm.Title;
ec.Description = cm.Description;
//sets appbar icons for accepting values
setEditIcons();
Popup edit = new Popup() { Child = ec, Tag = this };
edit.Closed += new EventHandler(edit_Closed);
edit.IsOpen = true;
from a UX perspective I'd heavily recommend against having any partial popup/overlay that has more than 1 or 2 buttons. It's just not done in WP7. If you have a form you'd like folks to fill out move it to its own page. Either by letting the user navigate to that page, or by introducing a new transient page (that cannot be navigated back into) prior to the current page.
You'll have more problems than just the on-screen keyboard in with form overlays. You'll need to change the AppBar to have "V" and "X" buttons for any data entry, you'll need to manage focus not slipping back into under the overlay/popup, you'll need to make sure the "back" button closes the popup, etc.
IMO The best approach is a simple and consistent UX.