listbox focusing works totally wrong with shortcuts - c#

When I tab into a ListBox control, the first item gets focused. When I have a label and set the target property to the ListBox (as shown in the code below) and then use the dedicated Alt shortcut then it will focus not the first item but the listbox itself (listbox border becomes dotted). What is the best way to avoid this unwanted behavior? Is there a way to disable focusing on the listbox itself and only allow focusing on the items?
Example code:
<Label Content="_Label" Margin="0,10,0,88" Name="MyLabel" Target="{Binding ElementName=MyListBox}" Height="Auto" />
<ListBox Width="100" Name="MyListBox" Margin="46,0,639,0" />
Behavior:

By setting Target you explicitly asked focus to move to listBox. In case you want to put it on first listBox item, you have to do it manually.
One way would be to hook GotFocus event and set focus to next available item using TravelRequest object which wil put it on first listBox item.
XAML:
<ListBox Width="100" Name="MyListBox" Margin="46,0,639,0"
GotFocus="MyListBox_GotFocus"/>
Code behind:
private void MyListBox_GotFocus(object sender, RoutedEventArgs e)
{
if (e.OriginalSource == sender)
{
TraversalRequest request = new TraversalRequest(FocusNavigationDirection.Next);
MyListBox.MoveFocus(request);
}
}

Related

TabControl SelectedContent not returning the current selected TabItem content

Currently I have a TabControl with several TabItems. Each TabItem has a DataGrid inside. I wanted to format these DataGrids (cell colors, column widths, etc) all at once but I found I can't because all the DataGrids from the hidden tabs would return null properties. In this case, I tried to make a work around where I would select programmatically (or manually with the mouse) the tabs before formatting the DataGrid. But now I'm up against a "strange" behavior:
private void LeftTabs_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
Console.WriteLine(LeftTabs.SelectedIndex);
var currentDataGrid = (DataGrid)LeftTabs.SelectedContent;
Console.WriteLine(currentDataGrid.Name);
}
The selected index returns the correct tab index, but the content it's not updated.
Let's say Tab 1 is selected and then I click on Tab 2. It returns me the Tab 2 index and the Tab 1 DataGrid name.
This behavior prevents me from editing the select tab's DataGrid because even if I try to access it directly by it's object, all the properties return null.
This is the TabControl, item and DataGrids XAML code:
<TabControl Name="LeftTabs" Margin="0,0,0,0" Grid.Column="0" Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" SelectionChanged="LeftTabs_SelectionChanged">
<TabItem>
<TabItem.Header>Conditions</TabItem.Header>
<DataGrid x:Name="DataGrid_Conditions" SelectedCellsChanged="DataGrid_Conditions_SelectedCellsChanged" ColumnWidth="80" ItemsSource="{Binding}" HorizontalAlignment="Stretch" VerticalAlignment="Top" SelectionChanged="ConditionsSelected" />
</TabItem>
<TabItem>
<TabItem.Header>Signals</TabItem.Header>
<DataGrid x:Name="DataGrid_Signals" ColumnWidth="80" ItemsSource="{Binding}" HorizontalAlignment="Stretch" VerticalAlignment="Top" SelectionChanged="SignalsSelected" />
</TabItem>
</TabControl>
EDIT:
To be more clear I'll minimize the scenario.
TabItem1 - Has DataGrid_Conditions inside;
TabItem2 - Has DataGrid_Signals inside.
Here is another code that I try to run when I manually or programmatically select a tab:
DataGridRow Row = (DataGridRow)DataGrid_Signals.ItemContainerGenerator.ContainerFromIndex(ID);
What happens is, If I click on tab2 this code doesn't for tab2's Grid. Instead it works for the previous tab(1) Grid.
The LeftTabs.SelectedContent is the only property not being updated.
I can't seem to reproduce your issue. "DataGrid_Signals" should be printed out when you selecte the second tab. You may also get a reference to the currently selected TabItem from the SelectionChangedEventArgs:
private void LeftTabs_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
Debug.WriteLine(LeftTabs.SelectedIndex);
TabItem tabItem = e.AddedItems[0] as TabItem;
var currentDataGrid = (DataGrid)tabItem.Content;
Debug.WriteLine(currentDataGrid.Name);
}
In this example despite it indeed printing "DataGrid_Signals" when I try to get anything from the grid's object, it just comes null as it was in a hidden.
This is because it has not yet been loaded. You can force it to render by measure and arrange it:
private void LeftTabs_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (IsLoaded)
{
TabItem tabItem = e.AddedItems[0] as TabItem;
var currentDataGrid = (DataGrid)tabItem.Content;
currentDataGrid.Measure(new Size(currentDataGrid.ActualWidth, currentDataGrid.ActualHeight));
currentDataGrid.Arrange(new Rect(0, 0, currentDataGrid.ActualWidth, currentDataGrid.ActualHeight));
//...
}
}
This is a bug, fixed in .NET 4.7.1 but quirked so that apps targeting 4.7 or below still get the old behavior. See the breaking change announcement for details.

