This Assignment was made for you to practice with ConstraintLayout and to get more comfortable with creating buttons with onClick methods connected to them. In this app, when you click on one of the buttons on the lower part of the screen, the image moves in that direction. This is done by changing the layout margin of the image view in the onClick methods. Since we are just changing margins, the image may behave weirdly once you try to move it past the edges of the screen since it isn't made to be manipulated past the normal limits$.$ Be sure to check out the codelabs mentioned in $[$DO$]$ Week $1$: Learning Layouts.

You are free to choose whichever image and styling for your app, but I do want you to make your layouts similar to the way I have them done. As you can see in the image I have attached below, the layouts of the buttons are mostly constrained to each other, with the Down button being the only one that has a constraint touching the bottom of the screen. The reason why this is important is that since the buttons don't have margins setting their current location, this screen layout will be a lot more flexible with different screen sizes.

If you are having trouble figuring out how to move the image through the Java code when a button is pressed, start a conversation on either the discussion section or on Discord and I will provide a hint there if no$-$one else chimes in$.$ You are recommended to try to solve it without a hint, but if you gave it a good shot and still feel stuck, go ahead and take a look.

What your App should look like $($excluding colors, specific image, and application name$)$:

Screenshot of example app

What your Layout Constraints should be similar to:

reallyReinforcing$\_$LayoutHints.jpg

Required Components:

ImageView: The image that the buttons will be moving

Movement Buttons: Each press should move the ImageView a certain amount, I chose to move it $50$dp per press $($you can choose a different amount if you want to$)$

Up Button: Moves the ImageView towards the top of the screen

Right Button: Moves the ImageView towards the right$-$hand side of the screen

Down Button: Moves the ImageView towards the bottom of the screen

Left Button: Moves the ImageView towards the left$-$hand side of the screen

Reset Button: Resets the ImageView back to the center. For the way I implemented it$,$ I set the margins back to $0,$ which should reset it back to where it started

Additional Requirements

At least one onClick method should be attached in the onCreate method $($with an anonymous class or a lambda expression$)$

The Layout for the buttons and the ImageView is similar to the provided picture

A screenshot image of the completed app, looking similar to the one above.