5. Practice Activity Number 6 – The Solution
Hello. Well, how did you find this practise activity? So, let’s take a look. First of all, I wanted you to go to the DeviceEdit screen, and I wanted you to add an Add Picture Control and link it to the Device image column so you could go to Media and so forth. And you have Add image. But there is a quick way. Remember, we are using a form. So if I click on the form there, all I have to do is add a field. So having added the device image, you can see the control type is Add Picture by default. And if I scroll down there, we can see if I click a few times that this is an Add Picture control. So, very quick to complete. Next, I wanted you to create a new screen so that you can go to the users’ gallery page or the device’s gallery page. So here it is. So I’m just going to collapse everything, and while I can’t drag it to the top, I can move it up so it’s in the right logical order. And I’m going to rename that to the main menu. So it doesn’t have to be much. All I’m going to do is put in a couple of buttons. So in this first one, the text is “see all users,” and in the second one, “see all devices.” So maybe you could stylize this a lot more. Have your logo on it, a rectangle at the top, and an introduction. You’re welcome to whatever this is. Welcome, users and devices.
App So if I put that in the Welcome to the Users and Devices app and have that colour be white, So there’s a lot of styling that you can do. We need to add the functionality, however. So, for this button, navigate to the user details screen, and for this, navigate open bracket; just wait for the computer to present you with some potentially very good options. So go to the Device Detail screen and close the bracket. Next, I wanted you to create a global variable. So if we go to the Devices Gallery page, you would see all of the devices regardless of who owns them. So I need to make a global variable that says I’ve either clicked this button or this button so that I can say set see all devices.
And because this is a set, we now use a comma. So I won’t claim that all devices are true. I want it to say it’s false. On using the zero value It doesn’t really matter what value you use as long as you have the right logic later on. And just looking at the formula, the computer thinks I had put the word navigate earlier, where I didn’t want it. So there we go. Now, if we go into this button, again, just put a few spaces, maybe a semicolon, and I set the C all devices. So you can see why I put the spaces. It allows the computer to give me a better range of options, and I’m saying yes this time. I do want you to set the seal devices to one as opposed to zero, so you can see the differences between them.
So in this one, I’m saying “set C, alldevices,” and you can see why I’ve included a space to allow the autocomplete to work for one. So a positive result, and then a single semicolon or two semicolons if you’re in a non-English locale. So now let’s go to the device details screen, and in the gallery we have this photo function, and that’s fine if I have gone through the user screen, but if I go straight to the device screen, I want to see everything. So if I can see all devices on one screen, then I want to see everything. What is everything? It’s the entirety of the device table. If not, then I want to see just the devices for the selected user in the user gallery. So let’s have a look at this. If I just play, if I go to see all users, then I can see all the users, select somebody, and here we can see the devices for that user, just one device. Now I’ll also need a back button here. So this is a great way to just test to see if you’re missing any icons or anything like that. So again, this will just come back. So let’s start again. Go back to the main menu. So users click on a particular user. There is one device I can see one device. Go back and seal the devices, and there are three of them. So next, I’ve asked you to go to the User Detail screen and add a sort icon. So let’s just go to icons, and there will be a sort icon there. So when I click this, it should change a context variable. So it goes from ascending to descending or back again. So on, select. So we say that if a variable and you can makeup a variable so that sort of sending equals one, then we need to update the context because this is a context variable.
We simply want the one-page source list to ascend from zero. And we need squiggly brackets around it as well as the normal brackets. Otherwise, we can update the source so that it is one. Now, there are other ways of writing this, and I think I need another false bracket at the end. So there are other ways of writing this. As a result, you could say that you should only use one update context. , and the, and then, and then, and then, and then, and then, and then, and then, and then, and then, and then, and then, and then, and then, or the So that just uses one context update context function.
So, whichever method you prefer, we must use this type of sending here in the items. And this is when we sort by columns. So sort by columns. So sorting by columns requires a source—the users—and a column or probably some sort of name. So let’s scroll down and see what name we’ve got. Maybe last name, perhaps full name—it’s entirely your choice. And then we need the order—is it ascending or descending? So let’s just say ascending for now. And here you can see it working in terms of the full name being sorted. So if I can scroll down, I’ll get all the hashes at the top, but then we need to change the ascending order based on this context variable. So if source ascending equals one, then I want it to be ascending; if not, I want it to be descending. So let’s go and play this.
So see all users, and you can see it works now. Also notice the default that came in, which started off with sorting descending. So you might want to flip it like I did with the other canvas app and say, “Well, sort descending as well as sort ascending.” Alternatively, we could go into the main screen, and we could say that this is navigation. So we’re navigating to the user detail screen, and we have the transition. So we could add a transition if you so wished. So let’s add a transition for COVID, but then we can add a variable, a context variable.
So sorting in ascending order equals one. So that would work as well. That means that no matter what we do, every time you enter this screen, it will always be ascending. So it’s entirely your methodological choice, how you actually want your app to work. So finally, I want to add a search function. So I want to be able to search for individuals here in this gallery. So let’s add a bit of room. We’ll add an icon, a search icon, just there. We’ll add a text input. As a result, perhaps the border will be less prominent. So we should have a border colour here or maybe a border style. So change that from dot to dashed, or maybe even none or dotted. So that appears to be a bit too; perhaps we’ll change that to dot. And as I said, we can change the colour as well. Then we must implement it in the sort by columns. So here is our table, our source: So now we need to use the search functionality. So we are searching a column, or more accurately, a table. We’re searching it for text, or the text we are searching is this text input, so it’s probably called the text input one.
And where are we searching while we’re searching by full name? We got squiggly underlined because I’m taking the entire text or input one, which is a control but shouldn’t be a control, and we should just be using text. So I need to text. So have a look at all of these data types and what each one is expecting. If you run into a problem, Now you can see our gallery is currently empty. That’s because this text input currently has a default setting for text input. We don’t want that and want to get rid of it. And so when it’s blank, now we can see the entire gallery. And if I play this and search for someone like, say, Plan, we have the power platform Plan. So in this section, what we’ve done is added pictures and image controls. We’ve added variables so we can do sorting. And we’ve also been searching, looking for text. In the next section, what we’re going to do is start looking at components. So components are standalone items—black boxes. So just like, for instance, a text input, a black box I can create a component and then use it not only in my current app but also in others. So it allows me to have reusability, and I can also update it and have it updated in the other apps. So that’s all for the next section. Please join me there.
