CSE 132 (Spring 2015)
Studio 1: The Percenterator

Review studio procedures before starting.

Some guidelines for this week's studio:


On Wednesday we will use the work of this studio to control picture color using some Swing components. For today, focus on the following:

  1. Organize yourselves around one keyboard/mouse/display. Use the large displays on the walls to make things easier to work as a group.
    If the font is too small on the wall display, follow these simple :-) instructions:
    • In the editor window of a Java file, right-click and choose Preferences
    • Near the top of what you next see, click on Text Editors
    • Near the bottom of what you next see, click on Colors and Fonts
    • Expand Java (not Structured Text Editors!)
    • Click Java Editor Text Font
    • Click Change
    • Pick a juicy font size like 18 or 20 or whatever you like, and OK
  2. One of you should log in and open eclipse (if you're new to this stuff, ask somebody to help you).

  3. Identifying your repository: If necessary, open the subversive tutorial in another window for the instructions on how to use subversion to load your repository in eclipse. If you need help with these instructions, ask a TA or another student to help you along.
    When you get to the point of entering the full and complete location of the repository, copy and paste the line below as the repository's URL:
    After pasting:
    • Change YYYY to your WUSTL key, using lower case letters only. Include all punctuation that is normally part of your WUSTL key.

      If you would normally type in the WUSTL key shown on the left, you need to use the version shown in blue on the right to access your repository. Examples:

      • RonKCytron → ronkcytron
      • ima.StudeNt → ima.student
      • Queen.Mary.4 → queen.mary.4

      Although only you can access your repository, you should generally keep your WUSTL key a secret.

    • OK, click Finish to get the repository location validated.
    • When you are prompted for a username and password, supply your
      • WUSTL key username (again, all letters must be lower-case)
      • WUSTL key password
      Your WUSTL key username and password are what you use to log into WebSTAC for registration.

      Be careful! If you provide a bad password repeatedly, your account will get locked out after a small number of such attempts. So be sure to follow these instructions carefully and ask if things are not working.

  4. Studios are found in the studios source folder of your repository. Look for the studio1 package there.
  5. You should see a studio1.percent (sub)package (where we will do our work) and a studio1.lecture (sub)package with the code from lecture.
  6. Open the Controller class in your studio1.percent package
  7. Run Controller as an application. You should see a frame pop up with the label in it.
  8. Add some more JLabel instances just to get used to doing this kind of thing.

    Add some labels that say something funny.

    • Run the Controller application again, and make sure you see what you expect.
    • Show your TA your progress and try to make him or her laugh at what is shown.
  9. In class, you were shown an OpinionModel that managed an integer in the range of 0 to 10. Take a look at that class in your studio's studio1.lecture package.

    Write a similar Java class PercentModel that works like OpinionModel but allows integers from 0 to 100.

    • You will have to use eclipse to create the PercentModel as a new Java class in the studio1.percent package.
    • The class you define should extend DefaultBoundedRangeModel, just as OpinionModel does.
    • If you mouse-over the super constructor call in OpinionModel, the Java API should tell you what the parameters mean.
    The integer value represents a percentage, whose initial value should be 100 percent.

    Your PercentModel class must have the following method:

    public int computePercentOf(int n)
    The method takes in n and returns this.getValue() percent of n.

    In your group, discuss how to write computePercentOf so that it performs arithmetic using the appropriate types.

  10. Run the JUnit PercentTest to make sure things are working.
  11. You were shown in class how to extend JSlider (we called the extension ViewAsSlider) and hook an instance of the extension to a model. Do the same for yourself in your Controller, and configure it so it looks and works the way you wish.

    Instantiate a couple of sliders hooked to the same model and watch them work in concert.

    Show this to a TA and to other groups as needed.

  12. You were shown the ViewAsText text field associated with a model in class. Do the same for yourself and arrange for the slider and the text field to show up in your demo. When one changes, so should the other.

    Show this to a TA and to other students as needed.

  13. Add a String parameter to the Controller constructor and arrange for it to show up as the label in the Swing JPanel instead of the Controller label.
  14. Next, investigate some other swing components that will have some effect on your Controller.
    You can use any one you want, but it should be used for some reasonable purpose. For example, a JButton might be used to reset the percentage to 0 or 100 percent.
  15. Let's take JButton as an example. You will want to add one or two JButtons to the Controller JPanel. To discover when one has been pushed, start with the following code and let eclipse help you fill in what's missing:
      JButton reset = new JButton("reset");
      // ...
      // ...
    It's the last line above that will cause eclipse to suggest some things to you. Get help as you need it.
    There is a description of JButton here, but you only need the bold stuff.

    You can see how the action events are handled there at least.

  16. Add at least two things to the panel (they can both be JButtons) and make them do something useful.
    Show the TAs this when you check out.


When you done with this studio, you must be cleared by the TA to receive credit.

Last name WUSTL Key Propagate?
(or your numeric ID) Do not propagate
e.g. Smith j.smith
1 Copy from 1 to all others
2 Copy from 2 to all others
3 Copy from 3 to all others
4 Copy from 4 to all others

TA: Password: