App Inventor Help

[Shannon Suda]

Our class has used your website for reference often during my App and Game Design class.  It's my first time teaching the class and I'm still getting to know app inventor.

One of my students has created a golf game and he's stuck. I'm embarrassed to say that I can't help him at this time.  He has a golf game with his personal predesigned course as a sprite.  We tried to play with the sprits and backgrounds, but we ran out of time. 

It feels like something simple that I'm missing. I've scoured the web for answers with no success and I was wondering if you would take a look.  Attached is the aid file, and I've requested the aia file as well.

Please let me know your thoughts

[SteveJG]

The X'd block is incorrect ... the reference there should  the block should be one of the edges or another sprite that is rectangular.  The bounce is off the rectangular sides even though they are rectangular.  (this was edited)

• Has he (and you) read the following:
• Chapter 17. Creating Animated Apps

• and   http://ai2.appinventor.mit.edu/reference/components/animation.html  
• and done any of the following tutorials:
  
• Chapter 5. Ladybug Chase
  

• Chapter 3. MoleMash

Both tutorials involve animation..One of them shows what your student probably wants to do to describe a collision and what happens when there is a collision..

Regards,

Steve

[Pixii Bomb]

SOMETHING I NOTICED:
When GolfBall_2 is flung, it's boundaries are within the Canvas. So it will continue to move in any direction on the Canvas, regardless of the black "boundary" image.
Lvl_1.jpg and Lvl_1Collision.png are still rectangles, regardless if one of those images has a transparent background. The collision detection is a rectangle. The "black boundary" could be in the shape of an elephant, but it's collision detection would still be the invisible rectangular dimension of the elephant.

So when the golf ball is IN the golf course, than the golf ball has already collided with the golf course.

The alternative would be "No Longer Colliding With"
In which the ball would move out of the bounds of the golf course, which could create a visual issue, but would allow your student to detect when the ball is going out of the golf course background.
BUT STILL, this would only detect the rectangular shape of the golf course.

The golf course dimensions are: 391x221
So if the golf ball is flung horizontally from it's starting position, and hits at (76,18) - it would still continue to move horizontally in the white space of the image.

The OTHER alternative would be to create "invisible" sprite boundaries around the black boundary. This would allow you to detect if the golf ball is out of bounds. (Refer to the image posted)
Each ugly shade of yellow represents an Image Sprite. The image sprites would simply be transparent/invisible images.
EXCEPT there is still an issue with the triangular shaped image sprite. As stated earlier, regardless of it's shape, it's collision detection would still be a rectangle.

OFF TOPIC TIP:
I'm guessing from the Screen Names that your student plans on making a different screen for each level. (When the user hits the [Start] button, s/he is taken to Screen Name: Lvl_1)
Last I checked (I'm not sure if this was changed in the recent update), AI2 developers have a limited amount of screens. (I believe 12 is the max)

If your student creates a different screen for each level, then s/he is limiting the app to have only 10 levels. (Since there is a "Start" screen and an "Instructions" screen)
Additionally, a lot of the blocks your student creates on Lvl_1 will need to be copied/pasted throughout the other "level" screens. Which means unnecessary redundancy.

I would suggest showing your student simple tricks to changing the level within one screen.
(For Example: your student wouldn't need to create an entire new screen just because the Golf Course changed. Each Golf Course background should be named "golfcourse_1.png, golfcourse_2.png, etc". Then use a Join block to adjust the Level.Picture to "golfcourse_"+level+".png")

I'm sure your student is only working on this assignment for a few days, but it's something to think about for their future apps.

[SteveJG]

Oh, the Lvl_collision is an ImageSprite that looks like this:

and the idea is to bounce off the edges or another sprite.  This is a large sprite with a transparent background.

The sprites in App Inventor are ALLWAYS rectangles. They MUST be rectangles, even though they have transparent backs.  To keep the golf fairway to control the course of the ball the developer cannot use a SINGLE image as a barrier.

Break this up into 12 thin sprites, essentially thick lines with very thin 'widths' and various 'lengths'  and position them appropriately on the screen.

Sorry, I do not believe there are any shortcuts as interesting as your idea is to use a single sprite. Perhaps someone else will have other opinions.

edit .. possibly there is a way ... see Scotts post here https://groups.google.com/forum/#!topic/mitappinventortest/J6b8eVGcP54    He is making a maze and uses pixel colors to control movement.  Possibly that could work?

To get the ball to bounce off each, each must probably be named as an object to collide with and depending on which object is struck, to have an appropriate reaction. In fairness,

I have not tried this.

Simply, this fairway large sprite cannot be used as a bounding barrier.to contain (restrict) the movement of the ball.

Regards,

Steve