[FREE] Component tools extension

Description

Hello everyone,
Today i introduce my second extension which is component tools extension. This extension allows you to get and set some components features, move the component and reposition it, And much more!

important: may be you find some blocks which exists in kodular. Those blocks are made for app inventor users ( i will post a similar topic on their community )

Blocks picture

Documantation

I didn’t put the methods documentation that already exist in kodular ( not so much only 5)

Error
component_event (13)
This event is triggered when an error occurs.
Error ~ String

MoveCanceled
component_event (15)
This event is triggered when the current movement cancels.

MoveCompleted
component_event (16)
This event is triggered when the current movement ends.

MoveStarted
component_event (17)
This event is triggered when the current movement ends.

CancelMovement
component_method (14)
Cancels The current movement.

PauseMovement
component_method (15)
Pauses The current movement.

ResumeMovement
component_method (16)
Resumes The current movement.

IsMovementRunning
component_method (17)
Returns true if the current movement is running at the moment. ( not completed, ended or paused.)

IsMovementPaused
component_method (18)
Returns true if the current movement is paused at the moment. ( not running, canceled, ended or resumed.)

MoveHorizontally
component_method (19)
Moves the component in horizontal way. may be it sounds like overshot component block.Well may be it results same result but its different .
px ~ int
component ~ component
duration ~ int ( in milliseconds )

MoveVertically
component_method (20)
Moves the component in vertical way. may be it sounds like overshot component block.Well may be it results same result but its different .
px ~ int
component ~ component
duration ~ int ( in milliseconds )

MoveInCustomPath
component_method (21)
Moves the component in fully customizable path.
component ~ component
duration ~ int ( in milliseconds )
Left ~ int
Top ~ int
Right ~ int
Bottom~ int
StartAngle ~ int
SweepAngle ~ int
ForceMoveTo ~ int

PerformClick
component_method (23)
Performs a click on any component you want .
component ~ component

PerformLongClick
component_method (24)
Performs a long click on any component you want .
component ~ component

SetBottomPosition
component_method (25)
Sets the bottom position of any component you want .
component ~ component

SetRightPosition
component_method (26)
Sets the right position of any component you want .
component ~ component
right ~ int

SetLeftPosition
component_method (27)
Sets the left position of any component you want .
component ~ component
left ~ int

SetTopPosition
component_method (41)
Sets the top position of any component you want .
component ~ component
top ~ int

SetRotation
component_method (30)
Sets the rotation of any component you want .
component ~ component
rotation ~ int

SetRotationX
component_method (31)
Sets the rotation X of any component you want .
component ~ component
rotationX ~ int

SetRotationY
component_method (32)
Sets the rotation Y of any component you want .
component ~ component
rotationY ~ int

SetScaleX
component_method (33)
Sets the Scale X of any component you want .
component ~ component
ScaleX ~ int

SetScaleY
component_method (34)
Sets the Scale Y of any component you want .
component ~ component
ScaleY ~ int

SetShadowElevation
component_method (35)
Sets the Shadow elevation of any component you want .
component ~ component
shadowElevation ~ int

SetX
component_method (37)
Sets the X position of any component you want .
component ~ component
x ~ int

SetY
component_method (38)
Sets the y position of any component you want .
component ~ component
y ~ int

GetX
component_method (39)
Gets the x position of any component you want .
component ~ component

GetY
component_method (40)
Gets the y position of any component you want .
component ~ component

RegisterComponent
component_method (42)
Register component so the extension can detect touches on it.
Component ~ Component

Touched
component_event (18)
This event is triggerred when a component is touched.The action is returned in the action parameter.
Component ~ Component ( the component which is clicked )
info ~ String ( A detailed info about the touch in json format )
x ~ int ( X positions of the first touch place )
y ~ int ( Y positions of the first touch place )
action ~ String ( Action name of the action occurred.)
Thanks for @Zia_Choudhary and @themaayur

Valid action types

ACTION_BUTTON_PRESS

ACTION_BUTTON_RELEASE

ACTION_CANCEL

ACTION_DOWN

ACTION_HOVER_ENTER

ACTION_HOVER_EXIT

ACTION_HOVER_MOVE

ACTION_MASK

ACTION_MOVE

ACTION_OUTSIDE

