Problem Set 4h
Due date: 10/1 @ 11:59pm
A Graphical Editor
DrRacket allows you to edit programs. That is, you type on a keyboard and it records your keystrokes. By doing so you create a document and this document can be viewed as a program. You could also use DrRacket to enter your English assignments, though for that purpose, you can install different better-suited software applications. All of them include a functionality that computer scientists dub "editor" or even "graphical editor."
The purpose of this assignment is to design a world program that acts as a one-line editor. In other words, the challenge is to design a program that allows you and even your grandmother to enter and edit one line of text. Editing means changing existing text, perhaps by deleting a character or by adding another one to the end of the existing text, in the middle, or even the beginning.
In order to change the existing text in the middle, you must have some notion of "position" within the text. We call this position a cursor, and most graphical editors display the cursor in such a way that you can easily spot it. To move the cursor, people can use the arrow keys or the mouse.
Given this context, you can easily imagine how this configuration of your editor program comes about:
You entered the text "helloworld" and then you hit the left-arrow key about five times. This way the cursor — displayed in red — moves from the end of the text to the position between "o" and "w" in this text. If you now press the space bar, the editor should change its display as follows:
In short, it should show the phrase "hello world" with a cursor between the space and the letter "w."
Obviously this world program must keep track of two pieces of information:
This in turn suggests a structure with two fields.
We can imagine several different ways of going from the information to data and back. For example, one field in the structure may contain the entire text entered and the other the number of characters between the left and the cursor. Another data representation is to use two strings in the two fields: the part of the text to the left of the cursor and the part of the text to its right. Here is our preferred approach to representing the state of an editor:
(define-struct editor (pre post)) ;; An Editor is a (make-editor String String) ;; interp.: (make-editor s t) means the text in the editor is ;; (string-append s t) with the cursor displayed between s and t
You must follow the design recipe in completing this assignment.
Exercise 1: Design the function
Exercise 2: Design the function
The scene for your editor program should be 33 pixels tall and 200 pixels wide. For the cursor, use a 1 x 25 red rectangle. The text that you type should appear as you hit the keys on your keyboard. Use black text of size 20 for rendering the text and place the text image into the scene at position (4,4).
Exercise 3: Design the function
Otherwise, the function pays attention to only two key
Note: We recommend that you develop a solid number of tests, paying attention to special cases. In addition, think of this function as a function that consumes an enumeration and use auxiliary functions that then deal with the Editor structure. (Remember: one task, one function).
Exercise 4: Use
Exercise 5: You should notice that if you type a lot, your editor program does not display all of the text. Instead the text is cut off at the right margin.
Modify your function
Exercise 6: Develop a data representation based on our first idea, i.e., using a string and an index. Then solve exercises 1 through exercise 5 again.
Note: The exercise is a first study of making design choices. It shows that the very first design choice concerns the data representation. Making the right choice requires planning ahead and weighing the complexity of each. Of course, getting good at this is a question of gathering experience.
|last updated on Sun Dec 2 14:52:34 EST 2012||generated with Racket|