examples/sprites.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Displaying sprites on the Canvas"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from random import choice, randint, uniform\n",
    "from math import pi\n",
    "\n",
    "from PIL import Image as PILImage\n",
    "\n",
    "import numpy as np\n",
    "\n",
    "from ipywidgets import Image\n",
    "\n",
    "from ipycanvas import Canvas, hold_canvas"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Drawing a sprite from an ``Image`` widget"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "sprite1 = Image.from_file(\"sprites/smoke_texture0.png\")\n",
    "sprite2 = Image.from_file(\"sprites/smoke_texture1.png\")\n",
    "\n",
    "canvas1 = Canvas(width=300, height=300)\n",
    "canvas1.fill_style = \"#a9cafc\"\n",
    "canvas1.fill_rect(0, 0, 300, 300)\n",
    "canvas1.draw_image(sprite1, 50, 50)\n",
    "\n",
    "canvas1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas1.draw_image(sprite2, 100, 100)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Drawing from another ``Canvas``"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas2 = Canvas(width=600, height=300)\n",
    "canvas2.draw_image(canvas1, 0, 0)\n",
    "\n",
    "canvas2"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas2.draw_image(canvas1, 300, 0)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Drawing from a NumPy array"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "sprite3 = np.array(PILImage.open(\"sprites/smoke_texture2.png\"))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas2.put_image_data(sprite3, 250, 150)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Drawing thousands of sprites, the more optimized solution is to first \"cache\" your images in other ``Canvas`` instances"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "# The fastest solution is drawing from another canvas\n",
    "canvas_sprite1 = Canvas(width=100, height=100)\n",
    "canvas_sprite1.draw_image(sprite1, 0, 0)\n",
    "canvas_sprite1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas_sprite2 = Canvas(width=100, height=100)\n",
    "canvas_sprite2.draw_image(sprite2, 0, 0)\n",
    "canvas_sprite2"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas_sprite3 = Canvas(width=100, height=100)\n",
    "canvas_sprite3.draw_image(Image.from_file(\"sprites/smoke_texture2.png\"), 0, 0)\n",
    "canvas_sprite3"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas3 = Canvas(width=800, height=600)\n",
    "\n",
    "sprites = [canvas_sprite1, canvas_sprite2, canvas_sprite3]\n",
    "\n",
    "with hold_canvas():\n",
    "    for _ in range(2_000):\n",
    "        canvas3.save()\n",
    "\n",
    "        # Choose a random sprite texture\n",
    "        sprite = sprites[choice(range(3))]\n",
    "\n",
    "        # Choose a random sprite position\n",
    "        pos_x = randint(0, canvas3.width - 50)\n",
    "        pos_y = randint(0, canvas3.height - 50)\n",
    "\n",
    "        # Choose a random rotation angle (but first set the rotation center with `translate`)\n",
    "        canvas3.translate(pos_x, pos_y)\n",
    "        canvas3.rotate(uniform(0.0, pi))\n",
    "\n",
    "        # Choose a random sprite size\n",
    "        scale = uniform(0.2, 1.0)\n",
    "        canvas3.scale(scale)\n",
    "\n",
    "        # Restore the canvas center\n",
    "        canvas3.translate(-pos_x, -pos_y)\n",
    "\n",
    "        # Draw the sprite\n",
    "        canvas3.draw_image(sprite, pos_x, pos_y)\n",
    "\n",
    "        canvas3.restore()\n",
    "\n",
    "canvas3"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.8.1"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}