ACTION_POINTER_DOWN

ACTION_POINTER_INDEX_MASK

ACTION_POINTER_INDEX_SHIFT

ACTION_POINTER_UP

ACTION_SCROLL

ACTION_UP

SetZ
component_method (43)
Sets the Z position of any component you want.
Component ~ Component
z ~ int
Thanks for @broekmancompany

GetZ
component_method (44)
Gets the Z position of any component you want.
Component ~ Component
Thanks for @broekmancompany

The extension also have some get padding blocks and get scale x and get scale y… Also get rotation rotation Y, and rotation X… Also i have get top, bottom, right and left position.

P.S: next time i will not add that number of blocks again because of the number of blocks in the documentation.

This extension have 43 methods and 5 events.

Usage example

Real-time update And multiple thumb support:

https://firebasestorage.googleapis.com/v0/b/myhtmlpage-fafe8.appspot.com/o/20200818-224004-720x1280.mp4?alt=media&token=57538518-e122-40d0-b103-591e658a242f
Test AIA: RealtimeTest (3).aia (22.3 KB)
Test APK: RealtimeTest (4).apk (5.0 MB)
Usage example2:

Move your components:

As you know the extension have some blocks that controls the movement of the components.This usage example describes how to use this blocks.
You can try this apk by touching a component then writing its id and press move,pause,resume.

blocks:

Download links:
RealtimeTest (2).aia (23.7 KB)
RealtimeTest (3).apk (5.0 MB)

Download links

AIX: io.mohamed.ComponentTools.aix (21.9 KB) (20.6 KB) ( V3 )
AIA: i will provide it soon.

Credits

Thanks for any one supported and helped me.I hope you like this extension :slightly_smiling_face:
Please if you have any suggestions or improvements or Some spelling mistakes please tell me :hugs:
If you liked, don’t forgot to hit the like button below :grin:.
Also another extensions are coming from me soon :sweat_smile:.

Regards,
Mohamed Tamer

89 Likes

Wow! That’s a great work :+1: Appreciated :hugs:

3 Likes

Thanks very much @WatermelonIce :grin:
#off-topic
Congratultions :partying_face: i see that you became a ProKoder.

3 Likes

Very useful extension, i like it :partying_face:

2 Likes

Thanks @Piman :grin: happy you like it :grinning:

2 Likes

Great Extension :ok_hand:
It would be good if you provide a test apk. Anyways nice keep it up.

2 Likes

A helpfull extension.provide some demo first​:slightly_smiling_face:

2 Likes

Here we have method for long click, but no event to detect the long click. Or it works in another way.
Same for some other methods.

2 Likes

I gave you the Extension Developer badge.

14 Likes

Thanks so much !!!
Your work helps the community a lot, please continue to do so !!!
:clap:

3 Likes

Good Job :+1::+1::+1::+1:


Thank you @Peter :heart:

2 Likes

@Mohamed_Tamer
Great job… Mind blowing extension :heart::heart::heart:

2 Likes

Nice extension

2 Likes

Thanks very much @themaayur

Of course i will provide today a test apk :wink:

Thanks very much @msr79526.And i will provide a demo aia and apk soon.

That method calls the component native long click and click events.It will not require an external event.

:partying_face: :partying_face:
Thanks very much @Peter :heart_eyes:

Thanks very much @vknow360 :smiling_face_with_three_hearts:

Thanks @Zia_Choudhary very much :grin:

Thanks @ShaikhSajidAli :grin:

Thanks very much @bestprintsf of course i will continue i’m already working on another extension today :shushing_face:.

5 Likes

Ohh,I thought I can be used to detect a click on components, which by default dosen’t have that property.

2 Likes

I can ad that of course.I will add this in the next update.Also i’ll try to add some other features like long click,etc…

3 Likes

Nice, so after that we can’t detect a long click in a arrangement too.

2 Likes

One question
As for now we cannot make vertical and horizontal arrangements full clikable

But with this extension is it possible??

I can’t test by myself as i don’t have access to my computer right now

1 Like

Not with this version but

3 Likes

You mean that it consume all the clicks on the components inside as in the card view?
that can be implemented also but not in this extension. I’m going to publish soon a layout tools extension.That will be one of its features :grin:

3 Likes