[FREE/OS] Repositioning Tools extension

Description

Hello everyone! Today, I’m introducing my third extension, which is Repositioning Tools extension. This extension give you the ability to drag your components any where on the screen, without needing to drop it in another arrangement. This will be useful for many users who are making animations and they need the user to drag something by himself , like swiping to delete or making parallax effect, etc…
I’ve called this extension repositioning tools and not drag tools ,etc… so i’ve the ability to update it with others repositoining tools like scaling,zooming,etc…:grinning:


Blocks picture


Designer properties

image


Documentation

Block Description
Draging This event is raised when the component is being dragged.

Params Type Description
component Component The component that’ve been dragged
x Number (int) The x position of the component that dragged
y Number (int) The y position of the component that dragged

Error This event is raised when there is an error.

Params Type Description
error String The error message

Dragged This event is raised when the component is dropped anywhere in the screen.

Params Type Description
component Component The component that’ve been dragged
x Number (int) The x position of the component that dragged
y Number (int) The y position of the component that dragged

RegisterAsDraggable Register component as draggable so the extension can detect drags on.

Params Type Description
component Component The component will be draggable
horizontal Boolean Determines if the component can be dragged horizontally
vertical Boolean Determines if the component can be dragged vertically

If both the horizontal and vertical parameters set to true, you can drag the component any where in the screen, horizontally and vertically.
Unregister Unregisters the component so the extension won't detect drags on the component, and the user can’t drag it anympre.

Params Type Description
component Component The component that has to be unregistered

SetElevationShadow Sets the shadow elevation when the component is being dragged.


Params Type Description
ElevationShadow Number (int) The shadow elevation value
SetElevationShadow Drags the component to a specific location.


Params Type Description
component Component The component to be dragged.
x Number (float) The x position for the component, to be dragged to.
y Number (float) The y position for the component, to be dragged to.

Screen recording


Updates


Usages

I will update this section here with new usages:
1- Swipe to remove list view:
Screen Recording:


Blocks:


Download links

AIA: RepositioingTools (1).aia (16.0 KB)
APK: RepositioingTools (1).apk (5.2 MB)
AIS: RepositioingTools_Screen1 (2).ais (5.4 KB)
AIX:
io.mohamed.repositioningtools.aix (23.3 KB)

Credits

A big thanks for @WatermelonIce for the new documentation table.
Thanks for @Vaibhav @ADDYLIN @topgatgets @WatermelonIce @sonumohammad333 @Aditya_Singh ( sorry if i forgot any one :sweat_smile: ) for reporting bugs with this extensions.
Thanks for any one who liked this extension :heart:.If you’ve liked it please hit the like button :grin:
Any suggestions,bugs will be considered, just tell me below and i will try my best to implement it :wink:

Regards,
Mohamed Tamer

84 Likes

Another Beast extension. Thanks for your contribution

2 Likes

Excellent work @Mohamed_Tamer! :+1:

3 Likes

Great Extension @Mohamed_Tamer

Long ago there was discussion about Absolute arrangement being tested :point_down:

Is it similar to the gif shown in the original post there?
If yes then the thoughts/possibilities at that time has turned to reality this time! :smiley:

Thanks again for this wonderful Extension

3 Likes

Yes i know about this :grin:

I don’t think so. Actually, the absolute arrangement allows us to set the coordinates of is child components from the designer and the block editor, my extension allows the user to set it him self by dragging the components registered in any place he want and not inside a specific arrangement as it will overlap on another components:grinning: But still, i developed another extension which have a block very similar to the absolute arrangement which is my Component tools extension’s set x,set y and set z blocks.

3 Likes

Great Extension :grinning_face_with_smiling_eyes:

Sounds wonderful, keet it up @Mohamed_Tamer

2 Likes

Oh ok got it!

3 Likes

BTW, thanks very much @themaayur @Vaibhav @FahadAhmad @msr79526 :heart:

3 Likes

thanks ,
it will help me too much in creating my project

5 Likes

Very nice extension. Good work. :+1:

2 Likes

@Mohamed_Tamer I need some help but i am unable to message you so would you like to message me ?
as problem is

3 Likes

Thanks very much @The_K_Studio

#off-topic
Try now :+1:

1 Like

#off-topic now its working you may check the message

2 Likes

was going to send this as a pm .
what are some usage examples for it ?

i can not for the life of me wrap my head around what this could be used for ?

if we was able to do that in designer that would be awesum . but would love to hear some examples to
get the creative juices flowing .

2 Likes

Very interesting! Thank you for your great contribution, and for making it free!

2 Likes

I will post a usage example here when i finish a bug with :+1:

thanks very much @italo !

2 Likes

Just made a quick usage example for the extension.I may made a usage guide for it when i finish the smooth removing ( and not the fast one you see) for it :wink:

10 Likes

Other usage examples;
That can be made with this extension :

2 Likes

ok , i see . thanks for that

1 Like

yes very good … i can make paralax and snackbar top bar easily using your extension. thank you

1 Like