Solved: Re: Images in Gallery don't show up in mobile App

dash_7 · ‎04-12-2021

Hello!

I am still having troubles with displaying images in a gallery. I know there are lots of similar topics - I have read through a lot of them but for some reason I do not find the solution.

I have the exact problem that is described in this blog post:

https://www.practicalpowerapps.com/images/powerapps-sharepoint-images-storing-and-viewing/#ViewLibra...

Whats my situation:

a Gallery in power apps based on a view in Azure SQL Server
one field in this view holds the URL to the image in a SP Library. I called it:

https://xyz.sharepoint.com/sites/Article/Article Images/a1/100162.jpg

I also tried this format

https://xyz.sharepoint.com/:i:/r/sites/Article/Article%20Images/a1/100162.jpg

My image property in the gallery is set to

ThisItem.path_[image]

Everything work on a PC but not in the mobile app. The images don't show up.

According to the blog mentioned above the solution would be to use

ThisItem.'{Thumbnail}'.Large

instead of

ThisItem.'Link to item' (what I using at the moment)

I'm just confused what the '{Thumbnail}' part should correspond to in my example...

Thanks!

WarrenBelz · ‎04-13-2021

Hi @dash_7 ,

Is the SPID in your SQL the actual ID of the Library Item? If so you can do a LookUp

LookUp(
   Library,
   ID=ThisItem.SPID
).'{Thumbnail}'.Large

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

View solution in original post

WarrenBelz · ‎04-12-2021

Hi @dash_7 ,

As this is my blog,

ThisItem.'{Thumbnail}'.Large

(you can also use .Small and .Medium) is the only way to show images from a SharePoint Library on a mobile device as a SharePoint URL will not work due to the way the app tries to resolve URLs anonymously (and SharePoint needs a login). As you are already using

ThisItem.'Link to item'

you are obviously already displaying the Library in a gallery - it is just a matter of changing the reference. What difficulties are you having with this?

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

dash_7 · ‎04-12-2021

Hello @WarrenBelz

I'm sorry. I don't know how else to explain:

This works. You can see part of the picture in the screenshot. My View holds a textfield 'Bild_[image]' with the URL like explained in my first post.

This does not work. I do not have a field 'Thumbnail' in my View. The data source of the gallery is a SQL view. I don't understand how this would connect to my SP library...it needs the url I would think...

WarrenBelz · ‎04-12-2021

@dash_7 ,

You need to connect the SharePoint Library and have an identifier in the Library matching an item stored in your main list. This is easier in SharePoint Lists - I just use the ID of the List item and store it in a field I call IDRef in the Library. The Gallery then simply looks up the Library for the matching value as per example below in one of my prod field apps used on iPads (we do over 15k photos annually)

I imagine SQL will have a unique identifier you can use.

As mentioned, you simply cannot resolve a SharePoint "external" URL on mobile device.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

dash_7 · ‎04-12-2021

@WarrenBelz

there is still one piece of the puzzle missing, sorry!

you said:

The Gallery then simply looks up the Library for the matching value as per example

How??

My gallery has the data source = sql view! There no connection to the sharepoint library by now!!

But in this view I have the image ID of the image file in sharepoint library. So I do have those corresponding fields: SQLView.ID and SharepointLibrary.ID

But how does this gallery get from the ID in the view to the file in sharepoint??

Of course I can create a gallery with the data source = Sharepoint Library. In this gallery I can add 'ThisItem.'{Thumbnail}'.Large' to the image property and the image is shown as expected.

But the part that missing for me is the connection from my (view-based)gallery to the sharepoint library.

WarrenBelz · ‎04-12-2021

Hi @dash_7 ,

You need to do it in the Flow when creating the photo item in the Library - one way is shown in the blog. You use Update file properties in the Flow and send the required value in Ask in Power Apps.

You may have to re-think your photo Library item creation, but this is the only way you will view the photos on mobile devices from a Library.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

dash_7 · ‎04-13-2021

hi @WarrenBelz

I'm sorry Warren! I really appreciate the time you take but I have say that your answers are often not helpful because you don't write the parts that would be the relevant information. No doubt, that I am the limiting factor here because I know so little about power apps... but still.

For example you write:

You need to do it in the Flow when creating the photo item in the Library - one way is shown in the blog.

