Hello, dear friend, you can consult us at any time if you have any questions, add WeChat: THEend8_
Assignment A7: Sprite Previewer
Goals
The main goal of this assignment is to develop an application with a UI toolkit.
Partners
You may optionally choose to complete this assignment with a partner. When working with a
partner, both of you must code. You should follow the pair programming protocol discussed in
class: share screens, have one person type while the other person provides feedback, and
change pair programming roles at reasonable intervals (e.g., every hour, for each programming
session, etc.). A submission where one person is unable to meaningfully describe what is going
on in the code is considered academic misconduct.
When submitting on Gradescope, you will have the ability to indicate your partner. At the top of
your file, add a comment with both partners listed as authors. Only one of the persons in the
pair needs to submit.
Working with a partner is optional. You may submit your assignment as usual if you did not
work with a partner.
I have added an A7 Partner Requests discussion board where you can
look for a partner. Please be thoughtful in discussing time availability, goals in the course, and
programming comfort. In general, two partners with similar programming skills works better
than one who is more proficient than the other.
Assignment Overview
Recalling from A5 and A6, a sprite is a small image used for a character in a game. Often a
sprite is not just a single image, but instead a series of images that creates a small animated
sequence.
The goal of this assignment is to develop an application that displays a sequence of sprite
images and includes controls to control the animation playback speed and to start and stop the
playback.
Assignment Requirements
For this assignment, start with the code in the A7 folder. It includes the start of the project and
a folder with example sprite images. Your task is to finish the SpritePreviewer class so that it
does the following
1. Has a label displaying the current sprite image
2. Has a slider that controls the frames per second playing of the animation in a range from 1
to 60 frames per second (FPS)
1. Research how to set the minimum and maximum value of the slider
2. Research how to get some tick marks displayed on the side of the slider
3. Changing the slider does not make the animation start - the Start button does that.
3. Has a label that displays the text "Frames per second"
4. Has another label next to the previous one that displays the current FPS and updates when
the slider changes.
5. Has a Start/Stop button.
1. When "Start" is displayed on the button and the button is pushed, the sprite should
animate at the current FPS. The button text should change to "Stop."
2. When "Stop" is displayed and the button is pushed, the sprite should stop animating and
the button text should change to "Start".
6. Has a menu with 2 options
1. Pause. When the Pause menu item is selected, the animation should stop and the
Start/Stop button should display "Start".
2. Exit. When the Exit menu item is selected, the program should quit.
The application should look like the example above. You will need to create layers of QFrame
or QWidget objects with layouts for each, then add these individual parts together. Sketch out
groupings of components and figure out what kind of layout is needed and where extra widgets
are needed to group things together.
Create a video showing the application in action. You can use a Zoom session sharing the
application window and recording it, or you can use another recording application of your
choosing. The recording must show the following:
1. Pressing Start and seeing the sprite animate and the button text update
2. Changing the slider to see the playback speed change and the FPS label update
3. Pressing Stop and seeing the animation stop
4. Pressing Start and then using the File pause option to see the animation stop and the
button text update
5. Pressing Start after the File pause to see the animation resume
2. You are encouraged but not required to find your own sprite images. The program expects
them to all be in a folder and named sprite_0.png, sprite_1.png, etc. If there are more than
10 images, the files should be of the form sprite_00.png, sprite_01.png, etc. If you want to
make your own sprites, the Piskel online application can
output sprites in this form.
Assignment Discussion
In the lectures and labs, we have covered using labels, sliders, buttons, grouping things with
layouts, and making a menu. Using the signal-slot connect approach discussed in lectures and
labs, we made these UI components responsive to particular events, like button pushes and
moving the slider. Carefully review these examples.
Then, think about how to build up the application and test it as you go. One approach is to build
up most of the UI, then add connections and slots and test it as you add more features. Another
approach might be to get an image showing and then add a slider and see if you can animate it,
then add more UI components and actions, testing as you go.