[Beta] Isometric Drawing Shapes [Cylinder, Knot, Octahedron, Prism, Pyramid and Stairs] and Paths [Circle, Rectangle and Star]

Extensions
, , ,
#1

Description

The Isometric Drawing Extension enables you to create isometric shapes and drawings in your applications. It provides a set of tools and utilities for rendering 3D-like objects on a 2D plane, allowing for the creation of visually appealing and interactive isometric views. With this extension, you can easily integrate isometric drawing capabilities into their Android apps, making it ideal for games, educational apps, and other creative projects.

All Blocks

blocks
blocks371×1053 32.1 KB

blocks (1)
blocks (1)335×775 21.4 KB

blocks (2)
blocks (2)345×1375 38.6 KB

blocks (3)
blocks (3)454×513 24.7 KB

Opera Snapshot_2024-06-06_064225_ai2.appinventor.mit.edu

Demo Blocks:

blocks (6)
blocks (6)1359×746 65.4 KB

Demo:

photo_2024-06-06_07-04-30
photo_2024-06-06_07-04-30623×1280 24.9 KB

Document

Properties Of Isometric

  • BackgroundColor The background color of the isometric drawing view.
    blocks (42)
  • TouchRadius The radius of the circular region with the center being the click event location
    blocks (41)
  • TouchRadiusLookup Whether to allow the click lookup to consider a touch region defined by a circle instead of a fixed point.
    blocks (40)
  • ReverseSortForLookup Whether to reverse the sort of the items array for drawing lookup. This allows the items array to be reversed when looking up which drawing item was touched.
    blocks (39)
  • BoundsCheck Whether to perform bounds checking. This improves drawing speed by not considering items that are outside of view bounds.
    blocks (38)
  • Cull Whether to cull the drawing items. This improves drawing speed by not considering items that are outside of view bounds.
    blocks (37)
  • Sort Whether to sort the drawing items. This greatly improves drawing speed.
    Paths must be defined in a counter-clockwise rotation order.
    blocks (36)

Returner Properties

  • Math PI return the value of PI (π)
    blocks (45)
  • DefaultValue return default value for various properties
    blocks (44)
  • PointOrigin return A point representing the origin. [0, 0, 0] [x, y, z]
    blocks (43)

Initialize

  • Initializes the Isometric Drawing view.
    blocks (11)

Clear

  • Clears the Isometric Drawing view.
    blocks (12)
  • Event when the Isometric Drawing view clear.
    blocks (10)

Click

  • Event triggered when a shape is clicked.
    blocks (9)

Error Occurred

  • Event triggered when an error occurs.
    blocks (8)

Properties For Point & Shape & Path

  • RotateZ Rotates a point, shape, or path about the origin on the Z axis.
    blocks (35)
  • RotateY Rotates a point, shape, or path about the origin on the Y axis.
    blocks (34)
  • RotateX Rotates a point, shape, or path about the origin on the X axis.
    blocks (33)
  • Scale Scales a point, shape, or path from a given originPoint, dx, dy, and dz.
    blocks (32)
  • Translate Translates a point, shape, or path by the given dx, dy, and dz.
    blocks (31)

Shapes

Cylinder, Knot, Octahedron, Prism, Pyramid and Stairs

  • Cylinder Creates a cylinder shape with the specified origin, radius, number of vertices, and height.
    blocks (25)
  • Knot Creates a knot shape with the specified origin.
    blocks (26)
  • Octahedron Creates an octahedron shape with the specified origin.
    blocks (27)
  • Prism Creates a prism shape with the specified origin, dx, dy, and dz.
    blocks (28)
  • Pyramid Creates a pyramid shape with the specified origin, dx, dy, and dz.
    blocks (29)
  • Stairs Creates a stairs shape with the specified origin and step count.
    blocks (30)

Shape Extrude

  • Creates an extruded shape from the specified path and height.
    blocks (24)

Path

  • Path Creates a path with the specified list of points.
    blocks (7)
  • Star Creates a star shape with the specified origin, outer radius, inner radius, and number of points.
    blocks (23)
  • Rectangle Creates a rectangle shape with the specified origin, width, and height.
    blocks (22)
  • Circle Creates a circle shape with the specified origin, radius, and number of vertices.
    blocks (21)

Point

  • PointXY Creates a point with the specified x and y coordinates.
    blocks (20)
  • PointXYZ Creates a point with the specified x, y, and z coordinates.
    blocks (19)

Color

  • Color Creates a color with the color block.
    blocks (15)
  • ColorWithAlpha Creates a color with the color block and alpha value.
    blocks (16)
  • ColorRGBA Creates a color with the specified RGBA values.
    blocks (17)
  • CreateColorRGB Creates a color with the specified RGB values.
    blocks (18)

ADD

  • Add Path Adds a path to the Isometric Drawing view.
    blocks (14)
    Add Shape Adds a shape to the Isometric Drawing view.
    blocks (13)

Download

Version 1

Library Used:

Source Code:

Notes:
1- I add description for all blocks you can read it by pausing the mouse cursor on the block.
2- This extension only for Create Isometric Shapes it is not support any type of animations.
3- This extension still beta maybe you will find some errors.

Should I have to explain how to use the extension?

  • Yeah
  • No

0 voters

9 Likes
#2

Nice extension, also wish you a blessed happy birthday :birthday:

1 Like
#3

Thank you so much! Your wishes mean a lot to me :heart:

#4

Nice Extension @mahmoud_hooda

2 Likes
#5

I add Doc for the extension

2 Likes