Showing a flyoutmenu on a gridview item while Narrator is active - c#

I want to show a simple flyout menu on a gridviewitem. According to this article here: https://blogs.msdn.microsoft.com/winuiautomation/2016/01/01/ten-questions-on-programmatic-accessibility/, (paragraph 6) you should be able to just set up a handler for the doubletapped event. I also tested it in the windows phone ui.
The problem is that ,in my app, the doubletap handler never gets called when doing the 2-finger double-tap gesture while narrator is activated.
I tried to do this in my gridview:
<GridView x:Name="ImgGrid"
ItemsSource="{x:Bind AllFiles, Mode=OneWay}"
IsItemClickEnabled="True"
SelectionMode="None"
Background="{ThemeResource PaneBackgroundBrush}" Padding="8"
ItemClick="ImgGrid_ItemClick"
ItemContainerStyle="{StaticResource GridViewItemContainerStyle}"
IsDoubleTapEnabled="True"
DoubleTapped="ImgGrid_DoubleTapped">
As you can see, the doubletapped flag is enabled and there's a handler attached for the doubletapped event. But it doesn't get called with the 2-finger double tapped gesture. However, on non-mobile devices, the handler gets called by rightclicking on a gridview item.
I also tried to put the eventhandler on the gridviewitem itself:
<DataTemplate x:DataType="data:KNFBFileInfo">
<Grid x:Name="ThumbnailContainer"
Margin="8"
Width="80"
Background="Transparent"
MinHeight="100"
Height="Auto"
Holding="ThumbnailContainer_Holding"
RightTapped="ThumbnailContainer_RightTapped">
Same result as the first thing i tried...
It's really a shame that it's so hard for a developer to make
his app accessible

I just created a sample app with MenyFlyout inside DataTemplate
<DataTemplate x:Name="LastItems">
<Grid RightTapped="Grid_RightTapped">
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Item1"/>
<MenuFlyoutItem Text="Item2"/>
<MenuFlyoutItem Text="Item3"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<TextBlock Text="{Binding ''}" Padding="10" Margin="10,0" />
</Grid>
</DataTemplate>
And then Grid_RightTapped method is as follows.
private void Grid_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
FrameworkElement element = sender as FrameworkElement;
if (element != null) FlyoutBase.ShowAttachedFlyout(element);
}
Doing this, When I Right Click on Non-Mobile Devices and LongPress on Items on Mobile Devices, Flyout Shows up with no issues.

There is an official document about the "Narrator". When we Double-tap with one finger, or Hold with one finger and tap with a second, it will activate primary action. It means we tap the item once without the "Narrator". So the DoubleTapped event will never be fired.
When we Double-tap with two fingers, it will show the context menu of the select control. We should be able to add the RightTapped to the GridView. When we Double-tap with two fingers, the RightTapped will be fired.
It seems we can not select the GridViewItem in the "Narrator" mode. If we add the SelectionChanged event to the GridView, when we double tap the GridViewItem, the SelectionChanged will never be fired.

Related

UWP position flyout at mouse cursor

I have a grid with a load of textblocks inside and a flyout with various options attached to the grid.
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem x:Name="EditButton" Text="Edit" Click="EditButton_Click"/>
<MenuFlyoutItem x:Name="DeleteButton" Text="Delete"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
The problem is that the flyout will appear in the same fixed spot somewhere in the middle of the grid or I can set it programmatically to appear at an element. I want it to appear wherever the mouse was right clicked. Is this possible or am I going about this the wrong way?
I don't know how are you showing the Flyout, but in my app, I use the RightTapped event of my ListView and following code in the RightTapped event handler to achieve the same thing as you want.
private void MyListView_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
var tappedItem = (UIElement)e.OriginalSource;
var attachedFlyout = (MenuFlyout)FlyoutBase.GetAttachedFlyout(MyListView);
attachedFlyout.ShowAt(tappedItem, e.GetPosition(tappedItem));
}

WP8.1 Click event for child element in ListView ItemTemplate while ignoring ItemClick event

I have a ListView with a DataTemplate. Inside the DataTemplate I have a clickable image
<Image x:Name="likeImg" Tapped="likeButtonPressed" Margin="2" VerticalAlignment="Bottom" Height="20" Source="{Binding likedImage}" Visibility="{Binding userID, Converter={StaticResource ResourceKey=HideForMyUser}}"/>
This event fires perfectly when clicked.
I added an ItemClick event handler to the ListView (and IsItemClickEnabled true of course) so that when an item is clicked, I want to navigate to a new page EXCEPT when the likeImg is clicked. When I click the likeImg both events fire. Is there any way to ignore the ItemClick event when the image is tapped?
Disable the SelectionMode and IsItemClickEnabled of ListView and your child control (Image in your case) event should fire.
Below are the ListView Properties you should set.
SelectionMode="None"
IsItemClickEnabled="False"

How to determine which child element of a ListView Item was clicked?

