UWP ListView ItemClick - xaml

I have defined ItemClick event handler for a ListView. The event handler is called, but when I click the ListViewItem for the first time SelectedItem of the ListView is null and SelectedIndex is -1. But I want to retrieve SelectedItem also on the first click when nothing is selected in the ListView. Is there another solution? Thanks.

As miskohut pointed out you can use ItemClickEventArgs, here is an example
private void listView_ItemClick(object sender, ItemClickEventArgs e)
{
MyItemModel item = (MyItemModel)e.ClickedItem;
//TODO:
}

The answer is an easy one.
`ItemClickEventArgs`
contains attribute ClickedItem which is type of type DataContext of ListView.

More appropriately for the click event, get the clicked item index. For example,
private void Column_ItemClick(object sender, ItemClickEventArgs e)
{
ListView listView = (ListView)sender;
Tile clickedMenuItem = (Tile)e.ClickedItem; // Typecast the clicked menu item back to the content type of each list view item
// Key line is here:
int itemNumber = listView.Items.IndexOf(clickedMenuItem);
}
In the above on click event of the listView.ItemClick += Column_ItemClick event, the itemNumber integer is the index of the clicked list view item.
This solution avoids the -1 index response for a selected item, because the on click event that selects an item happens only after the second click of the menu.

Related

How can I toggle the checkbox of an item in a CheckedListbox if CheckOnClick is True, but SelectionMode is None..?

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.

How to override the default response to a touch for a control in UWP?

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;
}
}

Reset SelectedItem in LongListSelector after selection

I'm using Caliburn.Micro and the LongListSelector. Because binding SelectedItem is a problem I act on the SelectionChanged event. Problem is, after returning to the list, when I click the same item again, it is already selected. So the event doesn't fire. I could set the SelectedIndex to -1 or something, but in Caliburn.Micro I can't access UI controls. That's the point of MVVM, isn't it?! :)
Here's my XAML
<LongListSelector x:Name="NewsItems"
ItemsSource="{Binding NewsItems}"
cal:Message.Attach="[Event SelectionChanged] = [NavigateToArticle($eventArgs)]" />
How to solve this? How can I reset the SelectedItem when I can't access the LongListSelector from code?
Thanks!
You have to put your LongListSelector SelctionMode="Multiple",
or
You can get it using Gesture Tap event.
Did not understood real problem but
I think you can solve your problem if selection change event fire every time when user select item-
private void productList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
LongListSelector productList= (LongListSelector)sender;
if (productList.SelectedItem == null)
return;
//Write your code here
//For Tapping many times..
productList.SelectedItem = null;
}
The above code will make selection change event to fire on selection of same item every time.

click a textblock without selecting the parent listview item

I'm developing a windows store application with C# and XAML. I am using a ListView to display the collection of data.
Inside the ListView I have a data template which has grids and a TextBlock in the grid. I want to tap/click the TextBlock and give action without selecting the parent ListView item as I already have event to handle the selected ListView item. I don't want both to overlap.
Thanks in advance for any response.
So you want to be able to select the ListViewItem when tapping one part of it, but not the TextBlock? If this is the case, in the TextBlock's Tapped event add e.Handled = true;. This should make it so that it isn't further routed up to the parent ListView.
The other thing you can do (which will likely be a more general solution to whatever you want to do with your ListViewItems) is to not use thing SelectionChanged event and instead handle everything with ItemClick. You can then deduce whether the OriginalSource of the event is indeed your TextBlock. Then, if it's not the TextBlock, change the parent ListView's SelectedItem.
An example for chceking the OriginalSource
public static void ItemClickEvent(object sender, ItemClickEventArgs e)
{
if(e.OriginalSource is TextBlock)
DoNothingOrMaybeTextBlockEvent();
else
{
ListView.SelectedItem = e.ClickedItem;
}
}
Hope this helps.
Edit: Added some example code for the OriginalSource check

ToolStripButton = "Pressed"

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).