Question

I am a newbie in windows phone app and need to create a small Windows Phone 7 app. The app will perform the following task

1. App Screen has an image “image1′ ,when i press on ‘image1’ it will shows a second image ‘image2’

2. When I press on image2 it will shows image1 and so on

My XAML code

 <Button Click="Button_Click">
<Image Source="resourse/image1.jpg"/>
 </Button>

C# code

namespace Test
{
    public partial class MainPage : PhoneApplicationPage
    {

        public MainPage()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
          // here will shows the 'image2' and also give click event to turn 'image1'
        }




    }
}

Please help

Answer 1

I would tackle this by having a couple of images in your XAML:

 <Button Click="Button_Click">
     <Grid>
       <Image x:Name="imageOne" Source="resourse/image1.jpg"/>
       <Image x:Name="imageTwo" Source="resourse/image2.jpg"
              Visibility="Collapsed"/>
     </Grid>
  </Button>

The use of x:Name causes visual studio to generate a field for each image. The second image is ‘collapsed’, i.e. hidden.

You click handler then does the following:

    private void Button_Click(object sender, RoutedEventArgs e)
    {
      if (imageOne.Visisbility == Visibility.Visible)
      {
        imageOne.Visisbility = Visibility.Collapsed
        imageTwo.Visisbility = Visibility.Visible
      }
      else
      {
        imageOne.Visisbility = Visibility.Visible
        imageTwo.Visisbility = Visibility.Collapsed
      }
    }

On each click it toggled the visibility of each image.

This is easier than changing the Source of the image, which involves URIs etc…