Is it possible to override the response to a touch interaction for a control in UWP? For example, for a DataGrid XAML control, the default behavior when a row is tapped is to select this row and deselect all other selected rows. Can this be changed to have the tapped row added to the selection as if the control key was pressed?
EDIT: My solution is for Surface Pro in tablet mode so the user would only interact with the app via touch. So I wanted him to be able to select multiple items using touch only. In the image I added, the default behavior if the user clicks on "Chicken Sandwich" is to deselect "Burger" and select "Chicken Sandwich" unless the CTRL key is held down. However using the CTRL key on Surface device without mouse and keyboard would mean that we will need to have the on-screen keyboard on display which would be a bit cumbersome. I would like instead to change the default behavior where if the user clicks on an unselected item it's added to the selection, and if he clicks on a selected item the item it gets removed from selection (in the example below, "Chicken Sandwich" will be added to the selection on first touch and removed from selection on second tap), so basically same functionality as holding the CTRL key down but without using it.
Based on the document, the DataGrid class provides the behavior that selecting multiple items while holding down the SHIFT or CTRL keys during selection. What you need to do is just to set the SelectionMode property as Extended.
Update:
Please check the following code as a sample:
List<object> selectedItems = new List<object>();
bool flag = false;
private void dataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if(flag==false)
{
var item = dataGrid.SelectedItem;
if (selectedItems.Contains(item))
{
selectedItems.Remove(item);
}
else
{
selectedItems.Add(item);
}
flag = true;
dataGrid.SelectedItems.Clear();
foreach(var cur in selectedItems)
{
flag = true;
dataGrid.SelectedItems.Add(cur);
}
}
else
{
flag = false;
}
}
Related
How can I toggle the checkbox of an item in a CheckedListbox if CheckOnClick is True, but SelectionMode is None..?
If I set SelectionMode to One it works as expected, but I would like to prevent items in the list from being selected. The only purpose of the CheckedListbox is to use the checkboxes; having items selected is not desired.
I tried a bit of code with the various Click and Mouse events, but none of them seem to report the item in the list that was clicked. If I could determine that, it would be a simple matter to toggle the checkbox of the clicked item.
The MouseClick event will tell you when the control was clicked and where. Determine whether the click was on an item and which one, then toggle it:
Private Sub CheckedListBox1_MouseClick(sender As Object, e As MouseEventArgs) Handles CheckedListBox1.MouseClick
Dim clickedIndex = CheckedListBox1.IndexFromPoint(e.X, e.Y)
If clickedIndex <> ListBox.NoMatches Then
CheckedListBox1.SetItemChecked(clickedIndex, Not CheckedListBox1.GetItemChecked(clickedIndex))
End If
End Sub
After a little testing, I would say that you need to consider “how” you want to achieve the non-selection mode you describe. As you have noted, if you set the CheckedListBoxes SelectionMode to None… then basically the check boxes become unusable.
The user cannot check or un-check any check box, as you already know… and this is why you want “your” code to change the check boxes checked state. So, you have now inherited the job of changing the check boxes check state because you set its “SelectionMode” to “None" … ? …
In addition, when the selection mode is set to “None” … then many “typical” properties of the CheckedListBox will lose functionality and become useless. Example, the checked list boxes SelectedItem property will always be null and its SelectedIndex property will most likely always be -1. Meaning, most “selection” type events will need to find what item was clicked by using the mouse location as shown in another answer.
The main point here is that when you decided to set the checked list boxes selection mode to “None”, then you basically open the door for more coding/responsibility on your part as far as “managing” the checked list box. I am just saying that the out-of-the-box .Net CheckedListBox is not feature rich and is a basic control. I am guessing there “may” be a third-party CheckedListBox Control that may have this “non-selected” functionality built-in.
So… I suggest another approach… however… it also has some drawbacks… basically you have to create a new Class MyCheckedListBox type “Control” that inherits from the CheckedListBox and then override its draw method to paint the cell the way we want.
I tend to avoid creating new controls. However, this will allow us to “keep” the CheckedListBoxes “selection functionality” by keeping its SelectionMode set to One. In addition to removing the job of “your” code having to manage each check box’s check state… we can also use all the checked list boxes “selection” events and use them as we typically would using the list boxes “selection” properties.
Below is a crude example of how to override the CheckedListBox’s Draw method to keep the “selected” items back color to the same color of the non-selected items.
class CheckedListBox_NoSelect : CheckedListBox {
protected override void OnDrawItem(DrawItemEventArgs e) {
DrawItemEventArgs new_e_Args = new DrawItemEventArgs
(e.Graphics,
e.Font,
new Rectangle(e.Bounds.Location, e.Bounds.Size),
e.Index,
(e.State & DrawItemState.Focus) == DrawItemState.Focus ? DrawItemState.Focus : DrawItemState.None,
this.ForeColor,
this.BackColor);
base.OnDrawItem(new_e_Args);
}
}
The code above is a simplified version of this SO question… How change the color of SelectedItem in CheckedListBox in WindowsForms? …
As I started, you will have to decide which approach you need. I may tend to go the route of #user18387401‘s answer … simply to avoid creating a new User Control. However, if you want this functionality for all the CheckedListBoxes, then creating the control may be a better approach.
Below is a full example of what is described above.
The CheckedListBox on the left is a regular CheckedListBox and uses the approach from user18387401‘s answer. The CheckedListBox on the right is our new control class CheckedListBox_NoSelect above.
For each control, the SelectedIndexChanged event is wired up to demonstrate that the checked list box on the left with its SelectionMode set to None will always have its SelectedItem set to null and its SelectedIndex will always be set to -1. However, it is not difficult to figure out “which” item was selected using user18387401‘s approach. This index is also displayed in its SelectedIndexChanged event.
private void Form1_Load(object sender, EventArgs e) {
checkedListBox1.SelectionMode = SelectionMode.None;
checkedListBox1.Items.Add("Item 1");
checkedListBox1.Items.Add("Item 2");
checkedListBox1.Items.Add("Item 3");
checkedListBox1.Items.Add("Item 4");
checkedListBox1.Items.Add("Item 5");
checkedListBox1.CheckOnClick = true;
// Leave default selection mode to "One"
checkedListBox_NoSelect1.Items.Add("Item 1");
checkedListBox_NoSelect1.Items.Add("Item 2");
checkedListBox_NoSelect1.Items.Add("Item 3");
checkedListBox_NoSelect1.Items.Add("Item 4");
checkedListBox_NoSelect1.Items.Add("Item 5");
checkedListBox_NoSelect1.CheckOnClick = true;
}
private void checkedListBox1_MouseClick(object sender, MouseEventArgs e) {
int clickedIndex = checkedListBox1.IndexFromPoint(e.X, e.Y);
if (clickedIndex != -1) {
checkedListBox1.SetItemChecked(clickedIndex, !checkedListBox1.GetItemChecked(clickedIndex));
Debug.WriteLine("LEFT: MouseClick Selected Index: " + clickedIndex);
}
}
private void checkedListBox1_SelectedIndexChanged(object sender, EventArgs e) {
Debug.WriteLine(" LEFT -> Item: " + (checkedListBox1.SelectedItem == null ? "Null" : checkedListBox1.SelectedItem));
Debug.WriteLine(" LEFT -> Index: " + checkedListBox1.SelectedIndex);
}
private void checkedListBox_NoSelect1_SelectedIndexChanged(object sender, EventArgs e) {
Debug.WriteLine("RIGHT -> Item: " + (checkedListBox_NoSelect1.SelectedItem == null ? "Null" : checkedListBox_NoSelect1.SelectedItem));
Debug.WriteLine("RIGHT -> Index: " + checkedListBox_NoSelect1.SelectedIndex);
}
I hope this makes sense and helps. Sorry that I did this in C#. If you can not convert the code to a VB version, then let me know and I will add a VB version.
I have a pair of ComboBox controls having IsEditable() true as well as false.
When I am scrolling through my application or moving my application window (by clicking on the title bar) with list popup open, I would like to close the ComboBox list popup as otherwise there would be a weird delay in aligning the list correctly below the control.
Is this possible in UWP with WinRT/C++? If so, kindly suggest how to.
I did an investigation to find if any events are there to handle in such a scenario when ComboBox control is essentially displaced from initial position while moving the app window/scrolling the app, but couldn't find any help.
Edit: Adding ComboBox image from XAML Controls Gallery to demonstrate the behaviour. In case if IsEditable set as true, when popup is opened and application is scrolled then popup goes outside the window. Instead I would like to dismiss the popup itself. However, if IsEditable is set as false then we cannot scroll until the popup is dismissed.
Update: The code I tested for PointerWheelChanged
void CBFile2022X::OnPointerWheelChangedHandler( Windows::Foundation::IInspectable const& sender,
Windows::UI::Xaml::Input::PointerRoutedEventArgs const& eventargs )
{
OutputDebugString( L"PointerWheelChanged" );
if( ComboBox != nullptr )
{
ComboBox.IsEnabled( false );
ComboBox.IsEnabled( true );
}
}
I have to say that currently there is no event to detect if the application window is moved or changed its location.
Update:
You could handle the UIElement.PointerWheelChanged Event which will be fired when users scroll the mouse wheel. You could set the IsEnabled property of the ComboBox to false first and then set it to true, this will make the ComboBox lose its focus. Like:
private void Mypanel_PointerWheelChanged(object sender, PointerRoutedEventArgs e)
{
FontsCombo.IsEnabled = false;
FontsCombo.IsEnabled = true;
}
Update2:
If you are using a ScrollViewer you could try to handle the ScrollViewer.ViewChanging Event.
private void ScrollViewer_ViewChanging(object sender, ScrollViewerViewChangingEventArgs e)
{
FontsCombo.IsEnabled = false;
FontsCombo.IsEnabled = true;
}
I am making a UWP app which is supposed to be on xbox for now and maybe in future ill release it on pc and other platforms. I know that on PC and for mobile we can enable this feature with following 2 properties on the GridView or ListView.
CanReorderItems=True
CanDrop=True
But according to Microsoft Docs, drag and drop feature is not available or supported on xbox.
So what are any other options to achieve this reorder feature on xbox GridView?
UPDATE 1
So here is my backend code for the gridview. selection mode is single but I am not using selectionchanged event because that just creates lot of confusion and for now just assume that we always need to swap the items I will set the boolean later once the swapping in working perfectly.
private void SamplePickerGridView_ChoosingItemContainer(Windows.UI.Xaml.Controls.ListViewBase sender, ChoosingItemContainerEventArgs args)
{
if (args.ItemContainer != null)
{
return;
}
GridViewItem container = (GridViewItem)args.ItemContainer ?? new GridViewItem();
//should be xbox actually after pc testing
if (DeviceTypeHelper.GetDeviceFormFactorType() == DeviceFormFactorType.Desktop)
{
container.GotFocus += Container_GotFocus;
container.LostFocus += Container_LostFocus;
//container.KeyDown += Container_KeyDown;
}
args.ItemContainer = container;
}
private TVShow GotItem, LostItem;
private void Container_LostFocus(object sender, RoutedEventArgs e)
{
LostItem = OnNowAllGridView.ItemFromContainer(e.OriginalSource as GridViewItem) as TVShow;
GotItem = null;
}
private void Container_GotFocus(object sender, RoutedEventArgs e)
{
GotItem = OnNowAllGridView.ItemFromContainer(e.OriginalSource as GridViewItem) as TVShow;
if (GotItem != null && LostItem != null)
{
var focusedItem = GotItem;
var lostitem = LostItem;
var index1 = ViewModel.Source.IndexOf(focusedItem);
var index2 = ViewModel.Source.IndexOf(lostitem);
ViewModel.Source.Move(index1, index2);
}
LostItem = null;
}
u can try the code with adaptivegridview or just normal gridview of uwp if it works with that it should work with adaptivegridview as well.
Current Bheaviour items are swaped but the focus remains at same index.
Expected the focus should also move along with the item.
Your finding is true, drag and drop is not supported on Xbox out of the box (although when mouse support comes to Xbox in the future, I guess it will work).
So if you need this functionality, you will have to implement it manually from the start. One option would be to add a button, that will display on Xbox only and will read like Reorder Grid.
When this "reorder" mode were enabled, you have several solutions available.
The easiest solution for you would be to set the SelectionMode to Single and when a item is selected, you would bring it to fromt of the underlying collection.
collection.Remove( selectedItem );
collection.Insert( 0, selectedItem );
This bring to front solution was implemented on the Xbox One dashboard for reordering tiles.
Second option would be to set the SelectionMode to Multiple, where user would first select one item and then a second one. After that you could move the first selected item before the second selected:
collection.Remove( firstSelectedItem );
var targetIndex = collection.IndexOf( secondSelectedItem );
collection.Insert( targetIndex, firstSelectedItem );
The last solution is the most complex. With SelectionMode = Single you would select a single item and then observe the direction in which the user focus moves and move the tile "in real time". This is the most user friendly, but hardest to implement reliably.
Just as an outline of the third solution - you could capture the GotFocus event if you implement a custom template of the GridView:
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid Orientation="Horizontal"
GotFocus="GridViewItem_GotFocus"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
Now within this GotFocus handler you could retrieve the item that has currently focus from the EventArgs.OriginalSource. This way you could know which item got the focus and you could swap it with the item the user selected.
Update - hacky solution
I have come up with a hacky approach that solves the GotFocus/LostFocus mess.
The problem with GotFocus is that when we move the item in collection, the focus gets confused. But what if we didn't physically move the items at all?
Suppose your item type is TVShow. Let's create a wrapper around this type:
public class TVShowContainer : INotifyPropertyChanged
{
private TVShow _tvShow;
public TVShow TvShow
{
get => _tvShow;
set
{
_tvShow = value;
OnPropertyChanged();
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
Now change the collection item type to this new "wrapper" type. Of course, you also have to update your GridView DataTemplate to have the right references. Instead of "{Binding Property}" you will now need to use "{Binding TvShow.Property}", or you can set the DataContext="{Binding TvShow}" attribute to the root element inside the DataTemplate.
But you may now see where I am going with this. Currently you are using Move method to move the items in the collection. Let's replace this with a swap:
var item1 = focusedItem.TvShow;
focusedItem.TvShow = LostItem.TvShow;
LostItem.TvShow = item1;
This is a big difference, because we no longer change the collection itself, but just move the references to items that are wrapped in a "static" container. And thanks to bindings the items will properly display where they should.
This is still a hacky solution, because it requires you to wrap your items just for the sake of the reordering, but it at least works. I am however still interested in finding a better way to do this.
I am working on a Compact Framework application. This particular hardware implementation has a touchscreen, but its Soft Input Panel has buttons that are simply too small to be useful. There are more than one form where typed input is required, so I created a form with buttons laid out like a keypad. The forms that use this "keypad" form are modal dialogs. When a dialog requiring this "keypad" loads, I load the "keypad" form as modeless:
private void CardInputForm_Load(object sender, EventArgs e)
{
...
keypadForm = new KeypadForm();
keypadForm.Owner = this;
keypadForm.SetCallback(keyHandler);
keypadForm.Show();
}
The SetCallback method tells the "keypad" form where to send the keystrokes (as a Delegate).
The problem I'm having is that the modeless "keypad" form does not take input. It is displayed as I expect, but I get a beep when I press any of its buttons, and its caption is grayed-out. It seems like the modal dialog is blocking it.
I've read other posts on this forum that says modal dialogs can create & use modeless dialogs. Can anyone shed light on this situation? Is there a problem with my implementation?
I found the answer: Set the keypad form's Parent property, not its Owner property, to the form instance wanting the keystrokes. The keypad dialog's title bar stays grayed out, but the form is active.
private void CardInputForm_Load(object sender, EventArgs e)
{
// (do other work)
keypadForm = new KeypadForm();
keypadForm.Parent = this;
keypadForm.Top = 190; // set as appropriate
keypadForm.Show();
}
Be sure to clean up when done with the parent form. This can be in the parent's Closing or Closed events.
private void CardInputForm_Closing(object sender, CancelEventArgs e)
{
// (do other work)
keypadForm.Close();
keypadForm.Dispose();
}
There are two panels on the keypad form, one with numerals and one with letters and punctuation that I want. There is also an area not on a panel that is common to both, containing buttons for clear, backspace, enter/OK, and cancel. Each panel has a button to hide itself and unhide its counterpart ('ABC', '123', for example). I have all the buttons for input on the keypadForm fire a common event. All it does is send the button instance to the parent. The parent is responsible for determining what action or keystroke is desired. In my case I named the buttons "btnA", "btnB", "btn0", "btn1", "btnCancel", etc. For keystrokes, the parent form takes the last character of the name to determine what key is desired. This is a bit messy but it works. Any form wishing to use the keypad form inherits from a base class, defining a method for callback.
public partial class TimeClockBase : Form
{
public TimeClockBase()
{
InitializeComponent();
}
// (other implementation-specific base class functionality)
public virtual void KeyCallback(Button button)
{
}
}
The click event on the keypad form looks like this.
private void btnKey_Click(object sender, EventArgs e)
{
// play click sound if supported
(Parent as TimeClockBase).KeyCallback(sender as Button);
}
The method in the parent form looks like this.
public override void KeyCallback(Button button)
{
switch (button.Name)
{
case "btnCancel":
// setting result will cause form to close
DialogResult = DialogResult.Cancel;
break;
case "btnClear":
txtCardID.Text = string.Empty;
break;
// (handle other cases)
}
}
I got a toolstripbutton, and when I click it, I want to make it stay "pressed" or "selected". Like a switch. And when I click another, make the pressed one "unpressed" again. Any ideas?
I think you want to use the CheckOnClick property. Set it to true, and the button should behave as you describe. In order to get (or set) the current state, use the Checked property.
Here is a full working sample:
public partial class Form1 : Form
{
private readonly IEnumerable<ToolStripButton> mutuallyExclusiveButtons;
public Form1()
{
InitializeComponent();
mutuallyExclusiveButtons = new[] { firstButton, secondButton };
}
private void ToolStripButton_Click(object sender, EventArgs e)
{
ToolStripButton button = sender as ToolStripButton;
if (button != null && button.Checked &&
mutuallyExclusiveButtons.Contains(button))
{
foreach (ToolStripButton item in mutuallyExclusiveButtons)
{
if (item != button) item.Checked = !button.Checked;
}
}
}
}
firstButton and secondButton are ToolStripButtons, both have CheckOnClick set to true, and their Clicked events hooked up to ToolStripButton_Click. This works also if there are more than two buttons in the group of buttons in which only one should be checked, just add any needed additional buttons to the mutuallyExclusiveButtons sequence.
As ChrisF said, what you are looking for is the "Checked" property. (The "CheckOnClick" property is actually not what you want, since you want a sort of mutually exclusive toggle between two ToolStripButtons.)
What you will need is to put code (into the click event of each button) that will set the Checked property of that button to True and the Checked property of the other button to False.
Actually, you can use CheckOnClick and then add code only to set the other button to False.
(Hmmm... I wonder when the Checked becomes set to True; can you capture the MouseUp etc. event of BOTH buttons into one handler, and uncheck BOTH buttons, and then CheckOnClick will check the appropriate one later? Just some geek stuff to complicate things unnecessarily in the name of simplifying things)
Maintain a flag as to what the status of a button is (pressed or normal). For each button press, call a method that refreshes the toolbar buttons to the correct state (either stay pressed or go back to normal).