Skip to content

✏️ Drawing Game Mode (Developer Docs)

The DrawingFragment implements the Drawing Game Mode in zMantra.
This mode challenges learners to draw specific shapes (e.g., circle, square, triangle) on a custom canvas.
It is designed to be hands-on and exploratory, allowing learners to practice geometric understanding through free drawing.

📂 Location

com.zendalona.zmantra.presentation.features.game.drawing.DrawingFragment

🔑 Core Responsibilities

  1. Render Custom Drawing Canvas
  2. Uses DrawingView (a custom View) for capturing freehand drawing.

  3. Clears and resets canvas when needed.

  4. Load & Present Questions

  5. Reads questions from GameQuestion list.
  6. Each question provides a shape name (expression).

  7. Generates accessible instructions (e.g., "Draw a Circle").

  8. User Interaction

  9. Reset button → clears canvas.

  10. Submit button → moves to next question.

  11. Accessibility Support

  12. Announces task instructions using TalkBack.
  13. Announces canvas reset action.

  14. Announces movement to next question.

  15. Game Flow

  16. Sequentially cycles through GameQuestions.
  17. Ends session with completion announcement → auto-navigates back after delay.

⚙️ Key Fields

Variable Type Purpose
_binding / binding FragmentGameDrawingBinding View binding for layout.
drawingView DrawingView? Custom canvas for drawing shapes.
isFirstQuestion Boolean Ensures first question text gets TalkBack focus.
currentQuestion GameQuestion? Holds currently active question.
currentIndex Int Tracks which question index is being shown.
questions List<GameQuestion> All questions for this mode.

🔄 Lifecycle

  1. onCreateView()

  2. Inflates layout and inserts DrawingView into container.

  3. onViewCreated()

  4. Sets listeners for Reset & Submit buttons.

  5. onQuestionsLoaded()

  6. Loads all available questions.
  7. If empty → disables buttons & shows "No questions available".

  8. Otherwise → starts with loadQuestionAt(0).

  9. loadQuestionAt(index: Int, questions: List)

  10. Prepares instruction (e.g., "Draw a Square").
  11. Updates UI and accessibility announcements.
  12. Clears canvas.
  13. Resets attemptCount.

  14. If no more questions → announces "Task completed" and exits fragment.

  15. checkAnswer()

  16. Currently a placeholder.
  17. Shows "Moving to next question" message.
  18. Advances to the next question.

  19. In the future → can be extended for automatic drawing recognition.

  20. onResume()/onPause()

  21. Forwards lifecycle to DrawingView for any resource handling.

🎨 Drawing Logic

  • DrawingView handles all drawing gestures (not included here, but assumed to provide: clearCanvas(), onResume(), onPause()).
  • User input is not validated against shapes yet — currently free drawing only.

🎧 Accessibility

  • Announces drawing tasks (e.g., "Please draw a triangle").
  • Announces canvas reset (e.g., "Canvas cleared").
  • Announces navigation to next question.
  • Ensures focus is given to first question text for TalkBack.

🧪 Testing Notes

  • Verify Reset button clears canvas properly.
  • Confirm Submit button moves to next question.
  • Validate completion behavior:
  • At end of questions → "Task completed" announcement.
  • Navigates back after 3 seconds.
  • Test TalkBack focus on first question.
  • Check canvas usability across devices and screen densities.