I'm developing a windows phone 8.1 app in XAML and C#. I have a ListView getting its Items from a bound list and displaying them through a DataTemplate. Now, in this DataTemplate there are multiple child elements, and when the user taps on an item in the list, I want to be able to determine what child element he actually touched. Depending on that, the app should either expand a view with more details inside the Item, or navigate to another page.
The ItemClick event handler of the ListView is ListView_ItemClick(object sender, ItemClickEventArgs e), and I thought e.OriginalSource would maybe give me the answer, but this just gave me the clicked ListItem.
I have yet to try if encapsulating the children with buttons and intercepting their click events would work, but I'm happy to try any alternative there might be for this.
I just found the solution myself. I set the ListView to SelectionMode="None" and IsItemClickEnabled="False", and then I added Tapped handlers for the individual child elements. Works just as I wanted.
I've got a TextBlock and an Image in one ListViewItem and have just used the Image_PointerPressed event. Doing that also fires the ItemClick event for the ListView so I disable it first, do the stuff I want, then re-enable the ItemClick event so that still fires when the TextBlock is pressed.
Code behind:
private async void imgDone_PointerPressed(object sender, PointerRoutedEventArgs e)
{
// disable click event so it won't fire as well
lvwCouncils.IsItemClickEnabled = false;
// do stuff
MessageDialog m = new MessageDialog("User Details");
await m.ShowAsync();
// Re-enable the click event
lvwCouncils.IsItemClickEnabled = true;
}
Xaml:
<ListView x:Name="lvwCouncils" ItemClick="lvwCouncils_ItemClicked" IsItemClickEnabled="true" >
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock
Grid.Column="1"
Text="{Binding council_name}"
FontSize="24"
Margin="10,10,30,10"
/>
<Border Height="20" Width="20" Margin="10,10,0,10" >
<Image x:Name="imgDone"
Source="Assets/user_earth.png" Stretch="UniformToFill" PointerPressed="imgDone_PointerPressed"/>
</Border>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Use the SelectionChanged event.
Cast the sender object to ListView type and then retrieve the item from the SelectedItem property.
Similar question here but for a different control :
Get the index of the selected item in longlistselector

How to have a ListBox child item event not call parent event?

Problem
When I click on a ListView item, it calls the "Tapped" event to navigate to another page. I have an Up Vote event within the ItemTemplate and when they call that specific event, I DO NOT want to call the ListView's tapped event. Any idea how I might do that?
ListView XAML:
Parent event, "listboxFeedbackItem_Tapped", occurs anytime any part of the listview is clicked
<Grid x:Name="gridMainData" Grid.Row="2">
<ProgressBar x:Name="prgBar" IsIndeterminate="True" VerticalAlignment="Top" Visibility="{Binding Path=FeedbackVM.IsLoading, Mode=TwoWay}"/>
<ListView ItemTemplate="{StaticResource FeedbackTemplate}" ItemsSource="{Binding FeedbackVM.FeedbackCollection}" Tapped="listboxFeedbackItem_Tapped"/>
</Grid>
ItemTemplate Xaml:
Event "UpVoteItem_Tap" should not trigger "listboxFeedbackItem_Tapped"
<DataTemplate x:Key="FeedbackTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Margin="0,0,30,0" Text="{Binding UpVotes}" Tapped="UpVoteItem_Tap"/>
</StackPanel>
</DataTemplate>
Perhaps there's a method in C# to prevent subsequent events from occurring?
Thanks, I'm still trying to wrap my head around XAML.
When you receive the UpVote tapped event, you can tell it not to pass the event to the parent listview by setting e.Handled=true:
void UpVoteItem_Tap(object sender, TappedRoutedEventArgs e)
{
// Processing here
...
// don't send event to parent
e.Handled = true;
}

Why is my Button event is not occuring?

I am having an issue with my button event not occuring
Basically I have cart items that are listed in the listbox. When the delete button is clicked then the item is deleted from the list box.
I tried debugging, but it seems to not even call the method for when the button is clicked.
In my ticketscreen.xaml file I specify my button in the template:
<DataTemplate x:Key="TicketTemplate">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left" Height="50">
...
<Button Name="Remove" Width="35" Height="35"
FontFamily="Resources/#charlemagnestd-regular.otf" FontSize="24"
Click="removeCartItem" Grid.Column="5"
MouseMove="Remove_MouseMove">X</Button>
...
</StackPanel>
</DataTemplate>
My List box is the following:
<ListBox Name="TicketItems" ItemsSource="{Binding}"
ItemTemplate="{StaticResource TicketTemplate}"
Grid.Row="3" Grid.ColumnSpan="6" Background="Transparent"
BorderBrush="Transparent" IsHitTestVisible="False">
</ListBox>
My method removeCartItem is in the ticketscreen.xaml.cs:
private void removeCartItem(object sender, RoutedEventArgs e)
{
Console.WriteLine("TestingCartRemove");
}
Am I missing something obvious?
Thx in adv! :)
Edit:
There seems to be something infront of it... maybe the listbox? How do I make it so that I am not clicking the ListBox, but I can click on things within the Stackpanel, which are contents of the list box.
IsHitTestVisible="False" for the ListBox is disabling the click event for the Button. It makes all content within the ListBox invisible to hit-test as well.
Are you sure is not firing? Maybe you haven't seen the output in Visual Studio Output Window. Try to call a MessageBox.Show("Test"); instead.
You have a listbox control, which leads me to believe that this is not a console application. Therefore, Console.WriteLine() will not show you anything. Try MessageBox.Show() instead.

Categories

Resources