In a test app, I've created 3 Grid objects named grid1
, grid2
and grid3
that each contains
a Border
and an Image
. For example, grid1
is defined in xaml
as:
<Grid Grid.Row="0"
Grid.Column="0"
Margin="10"
Name="grid1"
Tag="0"
PointerPressed="grid_PointerPressed"
PointerReleased="grid_PointerReleased"
PointerExited="grid_PointerExited"
PointerEntered="grid_PointerEntered">
<Border CornerRadius="10"
BorderThickness="2"
BorderBrush="Black"
Name="border1" Background="{StaticResource CellBackgroundColorDefault}"/>
<Image Name="cell1" Source="" Margin="10" Stretch="Uniform"/>
</Grid>
Each image gets its source programmatically when the page loads. The functions grid_PointerPressed, grid_PointerReleased etc are the same for grid1, grid2 and grid3. The grid objects are inside another grid, with some space between them. When a finger presses a grid and its contents, I give the grid's border another background color. When the finger releases the grid, then the background gets its default color, the grid animates its contents, and a sound is played, e.g
private void grid_PointerPressed(object sender, PointerRoutedEventArgs e)
{
Grid g = sender as Grid;
int index = Int32.Parse(g.Tag as string);
System.Diagnostics.Debug.WriteLine(String.Format("[Pressing {0}?]", index));
if (g.PointerCaptures == null || g.PointerCaptures.Count == 0)
{
System.Diagnostics.Debug.WriteLine(String.Format("\tAccepted", index));
LoadSoundAndPlay(index);
ChangeCellBackground(index);
g.CapturePointer(e.Pointer);
}
}
private void grid_PointerReleased(object sender, PointerRoutedEventArgs e)
{
Grid g = sender as Grid;
int index = Int32.Parse(g.Tag as string);
System.Diagnostics.Debug.WriteLine(String.Format("[Releasing {0}?]", index));
if (g.PointerCaptures != null && g.PointerCaptures.Count > 0)
{
System.Diagnostics.Debug.WriteLine(String.Format("\tAccepted", index));
ChangeCellBackgroundToDefault(index);
AnimateCell(index);
g.ReleasePointerCapture(e.Pointer);
}
}
Now, because a touch can press grid1
, stay pressed, move out of grid1
, enter grid2
, and release when in grid2
, I've also added pointer events when entering and exiting:
private void grid_PointerExited(object sender, PointerRoutedEventArgs e)
{
Grid g = sender as Grid;
int index = Int32.Parse(g.Tag as string);
System.Diagnostics.Debug.WriteLine(String.Format("[Exiting {0}?]", index));
if (g.PointerCaptures != null && g.PointerCaptures.Count > 0)
{
System.Diagnostics.Debug.WriteLine(String.Format("\tAccepted", index));
ChangeCellBackgroundToDefault(index);
AnimateCell(index);
g.ReleasePointerCapture(e.Pointer);
}
}
private void grid_PointerEntered(object sender, PointerRoutedEventArgs e)
{
Grid g = sender as Grid;
int index = Int32.Parse(g.Tag as string);
System.Diagnostics.Debug.WriteLine(String.Format("[Entering {0}?]", index));
if (g.PointerCaptures == null || g.PointerCaptures.Count == 0)
{
System.Diagnostics.Debug.WriteLine(String.Format("\tAccepted", index));
LoadSoundAndPlay(index);
ChangeCellBackground(index);
g.CapturePointer(e.Pointer);
}
}
Everything works OK, but there is one problem which I can't solve- If I touch the first grid, keep my finger pressed, and very quickly move my finger to the last grid (passing through the second grid) and then releasing, the following messages are printed:
[Entering 0?]
Accepted
[Pressing 0?]
Accepted
[Exiting 0?]
Accepted
***Animating 0***
[Exiting 1?]
[Entering 2?]
Accepted
[Releasing 2?]
Accepted
***Animating 2***
[Exiting 2?]
The numbers 0, 1 and 2 correspond to the Grid Tags. As you can see, there was no event PointeredEntered for the second grid (Tag: 1) and so it was not animated, and no sound was played for it. However, if I do the same thing slowly, then everything works OK.
How can I solve this problem ?
Thank you.