Overview

You will use visual programming to create a "Memory" game where you select two cards at a time, if they match, you remove those cards. You continue this process until all of the cards are matched.

Procedures

1. Memory Matching game
   • View a finished release candidate
   • Open a new instance of Visual Studio
   • New > Project... > C# Windows > WPF Application > Name it: MemoryMatch (pay attention to where you save it)
   • Layout
   • Use these images:
     • background, cardback, icon, kitten, puppy, monkey, bear, road runner, wile e coyote, cardpair
   • Layout the controls in the application similar to what you see in the release candidate
     • form should be 900 x 650 pixels
       • change it in the XAML code
     • add background image
       • change it in the properties panel
       • the source will end up looking similar to this:
         Source="/MemoryMatch;component/bin/Debug/background.jpg"
     • add icon
       • change it in the properties panel
     • add 12 Image instances to the form (100 x 100 pixels)
       • drag/drop from toolbox and position on screen
       • x:Name should be pictureBox1, pictureBox2, etc
       • Each Image needs a Border around it with transparent background, same width,height, x:Name pbBorder1, pbBorder2, etc
       • the source will end up looking similar to this:
         Source="/MemoryMatch;component/bin/Debug/cardBack.jpg"
     • add 6 Image instances in the upper right that will be used to show the number of matches.
       • drag/drop from toolbox and position on screen
       • x:Name should be pbMatch1, pbMatch2, etc
     • add a title Label (approx 40pt, centered at top)
       • drag/drop from toolbox and position on screen
       • x:Name should be lblTitle
     • add a congratulations Label (approx 40pt, centered in middle)
       • drag/drop from toolbox and position on screen
       • x:Name should be lblCongrats
     • add a play again Button (centered in middle below congrats)
       • drag/drop from toolbox and position on screen
       • x:Name should be btnPlayAgain
     • add a Label (or Labels) containing your name in the lower right corner (10pt font)
       • drag/drop from toolbox and position on screen
       • does not need an x:Name
     • add a Label for the text 'Wrong attempts:" in the upper left
     • add a Label to hold the number of wrong attempts (mistakes)
       • x:Name should be lblMistakes
   • Coding
   • You will need this .cs file in your application folder: WpfApplication.cs
     • You will need to add the existing item to your solution
     • Make sure the namespace of this WpfApplication.cs file matches the namespace you are using in your solution.
   • The images that you do not add through the properties panel, you will need to add through solution explorer using add existing item (to your bin folder)
   • Whenever trying to store a different image into the Image control, you will create a new URI using syntax similar to this:
     var uriSource = new Uri(@"/MemoryMatch;component/bin/Debug/cardBack.jpg", UriKind.Relative);
     
   • Declare private variables:
     • need 12 int's: card1 through card12
     • need int's: randomNum, numMatches, counter, numSelectedCards, firstSelectedCard, totalNumMatchesRemoved
   • Inside Memory() constructor
     • Set the Source of the 6 pbMatch Image controls
     • Call playGame()
   • Inside btnPlayAgain_Click event handler
     • Call playGame()
   • Inside playGame() function
     • re-initialize all of the variables.
     • Set the congrats Label and play again Button visibility to Hidden
     • Set the 12 pbBorder Border controls visibility to Visible
     • Set the 6 Image controls in the upper right visibility to Hidden
     • Set the Source of the 12 pictureBox Image controls to cardBack.jpg
     • Set the lblMistakes Label to be empty
     • Randomly create 6 matches - use a switch
   • Inside displayMatches() function
     • Display the correct number of matches in the upper right corner by setting visibility to Visible
   • Add 1 Event Handler, btnPlayAgain_Click, each pictureBox on the form will call the same event handler
     • Create a new Image and Border control
     • Cast sender object into the current Image control
     • Increment numSelectedCards
     • Determine which card needs to be used based on which Image was clicked, use the name of the pictureBox that was clicked
     • Check to see which picture to display (see if currentCard is equal to 1-6)
       • Set the image location based on whether the value is 1,2,3,4,5,6
     • if there are two cards selected
       • Pause the application
       • if the firstSelectedCard equals the currentCard
         • Remove the two cards from the screen
         • Increment the total number of matches removed
         • Call displayMatches()
         • Check to see if the total number of matches removed is 6
           • if so, display the congrats label and play again button
       • else - when the firstSelectedCard is not equal to the currentCard
         • Set the image location of all 12 pb's to cardBack.jpg
         • Increment mistakes
       • Set the number of selected cards and the first selected card back to zero 0
       • Re-initialize the Image and Border controls
     • else if the first selected card is 0
       • Set the value of the first selected card to be equal to currentCard
       • Set the value of the first selected Image to be equal to currentImage
       • Set the value of the first selected Border to be equal to currentBorder
   • Test your project
   • Code
   • Here is the code for this entire exercise. Proper use would be: look at the code to make sure you are approaching the assignment the correct way. Then try to do it on your own. Then use the code to make sure you've done it correctly. Improper use would be: copying without interpreting, which would result in not really learning what you're doing. The code is provided to help you be successful and so that you don't have to ask as many questions about the assignment.
     • xaml
     • xaml.cs
        
2. Finalization (do this for both applications)
   • Build > Configuration Manager
     • Change "Active solution configuration" to Release.
     • Make sure "Configuration" changes to Release.
     • Close
   • Rebuild
   • Look in <project folder> / bin / Release
     • Double click <projectName>.exe
        

Grading