cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
mr-dang
Level 10

Pokemon Go game mechanics replicated

This is probably the last place you thought you would see mention of Pokemon Go--or maybe you would have hoped to not hear about it anymore 🙂

 

Let it be a testament to the "power" in PowerApps that it is possible to build a game like PokemonGo in PowerApps. The easy access to Acceleration, Compass, and Location functions make it possible. Here is a quick demonstration that uses Compass.Heading and Acceleration.Z to overlay an animated GIF on top of a camera control. It's pseudo-AR:

 

https://youtu.be/NAjE5peQlew (note: music plays about 5s in)

 

Steps:

  1. Create two screens. Create Button1 on Screen1 and set its OnSelect property to:
    Navigate(Screen2,Fade,{dirstart: Compass.Heading})
    Button1 navigates to Screen2 and sets a starting direction for a desired object to appear.

  2. In Screen2, create TextBox1 and set its Text property to:
    If(Compass.Heading>180,Compass.Heading-360,Compass.Heading)
    Normally, Compass counts from 0 to 360. This formula makes it so that it counts from 0 to +180 in the positive X direction, and from 0 to -180 in the negative X direction. This calculation is now a relative measurement. I imagine you could do without this, but it is easier to understand subsequent formulas with this change.

  3. Create Camera1. This next part is tricky depending on the ratio of your camera. I set my Camera's width to 2048 to fill the screen, but it may or may not work for you. I do not know how to make this dynamically change yet. It would be great if there were a "Fill" or a "Fit" property like there is for image boxes.

    I made the Camera spill over the canvas to show the middle. Set its X property to the midpoint of the screen:
    (Parent.Width-Camera1.Width)/2
  4. Create Image1. Set its X property to:
    (Parent.Width-Image1.Width)/2
    -Camera1.Width
    *If(TextBox1.Text-dirstart<=-180,360+TextBox1.Text-dirstart,TextBox1.Text-dirstart)
    /90
    Here's a breakdown of what's going on in this forumula:

    (Parent.Width-Image1.Width)/2

    This places the image in the midpoint of the screen, regardless of size.
    -Camera1.Width

    The Camera width will be subtracted for every 90 degrees. That explains why it is multiplied.
    *If(TextBox1.Text-dirstart<=-180,360+TextBox1.Text-dirstart,TextBox1.Text-dirstart)/90

    This part of the formula figures out how to keep the object in place by comparing your
    current compass bearing to the starting direction (dirstart). Like TextBox1, this condition
    makes the Compass reading relative to zero, which is the starting location of Image1.

    The number 90 refers to the degrees of how often to subtract Camera1's width.
  5. Set the Y property of Image1 to:
    (Parent.Height-Image1.Height)/2
    -Camera1.Height
    *Acceleration.Z
    /5
    This is very similar to what is done for X. The Acceleration amount did not need to be recalculated like Compass since the scale seems to be 0-10. It seems easy enough to use. For every 5 points of Acceleration in the Z direction (tilt), Camera1's height will be subtracted.

 

Is anyone else on this forum building games with PowerApps? I'd love to see what other work-arounds are being used to create game elements.

Microsoft Employee
@8bitclassroom
5 REPLIES 5
EvanChaki
Level: Powered On

Re: Pokemon Go game mechanics replicated

Great job with this!

Confluent
Power Automate Staff Audrie-MSFT
Power Automate Staff

Re: Pokemon Go game mechanics replicated

We have a new apps gallery coming out this week. Would love this app there if you still have it.

 

Love it!

Audrie

mr-dang
Level 10

Re: Pokemon Go game mechanics replicated

Hi @Audrie-MSFT

I'm prepping a sample app with parallax and the mechanics in this one. I do not have a barebones app with just these steps--but if you need one right away I can make that. Let me know what your timeline is.

Brian

Microsoft Employee
@8bitclassroom
Power Automate Staff Audrie-MSFT
Power Automate Staff

Re: Pokemon Go game mechanics replicated

@mr-dangYour timeline is my timeline! Whenever you have a chance, I'd love to include it in our upcoming App Gallery with your lessons learned and tips.

 

Thank you so very much!

Audrie

MrB
Level: Power Up

Re: Pokemon Go game mechanics replicated

 Very much looking forward to seeing more of this

Helpful resources

Announcements
New Ranks and Rank Icons in April

'New Ranks and Rank Icons in April

Read the announcement for more information!

Better Together’ Contest Finalists Announced!

'Better Together’ Contest Finalists Announced!

Congrats to the finalists of our ‘Better Together’-themed T-shirt design contest! Click for the top entries.

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

thirdimage

Community Summit North America

Innovate, Collaborate, Grow - The top training and networking event across the globe for Microsoft Business Applications

Top Solution Authors
Top Kudoed Authors
Users online (9,328)