Do what exactly in the Flow? Why would I need Flow anyways?? I already have the Sharepoint ID in my SQL View to connect those two!?

You use Update file properties in the Flow and send the required value in Ask in Power Apps.

This I don't get either?! Why would I need "ask in power apps"?? I don't try to save images...

I do not have an exact replica of your use case - I 'just' want to display images (on pc and mobile) that are stored in a Sharepoint library - where I already have the needed key in my SQL Table (Sharepoint ID; but I also have the complete link).

I'm really sorry. Like I said: I appreciate your time! But at this point I am so lost at trying to understand your answers that I am wondering if you are responding to my use case and description of my situation...

If there is anything unclear about what my setting is, what it is I am trying to and where I fail please let me know!

BR

Chris

WarrenBelz · ‎04-13-2021

Hi @dash_7 ,

I will try to frame it another way - firstly forget about the URL you have stored in your SQL table - that simply will not do the job of displaying image thumbnails from a SharePoint Library on mobile devices.
You cannot use your current structure and I was trying to point what you need to do - I will deal with that first and then talk about how you might get there.

To "link" your SQL record to the SharePoint Library picture/s that "belong" to it, you need to store an identical unique identifier (numeric or text) in both the SQL table record and the SharePoint Library Picture record/s. In SharePoint, I use the ID in a Library field I call IDRef and you have mentioned you have an SQL ID that you can use. The process is then a gallery with Items something like

Filter(
   YourSPLibraryName,
   IDRef=YourSQLItemID
)

The Image/s are then simply

ThisItem.'{Thumbnail}'.Large

Now to getting there - the one thing you have not mentioned is how you store your pictures in your SharePoint Library. The reason I mentioned a Flow is that is how I do it as the Pictures are either taken by the Power Apps Camera Control or added using the Add Picture Control. I then simply send the ID with the rest of the data and add it to the Library record just created - the process for this is on the blog.

So how do you store the pictures in the Library - we may think of a process that will work for you.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

dash_7 · ‎04-13-2021

@WarrenBelz

To "link" your SQL record to the SharePoint Library picture/s that "belong" to it, you need to store an identical unique identifier (numeric or text) in both the SQL table record and the SharePoint Library Picture record/s. In SharePoint, I use the ID in a Library field I call IDRef and you have mentioned you have an SQL ID that you can use. The process is then a gallery with Items something like

I already have this unique identifier. I also use IDRef form the Sharepoint gallery.

This might be my big misunderstanding - but I think what you are showing me here is how create a gallery based on the sharepoint data source (Filter( YourSPLibraryName... etc...).

That wouldn't be a problem. Building a gallery based on the sharepoint library works fine.

But I have an existing gallery (based on the sql view). It holds lots of text information to each product. I would like to add to this gallery the respective image coming from the Sharepoint library.

the one thing you have not mentioned is how you store your pictures in your SharePoint Library.

I uploaded the images manually to Sharepoint. In the end I would upload about 30.000 images (small image size, about 2kb to 10kb). The images don't change often - I would add/update some images about one or two time per year, manually. The library has no other columns/information - just the image files. And from this library I exported the respective IDRef to every image and added this column to my list of products in sql view. So every row in sql holds the correct IDRef of this image in Sharepoint.

So I thought that having this key (IDRef) on both sides (sql and sp) that I could join information from both sides in one gallery: holding all the text information to each and every product alongside the image coming from sp.

And this works on pc like described in the first post. Just not in the mobile app.

WarrenBelz · ‎04-13-2021

Hi @dash_7 ,

Can we please focus on your statement.

The library has no other columns/information - just the image files.

and agree with your last sentence
So I thought that having this key (IDRef) on both sides (sql and sp) that I could join information from both sides in one gallery: holding all the text information to each and every product alongside the image coming from sp.
The Library needs the ID of the SQL "master" in a field inside it - the IDRef field needs to be in the Library. You simply cannot refer to the URL you have in the SQL table - it will not work on mobile devices due to the way Power Apps resolves all URL anonymously (meaning the image has to be somewhere not requiring a security sign-in - it does not matter you are already signed into SharePoint) - it simply does not work on the mobile app. you will need to add the relevant matching ID to your 30,000 photos.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.