cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
marsdendd
Helper II
Helper II

Menu Component using Gallery - Image not showing and not selectable

Dear Community,

 

I have an issue with a component I am trying build. I am trying to use an image as thumbnail.

 

First issue I am facing is that the image only shows if I set the name of the media item in the Gallery properties.

 

The next issue is that even when i add the image it does not execute when selected (OnSelect) 

 

What i want to achieve is being able to use an image and then depending on its state (selected) change the color of the icon. 

 

If(ThisItem.Screen = App.ActiveScreen, ThisItem.SelectedImage, ThisItem.Image)

 

What am i doing wrong ?

 

I have attached a copy of the none working component.

 

Thanks for any help guidance you can offer.

 

D

 

 

1 ACCEPTED SOLUTION

Accepted Solutions

Hi, I found the issue. I encapsulated the image name in my collection in quotes. 

 

WRONG 

ClearCollect(colMenuItems, {
  Title: "Home",
  Screen:scrRegistryHome,
  Image: "image",
  SelectedImage: "image-selected"
})

CORRECT

ClearCollect(colMenuItems, {
  Title: "Home",
  Screen:scrRegistryHome,
  Image: image,
  SelectedImage: image-selected
})

Thank you so much for your help.

Darren

View solution in original post

6 REPLIES 6
v-bofeng-msft
Community Support
Community Support

Hi @marsdendd :

Is this what you want?

77.gif

If so,please try this solution:

1\set the app's OnStart proeprty to:

 

ClearCollect(colMenuItems, {
  Title: "Home",
  Screen:scrRegistryHome,
  Image: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=255856669,3736240924&fm=26&gp=0.jpg",
  SelectedImage: "https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2519617591,3090287333&fm=26&gp=0.jpg"}, 
{
  Title: "Gifts",
  Screen:scrRegistryGifts,
  Image: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=116459747,2993529546&fm=26&gp=0.jpg",
  SelectedImage: "https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2290654062,289769234&fm=26&gp=0.jpg"},
{
  Title: "Conflict of Interest",
  Screen:scrRegistryConflict,
  Image: "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3258706812,3557440027&fm=26&gp=0.jpg",
  SelectedImage: "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3219505908,4279122058&fm=26&gp=0.jpg"
})

 

2\Let me explain why the image control's OnSelect Property not work

The point is DisplayMode.Please set the imgNavigationMenuIcon's DisplayMode proeprty to

DisplayMode.Edit

1.JPG

In addition,please make sure the control is on the top.

2.JPG

Best Regards,

Bof

Hey @v-bofeng-msft ,

 

Thanks for responding.  I decided to approach the OnSelect issue with the image using a different approach. I created a transparent rectangle icon to ensure the entire region is selectable.

 

OnSelect:  Navigate(ThisItem.Screen, ScreenTransition.Fade); Set(varOpenMenu,false)

Width: Parent.TemplateWidth

Height: Parent.TemplateHeight

X: 0

Y: 0

 

I did make the adjustments to test the image control and it worked perfectly. Thank You. To be honest, I thought the image inherited the displaymode of the gallery control so i can't explain why it wasn't set to Edit.

 

With the image itself, this example here doesn't not set a URl in the Collection: part-2-of-tabbed-user-interface-mobile-version 

 

@v-bofeng-msft  Link Updated

 

That's what I want to achieve. 

 

Many Thanks

Darren

 

 

 

 

Hi @marsdendd :

Is there anything I can help?
I can not open the hyperlink you provided.

Best Regards,

Bof

Hi @v-bofeng-msft 

 

Sorry, I updated the link

 

D

Hi @marsdendd :

The case in the article you gave saved the picture to the media.Are you stuck on how to perform this step?

1.JPG

Best Regards,

Bof

Hi, I found the issue. I encapsulated the image name in my collection in quotes. 

 

WRONG 

ClearCollect(colMenuItems, {
  Title: "Home",
  Screen:scrRegistryHome,
  Image: "image",
  SelectedImage: "image-selected"
})

CORRECT

ClearCollect(colMenuItems, {
  Title: "Home",
  Screen:scrRegistryHome,
  Image: image,
  SelectedImage: image-selected
})

Thank you so much for your help.

Darren

View solution in original post

Helpful resources

Announcements
PA User Group

Welcome to the User Group Public Preview

Check out new user group experience and if you are a leader please create your group

secondImage

Demo Extravaganza is Back!

We are excited to announce that Demo Extravaganza for 2021 has started!

MBAS on Demand

Microsoft Business Applications Summit sessions

On-demand access to all the great content presented by the product teams and community members! #MSBizAppsSummit #CommunityRocks

Power Apps June 2021

June Power Apps Community Call

Don't miss the call this month on June 16th - 8a PDT

Top Solution Authors
Top Kudoed Authors
Users online (48,525)