[FREE/OS] Repositioning Tools extension

[Mohamed_Tamer]

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..

---

Blocks picture

---

Designer properties

---

Documentation

Block	Description
	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
	This event is raised when there is an error. Params Type Description error String The error message
	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
	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.
	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
	Sets the shadow elevation when the component is being dragged. Params Type Description ElevationShadow Number (int) The shadow elevation value
	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

• Version 1
  • initial release
• Version 2
  • Change Log
• Version 2.1
  • Change Log
• Version 3
  • Change Log

---

Usages

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

Blocks:

[FREE/OS] Repositioning Tools extension

Here is the sample blocks for swipe to remove list view.It needs a block from the next update to be improved.That why i didn’t post it: I’ve used @themaayur simple list view with icon blocks [blocks (33)] Anf for creating and registering: [blocks (34)] And for removing on drag: [blocks (35)]

---

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 ) for reporting bugs with this extensions.
Thanks for any one who liked this extension .If you’ve liked it please hit the like button
Any suggestions,bugs will be considered, just tell me below and i will try my best to implement it

Regards,
Mohamed Tamer

[msr79526 (SR Official)]

Another Beast extension. Thanks for your contribution

[FahadAhmad]

Excellent work @Mohamed_Tamer!

[Vaibhav]

Great Extension @Mohamed_Tamer

Long ago there was discussion about Absolute arrangement being tested

Absolute Arrangement being tested in App Inventor

Something great is brewing in the App Inventor Lab. Absolute arrangement: Adds a new arrangement that allows for positioning visible components anywhere on the screen, like the Canvas allows for sprites. Each component gains X, Y, and Z coordinates, which can be adjusted in both the designer and the blocks. Positioning can be done using absolute pixels or percentages. It is still in the testing fase but i can show you a little what you can do with it. [image] What do you think? Will it help…

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!

Thanks again for this wonderful Extension

[Mohamed_Tamer]

@Vaibhav

Long ago there was discussion about Absolute arrangement being tested

Yes i know about this

@Vaibhav

Is it similar to the gif shown in the original post there?

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 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.

[themaayur (Mayur Berad)]

Great Extension

Sounds wonderful, keet it up @Mohamed_Tamer

[Vaibhav]

Oh ok got it!

[Mohamed_Tamer]

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

[AryanGupta]

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

[The_K_Studio (Karan M.)]

Very nice extension. Good work.

[nikzdevz]

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

[Mohamed_Tamer]

Thanks very much @The_K_Studio

@nikzdevz

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

Off Topic
Try now

[nikzdevz]

Off Topic now its working you may check the message

[gurusonwheels (Brian)]

@Mohamed_Tamer

usage examples for it

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 .

[Italo]

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

[Mohamed_Tamer]

@gurusonwheels

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 .

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

@Italo

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

thanks very much @italo !

[Mohamed_Tamer]

@gurusonwheels

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

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
https://kodular-community-uploads.s3.dualstack.eu-west-1.amazonaws.com/original/3X/9/9/99d95e7a438b59e53089dcf567da832bf8842b21.mp4

[Mohamed_Tamer]

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

How to make a swipe down to uncover like this one too

I am trying to make something similar to this but I can’t figure out how to go about doing it. [WordBit-French]

[gurusonwheels (Brian)]

ok , i see . thanks for that

[Quicky_Superglad]

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