[Free] MathFlowers Lets Create beautiful mathematical flower patterns on a canvas

MathFlowers

An extension for MIT App Inventor 2 by th

šŸ§© MathFlowers

An extension for MIT App Inventor 2.
MathFlowers lets you create beautiful mathematical flower patterns on a canvas.
Set numerator and denominator values to create different patterns,
customize colors, line thickness, and special effects like oil paint or dashed lines. Animate your flowers with adjustable speed and rotation.
or generate random flowers. You can also control the animation speed, pause/resume drawing, and rotate the flower.
You can also save the flower as a PNG or JPEG image file.
Telegram | GitHub
Blogger | YouTube
Find More Extension
Terms & Conditions

:memo: Specifications


:package: Package: io.th.mathflowers.mathflowers
:floppy_disk: Size: 19.3 KB
:iphone: Minimum API Level: 7
:date: Updated On: 2025-03-16T18:30:00Z
:computer: Built & documented using: FAST-CLI v2.7.0
:heavy_dollar_sign:Donation are welcome
:arrow_down: Download aix io.th.mathflowers.mathflowers.aix (19.3 KB)
:white_check_mark: Download aia math_flower.aia (146.5 KB)
:placard: More info on GitHub

Screen Shots

MathFlowers-1742112908565


MathFlowers-1742114416462


MathFlowers-1742115988552


MathFlowers-1742117306305 png


photo_2025-03-17_16-40-48


blocks (1)


Events:

MathFlowers has total 6 events.

FlowerCompleted_Event

:yellow_heart: FlowerCompleted

Event triggered when flower drawing is completed

FlowerStarted_Event

:yellow_heart: FlowerStarted

Event triggered when flower drawing starts

FlowerProgress_Event

:yellow_heart: FlowerProgress

Event triggered when flower drawing progress changes

Parameter Type
percentComplete number

FlowerError_Event

:yellow_heart: FlowerError

Event triggered when an error occurs

Parameter Type
errorMessage text

FlowerCleanedUp_Event

:yellow_heart: FlowerCleanedUp

Event triggered when flower resources are cleaned up

ImageSaved_Event

:yellow_heart: ImageSaved

Event triggered when an image is successfully saved

Parameter Type
filePath text

Methods:

MathFlowers has total 17 methods.

Initialize_Method

:purple_heart: Initialize

Initialize the flower drawing with a canvas

Parameter Type
canvas component

BackgroundColorRGB_Method

:purple_heart: BackgroundColorRGB

Set background color using RGB values

Parameter Type
red number
green number
blue number

BackgroundColorARGB_Method

:purple_heart: BackgroundColorARGB

Set background color using ARGB values (with alpha transparency)

Parameter Type
alpha number
red number
green number
blue number

TransparentBackground_Method

:purple_heart: TransparentBackground

Set transparent background

GradientBackground_Method

:purple_heart: GradientBackground

Set gradient background. Example: SetGradientBackground(Color.RED, Color.BLUE, true)

Parameter Type
startColor number
endColor number
isVertical boolean

GenerateRandomFlower_Method

:purple_heart: GenerateRandomFlower

Generate a new random flower

DrawFlower_Method

:purple_heart: DrawFlower

Draw a flower with specific n and d values. For example, DrawFlower(5, 2) creates a 5-petaled flower, while DrawFlower(7, 3) creates a more complex pattern. The ratio n/d determines the flower's shape.

Parameter Type
numerator number
denominator number

PauseDrawing_Method

:purple_heart: PauseDrawing

Pause the current drawing

ResumeDrawing_Method

:purple_heart: ResumeDrawing

Resume the paused drawing

RotateFlower_Method

:purple_heart: RotateFlower

Rotate the flower by specified degrees

Parameter Type
degrees number

ExportFlowerParameters_Method

:purple_heart: ExportFlowerParameters

Export current flower parameters as a list containing n, d, and rotation values. Example: ExportFlowerParameters() might return a list like [5, 3, 45] for a flower with n=5, d=3, and 45 degree rotation

ImportFlowerParameters_Method

:purple_heart: ImportFlowerParameters

Import and apply flower parameters from a YailList. Example: ImportFlowerParameters(list(5, 3, "#FF0000", 2, 45)) to create a flower with n=5, d=3, red color, thickness 2, and 45 degree rotation