GridView in UWP

I are facing issue with GridView Control. We had a working Windows Store App on 8.1 where GridView left and right mouse clicks had different functionality. In the case of left mouse click, we used to use “ItemClick” event which performs navigation to another XAML page. On right click of GridItem, it gets selected and shows the appbar, we have used “SelectionChanged” event for this.
We are now migrating our existing windows store app to UWP Application, we have used same gridView Code, we find significant difference in functionality and look & feel, we don’t see GridView Item Selected like above picture. We see “ItemClick” and “SelectionChanged” are working together. The flow is something like that on left click on the item, the control goes to SelectionChanged event and then ItemClick. We were not able to differentiate actions like Left Mouse Click and Right Mouse click, since both events are getting fired up upon clicking on left click/tapping. We have different functionality on left and right clicks of mouse.
Need help on how to mimic windows 8.1 functionality in UWP.
My requirement was the I wanted to use Right Click/Long Tapped to select an item and take an action accordingly from App Bar Buttons and on Left Click/Tap should redirect me to the next XAML Page. The problem I was facing was the on Right Click, I wasnt able to detect that which items of GridView has been clicked and how can I add that into SelectedItem.
What I did was, I introduced extra Grid in DataTemplate of GridView. Within this Grid, I added RightTapped event.
The sample code snippet is
<GridView x:Name="ItemGridView"
ItemsSource="{Binding Source={StaticResource ItemsViewSource}}"
IsItemClickEnabled="True"
SelectionMode="Single" ItemClick="ItemGridView_ItemClick"
SelectionChanged="ItemGridView_SelectionChanged">
<GridView.ItemTemplate>
<DataTemplate>
<Grid RightTapped="Grid_RightTapped">
<Border Background="White" BorderThickness="0" Width="210" Height="85">
<TextBlock Text="{Binding FileName}" />
</Border>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
The event name is Grid_RightTapped. This helped me detect that from which GridViewItem, I got the long tap/right click.
The code-behind for this is:
private void Grid_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
Song selectedItem = (sender as Grid).DataContext as Song;
//the above line will get the exact GridViewItem where the User Clicked
this.ItemGridView.SelectedItem = selectedItem;
//the above line will add the item into SelectedItem and hence, I can take any action after this which I require
}
}
The reason we are doing this way is, because now we can add clicked item into the GridView SelectedItem using Right Click. Now in UWP, clicked items are added into SelectedItem using left click only. And with left click, I can navigate to another page using ItemClick event.
You are correct, there has been a change in the interaction model behavior. According to MSDN article How to change the interaction mode (XAML)
For selection, set IsItemClickEnabled to false and SelectionMode to
any value except ListViewSelectionMode.None and handle the
SelectionChanged event (ItemClick is not raised in this case).
For invoke, set IsItemClickEnabled to true and SelectionMode to
ListViewSelectionMode.None and handle the ItemClick event
(SelectionChanged is not raised in this case).
Another combination is to set IsItemClickEnabled to false and
SelectionMode to ListViewSelectionMode.None. This is the read-only
configuration.
A final configuration, which is used least often, is to set
IsItemClickEnabled to true and SelectionMode to any value except
ListViewSelectionMode.None. In this configuration first ItemClick is
raised and then SelectionChanged is raised.
You seem to be using the last option - IsItemClickEnabled is set to true and SelectionMode is set to something that's not None. According the Microsoft, this is used least often so maybe it would be a good idea to rethink this design?
Since you haven't shared any code that you already tried, I will just throw in one idea: maybe playing around with Tappedand RightTapped event handlers could help you differentiate between the two more easily?
To identify left and right click, for right click you can use RightTapped event
<GridView x:Name="categoryItemsGV"
Margin="5,5,0,0"
IsItemClickEnabled="True"
ItemClick="categoryItemsGV_ItemClick"
IsRightTapEnabled="True"
RightTapped="categoryItemsGV_RightTapped"
SelectionMode="Single"
SizeChanged="categoryItemsGV_SizeChanged"
ItemsSource="{Binding}">
and .cs code is below:
private void categoryItemsGV_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
var tablemod = (sender as GridView).SelectedItem;
}
From RightTapped the item over which the mouse was right clicked can be obtained from e.OriginalSource
<GridView x:Name="myGridView" VerticalAlignment="Center">
<GridView.ContextFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Reset"/>
<MenuFlyoutSeparator/>
<MenuFlyoutItem Text="Repeat"/>
<MenuFlyoutItem Text="Shuffle"/>
</MenuFlyout>
</GridView.ContextFlyout>
</GridView>
Private Sub myGridView_RightTapped(sender As Object, e As RightTappedRoutedEventArgs) Handles myGridView.RightTapped
myGridView.SelectedItem = e.OriginalSource
End Sub
Now that RightClick has selected the desired item, further action like delete, copy can be executed on it.

