cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
ericonline
Level 10

Gallery Overlay Question

Hi @mr-dang. I'm using a method you or Mehdi showed off a while ago, the "Ol' Gallery with TemplateSize=0" trick. I found something very interesting I was hoping someone could weigh in on.

Setup

  • Gallery (the "overlay")
    • Width: Screen.Width
    • Height: Screen.Height
    • TemplateSize: 0
    • Holds 2 controls, a Label and an Icon (map pin)
  • Image Control set to a map image
    • Underneath the overlay
  • ClearCollect Function when user clicks nav button to get to map screen
    • ClearCollect(colMapPins,
          {region: "System Wide-1", x: 140, y: 180},
          {region: "System Wide-2", x: 140, y: 310},
          {region: "West-1", x: 317, y: 145}, <---
          {region: "West-2", x: 527, y: 139}, <---
          {region: "West-3", x: 460, y: 399},
          {region: "West-4", x: 280, y: 335},
          {region: "East-1", x: 620, y: 240},
          {region: "East-2", x: 775, y: 115}, <---
          {region: "East-3", x: 923, y: 300},
          {region: "East-4", x: 636, y: 455}
      )

Issue:

  • See how "West-1", "West-2", and "East-2" are lined up horizontally in this image YET QUITE DIFFERENT in their Y value above?
  • It is more pronounced the further to the right of the screen the Control moves. 
    • image.png
  • To illustrate even more, I put an Icon control directory over "West-2". It's Y value is quite different than the Collection Y value for "West-2" (+~30px).
    • image.png 

Questions: 

  • My goal is to translate Lat/Longs to pixels based on the mapsize/screensize but this offset is affecting that translation.
  • How are two map pins set to the exact same X, Y in the Collection rendered in different places on the Screen?
  • How come the Collection X, Y values don't match the X, Y values of an Icon placed on the screen?

Thanks for your insights!

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
mr-dang
Level 10

Re: Gallery Overlay Question

Hi @ericonline,

Because the templatesize=0 is a trick, you will come across unexpected behaviors. What you are experiencing is that each object really has its Y value offset by n-1 pixels. So the 3rd row in the gallery is 2 pixels off. The 100th record is 99 pixels off.

 

You just need to set the Y property of the controls to 

-(n-1)

where n is the index of the record (what part of the sequence is it).

Microsoft Employee
@8bitclassroom
11 REPLIES 11
wyotim
Level 10

Re: Gallery Overlay Question

While I don't have any help to offer, could I inquire about the "Ol' Gallery with TemplateSize=0" trick? Do you have a link to the post about this? I would love to check it out. If I am understanding what you are doing, it basically allows plotting any points over a surface? Wowza!

 

If I could also trouble you for more information, how are you translating the Lat/Longs to pixels? I started to look into Mercator projections and Web Mercator a bit before getting thrown into some hectic stuff at work recently. Are you using something like that?

 

Hope you get the y-coordinate issue resolved soon. The map and pins look awesome!

Highlighted
mr-dang
Level 10

Re: Gallery Overlay Question

Hi @ericonline,

Because the templatesize=0 is a trick, you will come across unexpected behaviors. What you are experiencing is that each object really has its Y value offset by n-1 pixels. So the 3rd row in the gallery is 2 pixels off. The 100th record is 99 pixels off.

 

You just need to set the Y property of the controls to 

-(n-1)

where n is the index of the record (what part of the sequence is it).

Microsoft Employee
@8bitclassroom
ericonline
Level 10

Re: Gallery Overlay Question

Tell ya what @wyotim... Since I've been meaning to create one... I'll do my first YouTube video tonight on the subject then send you a link. Smiley Happy

wyotim
Level 10

Re: Gallery Overlay Question

Awesome! I am looking forward to it! While I am sure I am pretty late to the party, discovering more and more of what galleries can do is blowing my mind a bit. Amazing potential there.

ericonline
Level 10

Re: Gallery Overlay Question

Thank you very much @mr-dang. I'll adjust the overlay logic. I'll also be sure to preface any promotion of this trick so folks know its a "hack" and not necessarily part of PowerApps functionality.

Super User
Super User

Re: Gallery Overlay Question

Hi @ericonline,

I'd love it if you could send me your YouTube link too :-)

ericonline
Level 10

Re: Gallery Overlay Question

Oh yeah! I'll post it up here.. Smiley Happy

seadude
Level 10

Re: Gallery Overlay Question

As promised: Here is a You Tube video on the topic Smiley Happy

Sample app attached if it helps.

Some caveats:

  • Probably shouldn't relay on this in production apps as I don't think its officially supported functionality
  • When you change the orientation in your app (File/App Settings/Orientation), the map pins will be affected and you'll need to re-enter the X coordinates.
  • You will need to tweak the map pin Y coordinates according to @mr-dang 's advice above to be 100% accurate

Hope this helps inspire some creativity!

wyotim
Level 10

Re: Gallery Overlay Question

@ericonline@seadude   Awesome video! I will definitely be trying this out soon. And I am looking forward to your next one, whenever that may be!