Parameter Type
params list

Cleanup_Method

:purple_heart: Cleanup

Clean up resources and stop drawing

SaveAsPNG_Method

:purple_heart: SaveAsPNG

Save the current flower drawing as a PNG image file. Triggers ImageSaved event with the file path if successful.

Parameter Type
fileName text

SaveAsJPEG_Method

:purple_heart: SaveAsJPEG

Save the current flower drawing as a JPEG image file with specified quality (1-100). Triggers ImageSaved event with the file path if successful.

Parameter Type
fileName text
quality number

IsStorageAvailable_Method

:purple_heart: IsStorageAvailable

Check if external storage is available for saving images

SetDashedLine_Method

:purple_heart: SetDashedLine

Set dashed line properties (enable, dash length, gap length)

Parameter Type
enable boolean
dashLength number
gapLength number

Setters:

MathFlowers has total 12 setter properties.

BackgroundColor_Set_Property

:green_heart: BackgroundColor

Set background color of the pattern view

  • Input type: number

BackgroundAlpha_Set_Property

:green_heart: BackgroundAlpha

Set background alpha (transparency) value (0-255)

  • Input type: number

Numerator_Set_Property

:green_heart: Numerator

Get the current n value

  • Input type: number

Denominator_Set_Property

:green_heart: Denominator

Get the current d value

  • Input type: number

AnimationSpeed_Set_Property

:green_heart: AnimationSpeed

Set the animation speed (milliseconds between frames)

  • Input type: number

OilPaintEffect_Set_Property

:green_heart: OilPaintEffect

Enable or disable oil paint effect

  • Input type: boolean

OilPaintRadius_Set_Property

:green_heart: OilPaintRadius

Set the oil paint effect radius (1-10)

  • Input type: number

RoundedEdges_Set_Property

:green_heart: RoundedEdges

Enable or disable rounded edges for lines

  • Input type: boolean

CornerRadius_Set_Property

:green_heart: CornerRadius

Set the corner radius for rounded edges (1-20)

  • Input type: number

DashedLine_Set_Property

:green_heart: DashedLine

Enable or disable dashed line effect

  • Input type: boolean

DashLength_Set_Property

:green_heart: DashLength

Set the dash length for dashed lines (1-50)

  • Input type: number

DashGap_Set_Property

:green_heart: DashGap

Set the gap between dashes (1-50)

  • Input type: number

Getters:

MathFlowers has total 16 getter properties.

White_Get_Property

:green_circle: White

Returns the color White

  • Return type: number

Black_Get_Property

:green_circle: Black

Returns the color Black

  • Return type: number

Red_Get_Property

:green_circle: Red

Returns the color Red

  • Return type: number

Green_Get_Property

:green_circle: Green

Returns the color Green

  • Return type: number

Blue_Get_Property

:green_circle: Blue

Returns the color Blue

  • Return type: number

Transparent_Get_Property

:green_circle: Transparent

Returns a transparent color

  • Return type: number

Numerator_Get_Property

:green_circle: Numerator

Get the current n value

  • Return type: number

Denominator_Get_Property

:green_circle: Denominator

Get the current d value

  • Return type: number

AnimationSpeed_Get_Property

:green_circle: AnimationSpeed

Set the animation speed (milliseconds between frames)

  • Return type: number

OilPaintEffect_Get_Property

:green_circle: OilPaintEffect

Enable or disable oil paint effect

  • Return type: boolean

OilPaintRadius_Get_Property

:green_circle: OilPaintRadius

Set the oil paint effect radius (1-10)

  • Return type: number

RoundedEdges_Get_Property

:green_circle: RoundedEdges

Enable or disable rounded edges for lines

  • Return type: boolean

CornerRadius_Get_Property

:green_circle: CornerRadius

Set the corner radius for rounded edges (1-20)

  • Return type: number

DashedLine_Get_Property

:green_circle: DashedLine

Enable or disable dashed line effect

  • Return type: boolean

DashLength_Get_Property

:green_circle: DashLength

Set the dash length for dashed lines (1-50)

  • Return type: number

DashGap_Get_Property

:green_circle: DashGap

Set the gap between dashes (1-50)

  • Return type: number

Thanks

TechHamara

2 Likes