TabItem OnSelectionChanged() setting focus on inner control (WPF)

I have two TabItem's contained inside a TabControl.
Each TabItem contains serveral TextBox's.
When TabControl's OnSelectionChanged event is fired, as well as selecting the new TabItem, it is also setting focus on the first TextBox contained inside the newly selected item.
Is there any way to prevent this from happening?
Setting IsTabStop="False" on the TextBox will achieve this, but unfortunately also prevents the TextBox from being 'tabbed' into.
In your tab control, handle the focus event for each of the tabs like this:
<TabItem GotFocus="TabItem_OnGotFocus">
Then just remove focus using:
private void TabItem_OnGotFocus(object sender, RoutedEventArgs e)
{
Keyboard.ClearFocus();
}
Just add a container to your content as Grid, Stackpanel, Border, etc. and set it Focusable. When Tab selection change, the focus is set to the container and you can also use the tab key.
<TabItem Header="myHeader">
<StackPanel Focusable="True">
...
</StackPanel>
</TabItem>
#shannon it answers to your question about MVVM

Disable the drop down menu of a WPF ComboBox

I have a ComboBox as specified below:
<ComboBox Height="31" Margin="7,7,0,0" Name="callerID" IsEditable="True" Background="LightBlue" KeyDown="callerIDbar_KeyDown" Foreground="White" FontSize="17" FontWeight="Bold" HorizontalContentAlignment="Center" VerticalAlignment="Top" Grid.Row="0" Grid.Column="0" />
storedCalls is a collection of phone numbers that will be populated to the ComboBox.Items:
foreach (string call in storedCalls)
{
if (call != "Enter a number to dial")
callerID.Items.Add(call);
}
All this works fine. I populate the Items primary because I like the autocomplete that is driven by the values in the ComboBox's Items collections. Is there a way the XAML to disable the drop down error, and disable the drop down menu? I.e. make a simple auto complete textbox like control?
I have seen full on TextBox controls that include a bunch of code-behind and complicated markup, and this is not what I am looking to do. I just need to disable the ability of the drop down menu from showing.
You can handle the DropDownOpened event and then close it.
So in n the XAML you get:
<ComboBox x:Name="cb" DropDownOpened="cb_DropDownOpened"/>
And in Code Behind:
private void cbCategoria_DropDownOpened(object sender, EventArgs e)
{
ComboBox cb = sender as ComboBox;
cb.IsDropDownOpen = false;
}
I prefear this solution reather than set MaxDropDownHeight to 0.
Your choice.

How to keep WPF TextBox selection when not focused?

I want to show a selection in a WPF TextBox even when it's not in focus. How can I do this?
I have used this solution for a RichTextBox, but I assume it will also work for a standard text box. Basically, you need to handle the LostFocus event and mark it as handled.
protected void MyTextBox_LostFocus(object sender, RoutedEventArgs e)
{
// When the RichTextBox loses focus the user can no longer see the selection.
// This is a hack to make the RichTextBox think it did not lose focus.
e.Handled = true;
}
The TextBox will not realize it lost the focus and will still show the highlighted selection.
I'm not using data binding in this case, so it may be possible that this will mess up the two way binding. You may have to force binding in your LostFocus event handler. Something like this:
Binding binding = BindingOperations.GetBinding(this, TextProperty);
if (binding.UpdateSourceTrigger == UpdateSourceTrigger.Default ||
binding.UpdateSourceTrigger == UpdateSourceTrigger.LostFocus)
{
BindingOperations.GetBindingExpression(this, TextProperty).UpdateSource();
}
Another option is to define a separate focus scope in XAML to maintain the selection in the first TextBox.
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBox Grid.Row="0" Text="Text that does not loose selection."/>
<StackPanel Grid.Row="1" FocusManager.IsFocusScope="True">
<TextBox Text="Some more text here." />
<Button Content="Run" />
<Button Content="Review" />
</StackPanel>
</Grid>
TextBoxBase.IsInactiveSelectionHighlightEnabled Property has available since .NET Framework 4.5
public bool IsInactiveSelectionHighlightEnabled { get; set; }
public class CustomRichTextBox : RichTextBox
{
protected override void OnLostFocus(RoutedEventArgs e)
{
}
}
I found that the suggestions listed (add a LostFocus handler, defining a FocusScope) to not work, but I did come across the code listed here: http://naracea.com/2011/06/26/selection-highlight-and-focus-on-wpf-textbox/, which creates a custom Adorner that highlights the text when not focused.

Categories