Lab 2

Create a project called TextShuffler. Use the Tabbed Application template when creating the project. The application will have a Basic and Advanced tab, as shown below:
image image
All students are encouraged to complete both tabs, which are in fact separate views/applications. For FA majors, only the Basic tab is required; for CS/MIS majors, only the Advanced tab is required. Begin by renaming the tabs from "First" and "Second" to "Basic" and "Advanced". Remove the labels that are in both views so you can begin with empty views as you complete this lab. When you are done, compress the application folder, rename the zip file xxxxxx-TextShuffler.zip, and submit this file to moodle . The description of the Basic and Advanced tabs follow.

Basic Tab

This view contains one or two labels, two text fields, and three buttons. The actions that correspond to clicking the buttons are: When the application launches, the user is expected to type text on the text fields, as shown below:
image
The keyboard could be dismissed by pressing return.
Clicking on "Grab R", causes the following transition:
image image
Clicking on "Grab L", causes the reverse:
image image
Clicking on "Swap", causes the following transition, assuming the texts "Tic" and "Tac" have been placed in the text fields:
image image
Refer to the following hints and tips that might help:
  1. You must name the action connections for the different buttons differently; e.g., grabLeft:, grabRight:, and swap:
    These actions represent different functionalities.
  2. Do not forget to create outlet connections for the text fields
  3. The label does not require an outlet connection since you will never need to retrieve or update its text
  4. To set a text field to blank, assign its text the value @""; e.g.,
    self.someTextField.text = @"";
    
  5. When swapping the text of two text fields, the following code will not work:
    self.textField1.text = self.textField2.text;
    self.textField2.text = self.textField1.text;
    
    Instead, you will need a temporary variable to carry out the swap, like so:
    NSString *temp = self.textField1.text;
    self.textField1.text = self.textField2.text;
    self.textField2.text = temp;
    
  6. To dismiss the keyboard, you will need to add a delegate connection for both text fields. You will also need to add the following to FirstViewController.m:
    - (BOOL)textFieldShouldReturn:(UITextField *)theTextField {
        [theTextField resignFirstResponder];
        return YES;
    }
    

Advanced Tab

This view contains two buttons which, when clicked, cause a "rotation" of a round graphic (the letter "O") on the screen. For example, after clicking on the "Right" button 4 times, the following transitions occur:
image image image image image
Notice that a counter reflects the number of rotation steps carried out. When the "Left" button is clicked, the graphic rotates counter-clockwise, and the counter decrements.

This application does not require graphics. In fact, it can be carried out through labels. Specifically, there are six labels around the buttons, one of which contains the text "O", while the remaining five contain blanks. This is illustrated below (the background of the view has been set to white, while the label backgrounds have been set to light blue, for clarity):
image
You will note that on the bottom of the screen, two additional labels contain the text "Counter:" and the actual integer.

Here are some hints and tips that might help:

  1. Make sure to create outlet connections for the labels.
  2. The "Right" and "Left" buttons will need action connections and must be named differently. Their methods will contain very similar code.
  3. The rotation "illusion" can be carried out by transferring text between the labels. You will need a temporary variable. The sample code below "rotates" the text between three labels:
    NSString *temp = self.label1.text;
    self.label1.text = self.label2.text;
    self.label2.text = self.label3.text;
    self.label3.text = temp;
    
  4. Inside a method, you can declare an integer variable just like you would do in Java/C/C#, e.g.,
     int num; 
    The statement:
     num++; 
    increments that variable, while
     num--; 
    decrements that variable.
  5. To convert from text to an integer, use a statement similar to the following:
    num = [self.someLabel.text intValue];
    
  6. To convert an integer to text, use a statement similar to the following:
    self.someLabel.text = [NSString stringWithFormat:@"%d",num];