Question

I have a Windows Mobile application. Within that application, i’ve got a ScrollViewer which allows the user to flick through the many images which I have inside that scroller. In this case, they are images of the alphabet.

The problem is, I want logical code to execute when the user clicks on an image, BUT, if the user scrolls by clicking on the letter, it actuates the code….

For example, imageA has a LeftClickButton event, but…if the user scrolls by touching the letter A….the logical code in the imgA_LeftClick fires.

How do I overcome this problem? Below is my code.

<ScrollViewer Height="98" Name="scrollerButtons" Width="603" Canvas.Left="40" Canvas.Top="383" VerticalAlignment="Center" ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Visible">
    <StackPanel Name="stackPanelButtons" Orientation="Horizontal" Canvas.Left="162" Canvas.Top="43" VerticalAlignment="Center" HorizontalAlignment="Center">

                <Image Height="60" Name="imgA" Source="a.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgK" Source="k.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgM" Source="m.png" Stretch="Fill" Width="60" MouseLeftButtonDown="imgM_MouseLeftButtonDown"></Image>
                <Image Height="60" Name="imgJ" Source="j.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgN" Source="n.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgO" Source="o.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgI" Source="i.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgH" Source="h.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgG" Source="g.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgF" Source="f.png" Stretch="Fill" Width="60" MouseLeftButtonDown="imgF_MouseLeftButtonDown"></Image>
                <Image Height="60" Name="imgE" Source="e.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgD" Source="d.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgC" Source="c.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgB" Source="b.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgL" Source="l.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgT" Source="t.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgS" Source="s.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgR" Source="r.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgQ" Source="q.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgP" Source="p.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgU" Source="u.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgZ" Source="z.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgV" Source="v.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgW" Source="w.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgY" Source="y.png" Stretch="Fill" Width="60"></Image>
                <Image Height="60" Name="imgX" Source="x.png" Stretch="Fill" Width="60"></Image>
            </StackPanel>
            </ScrollViewer>

Answer 1

Instead of the MouseLeftButtonDown event, use the Tap event. Seeing as this is tagged Silverlight, I assume you mean Windows Phone and not Windows Mobile.