Make sure the format is correct. Variable Name , equal sign , data and semicolon Also, check the previous named formulas to ensure you've closed them with semi colon. That can also cause your issue
With the icons; how can we be certain that the site from which we reference these icons will always have the icons, or that these will always be freely available, or that that site will always be there?
Hey, Victor! Thanks again for this great video! Just a suggestion: You speak a little bit quickly and often the video frame is ahead of what you say, which makes it difficult for those who are watching and trying to follow along with the video. Try to improve at this pont if its possible! Thanks for all!
Agreed ... you also didn't provide enough detail in your Set Icons table in Named Formulas ... just kinda glossed right over that, so none of this is functional without that.
Hello. Thank you for opening up a universe of development possibilities to us. We are waiting for the second part of the side menu development. If I understand you correctly. Did you ask if the video “Adaptive Containers” would be interesting? I confirm, yes, the topic is Adoptive Application Design. Very interesting and promising. I have a question. Are you planning to open a powerapps training course?
Super and useful, thanks a lot. I used this function instead of adding CurrentMenueID for each screen to change the container fill ----->> If(App.ActiveScreen = ThisItem.PageNavigation,RGBA(255, 255, 255, 0.9),Color.Transparent) works perfectly.
Im a beginner,I was able to follow from start to finish. Took me a while but stuck to it. Will be watching and trying out the rest of the series. Thank you so so so much.
I need to work on the named functions for some reason the side menu isn't recognizing the variables. But overall, awesome video. I had to pause it often to follow along but extremely good. Thanks
When I use this in power apps on my desktop everything works fine, but when i open the apps in power apps mobile there is not svg icons. Just the buttons and everything behind it. The button is set to transparent. Any advice?
I admit that I cannot follow 100% of your instructions 😅. However, I still got many thing. I can use bootstrap icon. create side bar which collapsible and highlighted for the current screen!. Thanks.
When adding the non-responsive container at 12:15 the container keeps defaulting outside of the gallery. I tried to cut and paste but it won't go inside. Any ideas why I can't add child non-responsive containers to the blank vertical gallery?
The trick is to first select the gallery on the canvas, then select the template (the first row in the gallery) after selecting that, anything you insert will surely be in the gallery.
@@toluvictor hi! i did what u suggest over and over, but it still wouldn't work. The container keep defaulting outside the gallery. Is there a solution to this? Thank you so much for the tutorial!
My man this is a really great video, thank you so much for your effort!!!!!!! Small feedback, is really hard to keep up to what you do on the screen, I have to change the play back settings to 0.75. I would really love to susbcribe to your pay content but having second thoughts if the videos are going to be similar. Anyhow, please keep creating more content, you have a new follower.
I got lost at the end. Should I get rid of the table MenuIcons in the component and instead use table customNavigation from the app as data for my gallery?
Hi Question, I am trying to do the pressed fill in the buttons but it doesnt work and i dont see any change in the color. When i press the ALT button, it works for hover but idk how do i press the button?
Nice video, I followed your video to create my own component please can you explain how I can navigate from one screen to another. it is not working from my end.
Thanks for the tutorial. I just have one question. I have added the component to a new screen and initialized the MenuConten with the same customNavigation but the component does not show all the items in this screen. Is there anything I am missing? Thanks in advance
First check if the menu items show on the component page to be sure there is nothing wrong with your component build. Then after initializing the menu content make sure to add it to your component's custom property. Also make sure the width and height fits its parent container, because part of the side menu might be cut out if its bigger
Hi Victor, I discovered your channel a few months ago. You're doing a really good job. 👍👍 Can't wait to see more ! 🤣 (I think you'll win a new subscription, let me think about it some more ) 🤔
I'm having an issue importing the component into an app. Creating the component all went well. But, when importing, I get "Function * returned a non-finite number". I have no idea where to start with this one. If I edit the component as a copy inside the app, everything under the Icon gallery is missing (both static containers, the button, and the image). So I'm guessing the problem is somewhere in there?
I added a sreen variable to the menu data source and on click of the menu item, the OnSelect is set to Navigate to that screen. This way the navigation is not hardcoded and can be used for any screen just by modifying the datasource
Excellent tutorial and video. I have a question, I would like to know how we could implement this component, when there are different user levels? Example: Admin, Normal User, Boss, etc. I tried to create it with an If in formulas, but it gives me an error. Is there any other way to do it? Or could you give me some advice?
You actually only need a few small changes. 1. Setup your user role variable in the Formulas or OnStart property. This is the variable you will query to know the logged in user's role 2. Add a custom property to the component to get thus user role 3. Add a new column to the menu content "MenuRole". It will be an array variable. An example would be ["Admin","Sales","HR"]. Add in any applicable roles for that menu item 4. Modify the menu gallery by adding a filter to check if the logged in user's role (which is a custom property), is IN "MenuRole". This would then only show menu items for the current role
@@toluvictor Wow you are a goat🔥🔥! Everything worked perfect for me, except that in addition to your steps I also added the nested IF's in the customNavigation I had in formulas (just like the example in your video). Thanks!!!
Great video Tolu! I have a probelm I hope you can help me with! On edit, the Menu is working, but when i publish the app and play the app, the menu is not visable, only the logo is visable. Menu content is in the "Named Formulas" property on AppStart like yours. Do you know what the problem can be? I have enabled "Access app scope" on the component.
Hi, not sure what might cause this for your but check the positional values of the menu items. Sometimes the positional values are not in sync. For example the "X" property value in the formula bar at the top is different from the "X" property value in the properties panel on the right. In some cases, the formula bar value might be 40 while the value in the properties panel is 0. The formula bar value carries higher priority, so in those case 40 will be the X value hereby shifting your control to the right and hence make it not visible in play mode. To resolve this change the properties panel value to any other number and then change it back to your desired value. That should sync up the values
Your Videos are amazing. Been subscribed for a little while now and have learned so much. In this video I ran into a slight issue. When I add the container for the gallery it will not nest inside the gallery. What am I doing wrong?
NVM - The trick is to first select the gallery on the canvas, then select the template (the first row in the gallery) after selecting that, anything you insert will surely be in the gallery.
I created a custom property for the component and stored the logo inside that custom property. I then referenced the custom property in the component. Check 7:40
the issue has something to do with the SVG your using, I was able to resolve the issue but copy and pasting the SVG string from my component back into formula and it just worked, hope that helps.
AMAZING VIDEOS! Wow! Subscribed. I am trying to build collapsable side menu which should be scrollable as well, can you please share some tips? I understand the collapsable menu part, trying to figure out how to make it scrollable, I have a lot of links in the side menu.
You actually don't need to do anything extra for the collapsible menu. Since we are using a gallery, once its items are more than its size its automatically adds scrolling. As for the compact menu, since we have made the gallery size dependent on its content, first turn on flexible height to make it fill the available space and then once your item numbers exceeds that, it would add scrolling
Great video! I didn't understand when you said about issues into gallery (other languages). You said too fast. What I have to change ? My language is portuguese (Brazil), and my component is with issue because of this.
Hi. Sorry about that, I'm slowing down in my newer videos😅. What I said was that sometimes the positional values differ. For example the "X" property value in the formula bar at the top is different from the "X" property value in the properties panel on the right. In some cases, the formula bar value might be 40 while the value in the properties panel is 0. The formula bar value carries higher priority, so in those case 40 will be the X value hereby shifting your control to the right. To resolve this change the properties panel value to any other number and then change it back to your desired value. That should sync up the values
Hi. It's something I'm considering. However I feel I still have a lot to learn as per creating Educational videos and disseminating my knowledge in a simple way. Basically, once I feel the quality of my UA-cam videos have gotten to a good enough level, I'll consider making a paid course
Hi, you can consider creating "event" custom properties. Check 14:30 in the part 2 of this series. ua-cam.com/video/Izl-KTv5CHI/v-deo.html&lc=Ugy9Nb2G08AOGQ9u8_Z4AaABAg
Top and inspiring content! Do you think it's possible to have kinda "hot editable table" in canvas apps (= doesnt require save button or open a details pane) - similar to the editable grid in model driven apps? And as far as I know, there is no way to automatically update a table when multiple people are working on it and someone updates a row?
Yes this is possible. In the gallery, you simply use input controls like text inputs or combo box etc. And then in the OnChange property, you simply write a patch function to update that column for that row in the data source. As for the automatic updates, you can use a timer control that refreshes the data source based on your set interval. However its worth it to note that this method will make multiple call to the data source
I really enjoy your content bro. They are always inspiring and challenging. I'm currently a power apps developer for a company and I would love to have a way to contact you so we can discuss on somethings. What is the best way to meet you?
In the next video of the series, the side menu contains a color mode switch for thale app. I'm using the variable as a custom property on that side menu component.
How did you update CurrentMenuID, what time in the video is that setting updated. You set it to '1' when you created it, but you have not shown how you then set it up to be changed dynamically when a menu icon is clicked. I've worked it out myself but can't see it in your video.
Hello, can you briefly give instructions on how to use the downloads? I am a member and I have the files but it took me few hours to figure out how to use them and I failed 😅
Hi Omar. The file contains a PowerApps unmanaged solution. To add it to your PowerApps environment, simply import like you would normally import a solution (Go to the solution page and import). After import, you should now have the app from this video in your environment. You can then work with it as needed, whether you want to import the side menu on another one of your apps or you want to play around with to see exactly what has been built and how to build it.
@toluvictor hi i need your help as i am trying to put the container inside the gallery and u mention that it is due to the properties panel is different from formule bar. how do we fix it like where as i cannot seem to solve it .please help
I lost the visibility of some of my icons. I tried to copy what you did with "CustomIcons" and "customNavigation'" Tables before assigning MenuContent = customNavigation. What could I have done wrong? I also tried setting customNavigation to the same table I used in the Component. The Icons are visible but the icons dont fill when selected
Hi, make sure you have 2 versions of your icons. One filled and one outline. Then you make the fill icon visible when a menu item is active. Please rewatch 18:54
Man, after changing the Formula of the Menu Content property to the table "customNavigation" the selected items stopped being highlited and without the selected background color Do you have an idea why?
So i have this bug when i finish setting up my navigation. Everytime i click on a button it first navigates to home page and I have to click on the desired button a second time and only then the app navigates to screen i want . Can you please help me fix this
@@toluvictor This is the error message I receive. This occurs when I rename the gallery. The Gallery Items Property is listed in the drop down and in the formula bar is listed SideNavigation_Compact.MenuContents. Below the formula bar is a red error that says The function * returned a non-finite number.
Hey there, i have a Question: I am currently learning to use PowerApps but it appears that the Components Tab is not available, either anymore or in the webversion. I am not sure if it was just placed elsewhere or if i have to activate anything but i created a Dev-Environment, then inside created a Solution and in that Solution i created an App. Now i do all of that in the webview and i cant seam to find the components tab. Was it changed lately or smth? If i create a Powerapps trough the Teams interface tho, i see the components tab. Would really appreciate some help
@@toluvictor Hey, it doesnt seam like a Bug. I realoaded the page. Its still not there when i'm in the App editing view. I can only see it when i create a Component Library. In the Component Library, i can create Components as usually, but i cant create any without a library in the webview. If i create a Powerapps trough the Teams UI tho, its possible. Its really weird. But it might be an Update from Microsoft. Are you still able to create Components within a Solution without creating a Components Library?
You need to create the variable first. I showed this in the second video of this series so you can check it out. Basically, in the OnStart property, I used the Set() function to initialize my variable.
Bro i am getting error when i am trying to lookup the table of svg in my formulas bar into components .. but its working for screens .. same formula no difference
when did you you set the currentmenuID? i don't see how it is being tracked. It is not set on the button click. You set it on visible but basically u hardcoded to 1, but how it is being set as you navigate to different menu? The tip that @Noorullah09 provided was very useful. However, if i want to use the currentMenuID to track where are you setting its value?
This is on Image control "data:image/svg+xml;utf8, " & EncodeUrl( LookUp(customIcons, IconName = "Resource Management").IconData ) I am not able to create side nav bar because of it
Hi please note that data outside the component cant be read by the component except. "Access App Scope" is set to true. It seems like you're trying to access customIcons which is a variable outside your component. Thats why I used placeholders in the component build and then added the actual icon outside the component. I explained more on this in part 2 of this series
Excellent video, brings powerapps to a brand new level. The only minor issue is having mainatian a seperate text version of the color as it's easy to forget to update it in both places. I was able to find this code that converts RGBA into HEX so the code at (18:20) in the video would change to "data:image/svg+xml;utf8, "& EncodeUrl( Substitute( ThisItem.MenuIcon, "currentColor", If( SideNavigation_Compact.SelectedMenuID = ThisItem.MenuID, Match(JSON(SideNavigation_Compact.SelectedIconColor, JSONFormat.IgnoreUnsupportedTypes),"#[a-fA-F0-9]{6}").FullMatch, Match(JSON(SideNavigation_Compact.BaseIconColor, JSONFormat.IgnoreUnsupportedTypes),"#[a-fA-F0-9]{6}").FullMatch ) ) )
Thanks a lot. I actually found an easier way to go about this and showed it in one of my recent videos. Its somewhat similar to your solution but you don't need to use match, a simple substitute would suffice. Check it out here ua-cam.com/video/0j0SePL60m0/v-deo.html
Hello! I had the same problem, it didn't recognize the SelectedIconColor_Text nor the BaseIconColor_Text Simply, in the 2 properties you can use the HEX format like this: BaseIconColor ---> ColorValue("#7383b0") BaseIconColor_Text ---> "#7383b0" SelectedIconColor ---> ColorValue("#febd2f") SelectedIconColor_Text ---> "#febd2f" We can use ColorValue. Enjoy!
I cannot add the container nested into the vertical gallery, is this some sort of bug? i have tried ctrl+x and cntrl+v into gallery as well but it just does not nest
Circular reference means item A is referencing item B for a property and item B is referencing item A for a property. To resolve this make sure at least one has an actual value or is referencing another item that has an actual value. I'm not too sure which part you're having an error in your case but make sure the menu item is getting its height from its parent container and then that parent container should be getting its height from the gallery's template height
Im not sure based on the little info youve provided but please make sure the syntax is correct Check official documentation here: learn.microsoft.com/en-us/power-platform/power-fx/reference/function-table
Hi. Thanks for the support. Sorry for the poor pacing, looking back I was unnecessarily fast in this video The templates are available for download on my Patreon - www.patreon.com/ToluVictor It is also to UA-cam channel members, you can click the join button on my UA-cam page. Once you've joined, check the membership tab on my UA-cam Page. There is a post for each video. So, look for the particular one you want, expand the post and there will be a Google Drive link to a folder that contains the files.
Wow, great video, had to subscribe for real! One thing, you talk and go through some of the explanations and video instructions to fast in some places, there's no need to go that fast, just slow down a little. We not going anywhere.
Have you started using Named Formulas for static data initialization on your app
When I try to create new variables in formlas I get an error underlining the variable saying name isn't recognized
Make sure the format is correct.
Variable Name , equal sign , data and semicolon
Also, check the previous named formulas to ensure you've closed them with semi colon. That can also cause your issue
@@toluvictor Thanks man! I'll give it a try. You got yourself a new member :)
@banihas22 thanks for supporting the channel 😊
@@toluvictor I found the problem. In the OnStart we need to have the following Set(varAppColorMode,"Light");
You're incredible! Your UI walkthroughs are by far the most comprehensive I've come across. Thank you so much!
Thanks a lot for the kind words😇
bro is just a power apps GOD
AY YOOOO 🤣🤣🤣🤣. Calm down bro. Anyone can do this.
Thanks tho
True true
Your PowerApps UI skills are the best on UA-cam
😅 Thanks
Really, really appreciate your PowerApps videos. Super helpful so I just signed up! Cheers! :)
Well done bro besides your great content, also you are amazing teacher in terms of explaining to us. Thank you.
🤝
You're obviously Divergent. This is amazing!!!
Tolu, this video was extremely well done, I'm never using another navbar again! Please keep up this amazing content!!
Thanks a lot Adam. 🤝
You can also run on start by clicking the elipses next to “App” in tree view instead of copy and pasting the on start
With the icons; how can we be certain that the site from which we reference these icons will always have the icons, or that these will always be freely available, or that that site will always be there?
You're going to get more popularity soon🤘🤘🤘🤝🏻🤝🏻🤝🏻
Your new Subscriber😎
Lol. Thanks a lot😅
This is great! But I am having error when navigating to screen, it is not working.
Hey, Victor! Thanks again for this great video! Just a suggestion:
You speak a little bit quickly and often the video frame is ahead of what you say, which makes it difficult for those who are watching and trying to follow along with the video. Try to improve at this pont if its possible! Thanks for all!
Thanks for the tip
Agreed ... you also didn't provide enough detail in your Set Icons table in Named Formulas ... just kinda glossed right over that, so none of this is functional without that.
Hello.
Thank you for opening up a universe of development possibilities to us.
We are waiting for the second part of the side menu development.
If I understand you correctly. Did you ask if the video “Adaptive Containers” would be interesting?
I confirm, yes, the topic is Adoptive Application Design. Very interesting and promising.
I have a question.
Are you planning to open a powerapps training course?
Great.
At the moment, I have no training course, but I'm considering it in the future
Finally created something worthy to view😂
Thank you
😂😂 bro I don slow down since na
Super and useful, thanks a lot. I used this function instead of adding CurrentMenueID for each screen to change the container fill ----->> If(App.ActiveScreen = ThisItem.PageNavigation,RGBA(255, 255, 255, 0.9),Color.Transparent) works perfectly.
Yoooo!!!. That's smart. Nice tip👍
Love your ideas - very creative and always seeking to push the envelope
Thanks so much!
Im a beginner,I was able to follow from start to finish. Took me a while but stuck to it. Will be watching and trying out the rest of the series. Thank you so so so much.
That's great. You're welcome
Can't wait to see the part 2 of this series!
👍
video loaded. Watching again to catchup all details. Thanks dude
👌
me too! Love the videos just a bit too fast for me. :)
I'm now making conscious effort in my newer videos to make it slower paced😅
@@toluvictor - Thank you so much!! You have great material.
This weekend will be amazing with this tutorial !!! Thank you Victor!!
Hope you can pick a few things from the video👍🙂
I need to work on the named functions for some reason the side menu isn't recognizing the variables. But overall, awesome video. I had to pause it often to follow along but extremely good. Thanks
Ive got to see if svgs are now fine with apps embedded into Teams. When i tried a few years ago, the svgs wouldnt show up in the teams embedded app.
When I use this in power apps on my desktop everything works fine, but when i open the apps in power apps mobile there is not svg icons. Just the buttons and everything behind it. The button is set to transparent. Any advice?
I admit that I cannot follow 100% of your instructions 😅. However, I still got many thing.
I can
use bootstrap icon.
create side bar which collapsible and highlighted for the current screen!. Thanks.
That's great. Looking back, my pace was really fast in this video. I've slowed down in my recent videos
Is there a video set Formulas tutorial?😅 3:49
When adding the non-responsive container at 12:15 the container keeps defaulting outside of the gallery. I tried to cut and paste but it won't go inside. Any ideas why I can't add child non-responsive containers to the blank vertical gallery?
The trick is to first select the gallery on the canvas, then select the template (the first row in the gallery) after selecting that, anything you insert will surely be in the gallery.
@@toluvictor hi! i did what u suggest over and over, but it still wouldn't work. The container keep defaulting outside the gallery. Is there a solution to this? Thank you so much for the tutorial!
My man this is a really great video, thank you so much for your effort!!!!!!! Small feedback, is really hard to keep up to what you do on the screen, I have to change the play back settings to 0.75. I would really love to susbcribe to your pay content but having second thoughts if the videos are going to be similar. Anyhow, please keep creating more content, you have a new follower.
can you transcribe the codes you used for formula and icons so that its easier to follow?
I got lost at the end. Should I get rid of the table MenuIcons in the component and instead use table customNavigation from the app as data for my gallery?
I discover your channel for the first time, great content !
😊 Thanks
Hi Question, I am trying to do the pressed fill in the buttons but it doesnt work and i dont see any change in the color. When i press the ALT button, it works for hover but idk how do i press the button?
Nice video, I followed your video to create my own component please can you explain how I can navigate from one screen to another. it is not working from my end.
I have been waiting for this collapsible side bar tutorial. Thanks!
Great 👍. This video focuses on the base side menu design. In the next video of the series, we would add functionality to collapse or expand it
that app is a thing of beauty. thanks for sharing!
Thanks
Very useful content. I subscribe to your channel. Thank you!
Thanks for the tutorial. I just have one question. I have added the component to a new screen and initialized the MenuConten with the same customNavigation but the component does not show all the items in this screen. Is there anything I am missing? Thanks in advance
First check if the menu items show on the component page to be sure there is nothing wrong with your component build. Then after initializing the menu content make sure to add it to your component's custom property.
Also make sure the width and height fits its parent container, because part of the side menu might be cut out if its bigger
@@toluvictorThanks for the help. I found the error and now it is working! Great Job!
One of Powerapps GOAT 🐐🐐
Lol. Maybe one day
Amazing content🎉❤. I would love to see a video on mastering containers.🙏
Thanks.
If it gets enough traction, I'll work on it.
You are amazing! This helped me a lot, thank you so much for all your effort on this incredible video!!!
Thanks for the kind words
Hi Victor,
I discovered your channel a few months ago. You're doing a really good job. 👍👍
Can't wait to see more ! 🤣
(I think you'll win a new subscription, let me think about it some more ) 🤔
Thanks. 😅😅
Amazing. Thank you for sharing Victor.
😇 You're welcome
Some how I cant see icons after adding it in Image inside container 14:04
I'm having an issue importing the component into an app. Creating the component all went well. But, when importing, I get "Function * returned a non-finite number". I have no idea where to start with this one.
If I edit the component as a copy inside the app, everything under the Icon gallery is missing (both static containers, the button, and the image). So I'm guessing the problem is somewhere in there?
Hi, I loved the video! Just a doubt, how are you navigating to different screens? Are we giving any formula in OnSelect property of button?
I added a sreen variable to the menu data source and on click of the menu item, the OnSelect is set to Navigate to that screen.
This way the navigation is not hardcoded and can be used for any screen just by modifying the datasource
@@toluvictor thank you so much!!
Excellent tutorial and video. I have a question, I would like to know how we could implement this component, when there are different user levels? Example: Admin, Normal User, Boss, etc.
I tried to create it with an If in formulas, but it gives me an error. Is there any other way to do it? Or could you give me some advice?
You actually only need a few small changes.
1. Setup your user role variable in the Formulas or OnStart property. This is the variable you will query to know the logged in user's role
2. Add a custom property to the component to get thus user role
3. Add a new column to the menu content "MenuRole". It will be an array variable. An example would be ["Admin","Sales","HR"]. Add in any applicable roles for that menu item
4. Modify the menu gallery by adding a filter to check if the logged in user's role (which is a custom property), is IN "MenuRole". This would then only show menu items for the current role
@@toluvictor Wow you are a goat🔥🔥!
Everything worked perfect for me, except that in addition to your steps I also added the nested IF's in the customNavigation I had in formulas (just like the example in your video). Thanks!!!
Great video Tolu! I have a probelm I hope you can help me with! On edit, the Menu is working, but when i publish the app and play the app, the menu is not visable, only the logo is visable. Menu content is in the "Named Formulas" property on AppStart like yours. Do you know what the problem can be? I have enabled "Access app scope" on the component.
Hi, not sure what might cause this for your but check the positional values of the menu items.
Sometimes the positional values are not in sync. For example the "X" property value in the formula bar at the top is different from the "X" property value in the properties panel on the right. In some cases, the formula bar value might be 40 while the value in the properties panel is 0. The formula bar value carries higher priority, so in those case 40 will be the X value hereby shifting your control to the right and hence make it not visible in play mode.
To resolve this change the properties panel value to any other number and then change it back to your desired value. That should sync up the values
Your Videos are amazing. Been subscribed for a little while now and have learned so much.
In this video I ran into a slight issue. When I add the container for the gallery it will not nest inside the gallery. What am I doing wrong?
I actually just figured it out from another video of yours!
Looking forward to more of your videos.
@@thomaslafountain1014 Why wasn't it nesting?
NVM - The trick is to first select the gallery on the canvas, then select the template (the first row in the gallery) after selecting that, anything you insert will surely be in the gallery.
This is great, thanks a lot man!
Glad you liked it!
Gr8 video !! I didn't understand how do you put the logo image as 'Wess Logo Icon'
I created a custom property for the component and stored the logo inside that custom property. I then referenced the custom property in the component. Check 7:40
Hi, I'm with a problem. Everytime I set "customnavigation" like the end of the video (22:20) all my icons dissapear .-. Can someone help me please?
having the same issue, will let you know if I figure it out
the issue has something to do with the SVG your using, I was able to resolve the issue but copy and pasting the SVG string from my component back into formula and it just worked, hope that helps.
AMAZING VIDEOS! Wow! Subscribed. I am trying to build collapsable side menu which should be scrollable as well, can you please share some tips? I understand the collapsable menu part, trying to figure out how to make it scrollable, I have a lot of links in the side menu.
You actually don't need to do anything extra for the collapsible menu. Since we are using a gallery, once its items are more than its size its automatically adds scrolling. As for the compact menu, since we have made the gallery size dependent on its content, first turn on flexible height to make it fill the available space and then once your item numbers exceeds that, it would add scrolling
@@toluvictor A BIG thank you! Huge respect. I really appreciate you taking the time to share this valuable tip with me. :)
The SVG concept I'm keen to know how to use it
Check out my latest video
ua-cam.com/video/0j0SePL60m0/v-deo.html
Great video! I didn't understand when you said about issues into gallery (other languages). You said too fast. What I have to change ? My language is portuguese (Brazil), and my component is with issue because of this.
Hi. Sorry about that, I'm slowing down in my newer videos😅.
What I said was that sometimes the positional values differ. For example the "X" property value in the formula bar at the top is different from the "X" property value in the properties panel on the right. In some cases, the formula bar value might be 40 while the value in the properties panel is 0. The formula bar value carries higher priority, so in those case 40 will be the X value hereby shifting your control to the right.
To resolve this change the properties panel value to any other number and then change it back to your desired value. That should sync up the values
Thank you!!@@toluvictor
Amazing content victor … 🥶
😊 Thanks
Thanks a lot. This is great, gives new ideas and helps a lot.
Glad to hear that!
Great content - any chance in the future you will be releasing any paid courses for full end-to-end PowerApps development training?
Hi.
It's something I'm considering. However I feel I still have a lot to learn as per creating Educational videos and disseminating my knowledge in a simple way. Basically, once I feel the quality of my UA-cam videos have gotten to a good enough level, I'll consider making a paid course
Wow. Great work! Inspiring, but my head hurts thinking about it 😂
That's fine 🤣🤣. We all start somewhere
Can you pls share the menu schema in the comment for me to try your menu?
'access app scope' in PowerApp is missing in my version, any other way to set Dark mode function?
Hi, you can consider creating "event" custom properties. Check 14:30 in the part 2 of this series. ua-cam.com/video/Izl-KTv5CHI/v-deo.html&lc=Ugy9Nb2G08AOGQ9u8_Z4AaABAg
bro, dont forget about the containers videos i would think we would all love to see watch it like it and then subscribe
Top and inspiring content! Do you think it's possible to have kinda "hot editable table" in canvas apps (= doesnt require save button or open a details pane) - similar to the editable grid in model driven apps? And as far as I know, there is no way to automatically update a table when multiple people are working on it and someone updates a row?
Yes this is possible. In the gallery, you simply use input controls like text inputs or combo box etc. And then in the OnChange property, you simply write a patch function to update that column for that row in the data source. As for the automatic updates, you can use a timer control that refreshes the data source based on your set interval. However its worth it to note that this method will make multiple call to the data source
I really enjoy your content bro. They are always inspiring and challenging.
I'm currently a power apps developer for a company and I would love to have a way to contact you so we can discuss on somethings.
What is the best way to meet you?
Great content, are you going to do the light mode and dark mode toggle as well?
Definitely. It's coming in part 2 of the series
nice!!
Great tutorial, where do you put varAppColorMode mode though?
In the next video of the series, the side menu contains a color mode switch for thale app. I'm using the variable as a custom property on that side menu component.
@@toluvictor can't wait! Thanks to your dedication to share these knowledge! Much appreciated :)
How did you update CurrentMenuID, what time in the video is that setting updated. You set it to '1' when you created it, but you have not shown how you then set it up to be changed dynamically when a menu icon is clicked. I've worked it out myself but can't see it in your video.
Hi. Check 22:20.
Hello, can you briefly give instructions on how to use the downloads? I am a member and I have the files but it took me few hours to figure out how to use them and I failed 😅
Hi Omar. The file contains a PowerApps unmanaged solution. To add it to your PowerApps environment, simply import like you would normally import a solution (Go to the solution page and import). After import, you should now have the app from this video in your environment. You can then work with it as needed, whether you want to import the side menu on another one of your apps or you want to play around with to see exactly what has been built and how to build it.
can u do a video on the dark and light mode
can you help me, my problem is when moving pages it runs smoothly, but the color of the sidebar icon does not change and remains static, thank you
Hi, make sure the whichever variable you use to set the active menu is set correctly. Check 22:19
You are so good bro...
Thanks 😅
@toluvictor hi i need your help as i am trying to put the container inside the gallery and u mention that it is due to the properties panel is different from formule bar. how do we fix it like where as i cannot seem to solve it .please help
click the pencil icon in the gallery, then insert
What Program were you using at 4:27 to replace the " with ' very Easly?
I used Sublime Text. But you can use any code editor, even Notepad
When I needed to use the "substitute" formula I had to use hexadecimal values, rgba doesn't work
Make sure you replace it with text value not actual color value or variable
I lost the visibility of some of my icons. I tried to copy what you did with "CustomIcons" and "customNavigation'" Tables before assigning MenuContent = customNavigation. What could I have done wrong? I also tried setting customNavigation to the same table I used in the Component. The Icons are visible but the icons dont fill when selected
Hi, make sure you have 2 versions of your icons. One filled and one outline. Then you make the fill icon visible when a menu item is active.
Please rewatch 18:54
Man, after changing the Formula of the Menu Content property to the table "customNavigation" the selected items stopped being highlited and without the selected background color
Do you have an idea why?
Forget... because of uppercase and lowercase in a variable... 🥵
So i have this bug when i finish setting up my navigation. Everytime i click on a button it first navigates to home page and I have to click on the desired button a second time and only then the app navigates to screen i want . Can you please help me fix this
It seems that the menu content variable is correct only on the HomePage, make sure others are correct too
Im getting an error message the function * returns an infinite number. Any feedback would be appreciated.
As I dont have enough info, I can exactly say whats causing the issue
@@toluvictor This is the error message I receive. This occurs when I rename the gallery. The Gallery Items Property is listed in the drop down and in the formula bar is listed SideNavigation_Compact.MenuContents. Below the formula bar is a red error that says The function * returned a non-finite number.
Hey there, i have a Question:
I am currently learning to use PowerApps but it appears that the Components Tab is not available, either anymore or in the webversion. I am not sure if it was just placed elsewhere or if i have to activate anything but i created a Dev-Environment, then inside created a Solution and in that Solution i created an App. Now i do all of that in the webview and i cant seam to find the components tab. Was it changed lately or smth?
If i create a Powerapps trough the Teams interface tho, i see the components tab.
Would really appreciate some help
Hi. This must be a client side bug on your end. Try doing a hard refresh of your browser page (Ctrl+Shift+R)
@@toluvictor Hey, it doesnt seam like a Bug. I realoaded the page. Its still not there when i'm in the App editing view. I can only see it when i create a Component Library. In the Component Library, i can create Components as usually, but i cant create any without a library in the webview. If i create a Powerapps trough the Teams UI tho, its possible. Its really weird. But it might be an Update from Microsoft.
Are you still able to create Components within a Solution without creating a Components Library?
Where do you declare the variable varAppColorMode?
Hi. This was done and explained in part 2 of this series
where's the named formula ?
in the formula bar when i type varAppColorMode it shows an error . how can i fix it?
That is a custom text variable I created in my app's onstart property
The varAppColorMode in Formulas throws an error says "variable isn't recogized"
You need to create the variable first. I showed this in the second video of this series so you can check it out. Basically, in the OnStart property, I used the Set() function to initialize my variable.
Bro i am getting error when i am trying to lookup the table of svg in my formulas bar into components .. but its working for screens .. same formula no difference
Hi components are independent of app variables if access app scope is not. So that's probably a reason
Also make sure there are no typos
when did you you set the currentmenuID? i don't see how it is being tracked. It is not set on the button click. You set it on visible but basically u hardcoded to 1, but how it is being set as you navigate to different menu? The tip that
@Noorullah09 provided was very useful. However, if i want to use the currentMenuID to track where are you setting its value?
This is on Image control
"data:image/svg+xml;utf8, " & EncodeUrl(
LookUp(customIcons, IconName = "Resource Management").IconData
)
I am not able to create side nav bar because of it
Hi
please note that data outside the component cant be read by the component except. "Access App Scope" is set to true.
It seems like you're trying to access customIcons which is a variable outside your component.
Thats why I used placeholders in the component build and then added the actual icon outside the component. I explained more on this in part 2 of this series
wow really nice content
Thanks 😊
Excellent video, brings powerapps to a brand new level. The only minor issue is having mainatian a seperate text version of the color as it's easy to forget to update it in both places. I was able to find this code that converts RGBA into HEX so the code at (18:20) in the video would change to
"data:image/svg+xml;utf8, "& EncodeUrl(
Substitute(
ThisItem.MenuIcon,
"currentColor",
If(
SideNavigation_Compact.SelectedMenuID = ThisItem.MenuID,
Match(JSON(SideNavigation_Compact.SelectedIconColor, JSONFormat.IgnoreUnsupportedTypes),"#[a-fA-F0-9]{6}").FullMatch,
Match(JSON(SideNavigation_Compact.BaseIconColor, JSONFormat.IgnoreUnsupportedTypes),"#[a-fA-F0-9]{6}").FullMatch
)
)
)
Thanks a lot. I actually found an easier way to go about this and showed it in one of my recent videos. Its somewhat similar to your solution but you don't need to use match, a simple substitute would suffice.
Check it out here ua-cam.com/video/0j0SePL60m0/v-deo.html
Hello!
I had the same problem, it didn't recognize the SelectedIconColor_Text nor the BaseIconColor_Text
Simply, in the 2 properties you can use the HEX format like this:
BaseIconColor ---> ColorValue("#7383b0")
BaseIconColor_Text ---> "#7383b0"
SelectedIconColor ---> ColorValue("#febd2f")
SelectedIconColor_Text ---> "#febd2f"
We can use ColorValue.
Enjoy!
I cannot add the container nested into the vertical gallery, is this some sort of bug? i have tried ctrl+x and cntrl+v into gallery as well but it just does not nest
Hi, I've encountered this before. Save your work and refresh your page then it should work
I've got the same issue, doesn't matter if I refresh the container just doesn't go in the gallery
problem with circular reference between property on heigt of menuitem
Circular reference means item A is referencing item B for a property and item B is referencing item A for a property. To resolve this make sure at least one has an actual value or is referencing another item that has an actual value.
I'm not too sure which part you're having an error in your case but make sure the menu item is getting its height from its parent container and then that parent container should be getting its height from the gallery's template height
Resolven i did not replace the content in templatesize by 50 @@toluvictor
Hi Tolu, Can you share the component download link!
Hi
This is available to the UA-cam channel members and Patreon Members
hi. the table formula shows error? what did i do wrong?
Im not sure based on the little info youve provided but please make sure the syntax is correct
Check official documentation here: learn.microsoft.com/en-us/power-platform/power-fx/reference/function-table
Where can i find the table for the icons?
I got the icons from the Bootstrap icons site
Thankss
Amazing content, thx
You're welcome 😊
What version of powerapps did you used for this?
I cant remember but it was the default version as at January 2024
Excellent video
Thank you very much!
how to buy or get your modern template , it hard to catch all😅
Hi. Thanks for the support. Sorry for the poor pacing, looking back I was unnecessarily fast in this video
The templates are available for download on my Patreon - www.patreon.com/ToluVictor
It is also to UA-cam channel members, you can click the join button on my UA-cam page. Once you've joined, check the membership tab on my UA-cam Page. There is a post for each video. So, look for the particular one you want, expand the post and there will be a Google Drive link to a folder that contains the files.
Hi, you have created this using Canva?
No I haven't
amazing!! Thanks.
Glad you liked it!
once I changed the MenuContent to customNavigation my icon stays black and won't switch to yellow...Can someone help me?
The SelectedIconColor_Text seems not to work for me in the screen. If I paste the RGBA in there it works fine...
Hi, make sure the "SelectedIconColor_Text" variable is a text variable and not a color variable
Wow, great video, had to subscribe for real!
One thing, you talk and go through some of the explanations and video instructions to fast in some places, there's no need to go that fast, just slow down a little. We not going anywhere.
Awesome, thank you!
Thanks Victor ❤
You're welcome