Before we begin coding our ChatWindow, let's have a brief overview of the design.
The window will contain the following elements:
- A messages area, showing all messages sent by you to this friend, and sent by this friend to you
- A scrollbar that allows you to scroll up to view older messages
- A text area for you to type a message to send to this friend
- A button that sends the contents of your message to your friend, then clears the text area
- A button that lets the user pick a smiley to include in their message
- Your avatar
- This friend's avatar
From a layout point of view, the message area is the primary part of the application, so it will take up the most space within the window, and be central.
The text area ...
