[Paid] CustomLetter allows users to display and animate letters with customizable

🧩 CustomLetter

An extension for MIT App Inventor 2.
developed by th using Fast.
A custom component for creating and animating letters in App Inventor.
allows users to display and animate letters with customizable colors,n sizes, and various animation effects.
Telegram | GitHub
Blogger | YouTube
Find More Extension
Terms & Conditions

:memo: Specifications


:package: Package: io.th.customletter.customletter
:floppy_disk: Size: 22.88 KB
:iphone: Minimum API Level: 7
:date: Updated On: 2025-04-09T18:30:00Z
:computer: Built & documented using: FAST v2.8.3
Paid Buy UPI 180rs
USD 2$

New Update V1.2 :boom: :boom:
Date 14/04/2025

  • Package name - CustomLatter to CustomLetter
  • Bugs fix and add new blocks

Demo



Blocks

AnimationStart_Event
GroupAnimationEnd_Event
GroupAnimationStart_Event
AnimationEnd_Event


SelectLetter_Method
StartGroupAnimation_Method
Animation_Method
Initialize_Method

New
Cleanup_Method


LetterHeight_Set_Property
ArmsColor_Set_Property
BodyColor_Set_Property
LegsColor_Set_Property
LegsWidth_Set_Property
Separator_Set_Property
StrokeColor_Set_Property
StrokeWidth_Set_Property
LetterWidth_Set_Property

New
Elevation_Set_Property
ShadowColor_Set_Property
ShadowOffsetX_Set_Property
ShadowOffsetY_Set_Property
ShadowRadius_Set_Property

Events:

CustomLetter has total 4 events.

:yellow_heart: AnimationStart

Event raised when animation starts

Parameter Type
animationType text

:yellow_heart: AnimationEnd

Event raised when animation ends

Parameter Type
animationType text

:yellow_heart: GroupAnimationStart

Event raised when group animation starts

:yellow_heart: GroupAnimationEnd

Event raised when group animation ends

Methods:

CustomLetter has total 5 methods.

:purple_heart: Initialize

Initialize inside an arrangement.

Parameter Type
arrangement component

:purple_heart: SelectLetter

Select letters to animate (use separator to add multiple letters). Use
in your letter string to create multiple lines. For example: "H E L L O" (single line), "H E LnL O" (two lines), "H EnL LnO (three lines)

Parameter Type
letters SelectLetter (helper blocks)
  • Enums for SelectLetter: A, B, C, D, E, F, G, H, I, J, K, L, M, N, O, P, Q, R, S, T, U, V, W, X, Y, Z

:purple_heart: Animation

Apply animation to selected letter: bounce, shake, rotate, fade, scale, wave, flip, pulse, swing, spiral, pop, elastic, rubberband

Parameter Type
animationType AnimationType (helper blocks)
  • Enums for AnimationType: Bounce, Shake, Rotate, Fade, Scale, Wave, Flip, Pulse, Swing, Spiral, Pop, Elastic, Rubberband

:purple_heart: StartGroupAnimation

Start group animation

:purple_heart: Cleanup

Clean up resources when component is no longer needed

Setters:

CustomLetter has total 14 setter properties.

:green_heart: BodyColor

Sets the body color of the letter

  • Input type: number

:green_heart: ArmsColor

Sets the arms color of the letter

  • Input type: number

:green_heart: LegsColor

Sets the legs color of the letter

  • Input type: number

:green_heart: LegsWidth

Sets the width of legs stroke

  • Input type: number

:green_heart: Separator

Sets the separator character for multiple letters like "H#E#L#L#O" (if # is set as separator) or use the default space separator

  • Input type: text

:green_heart: LetterWidth

Sets the width of each letter

  • Input type: number

:green_heart: LetterHeight

Sets the height of each letter

  • Input type: number

:green_heart: StrokeWidth

Sets the stroke width for letters

  • Input type: number

:green_heart: StrokeColor

Sets the stroke color for letters

  • Input type: number

:green_heart: ShadowColor

Sets the shadow color for letters

  • Input type: number

:green_heart: ShadowRadius

Sets the shadow radius (blur) for letters

  • Input type: number

:green_heart: ShadowOffsetX

Sets the horizontal shadow offset

  • Input type: number

:green_heart: ShadowOffsetY

Sets the vertical shadow offset

  • Input type: number

:green_heart: Elevation

Sets the elevation (material design shadow) for letters

  • Input type: number

Should it be "CustomLetter" ?

3 Likes

I updated in V1.2

  • Package name - CustomLatter to CustomLetter
  • Bugs fix and add new blocks
    and add new blocks :boom: :boom: