Anvil: Web apps with nothing but Python Transcripts
Chapter: Navigating between views
Lecture: Using the navigation module within a component

Login or purchase this course to watch this video and the rest of the course contents.
0:00 So we built up this navigation
0:01 and one of the things I gave as motivation was
0:04 well, yeah if all the navigation actually happened
0:07 within the home form
0:09 well, we could just stick it in there
0:10 and it'll all be well and good, right?
0:12 However, it's mixed throughout all of these things
0:15 and when I say compare
0:18 or especially when I say add measurement
0:21 when this is finished
0:22 what I would like to do is have it take me away.
0:25 So let's see what it's doing now.
0:27 We come over here and I can add a measurement
0:29 and I pick today, that's cool.
0:32 I can say this let's put 180
0:35 and our validation works.
0:37 I don't know what my heart rate is
0:38 but let's say it's 70. Boom!
0:41 And we get a little print.
0:42 Hey, we saved this, that's cool.
0:45 Great. And what would we really want to do?
0:48 Not stay on this page.
0:49 That's probably the worst possible thing.
0:51 We would probably want to go home
0:52 and here's like a list
0:54 of our recent measurements we've added
0:56 or a graph. A graph would be even better.
0:58 When we're done adding it successfully
1:00 we want to go home. Check this out.
1:03 So over here
1:04 this is part of the glory is say import
1:06 navigation. This part, this would go home.
1:11 Let's just say navigation dot go home.
1:14 Let's see it now. Come over here
1:18 we're going to say add.
1:19 I don't need that.
1:20 Let's still say it's today
1:21 we're not actually saving in this.
1:23 179. I lost a pound in just as few seconds
1:27 and my heart rate went up. Ready?
1:30 When I click this, it should print out that we're going to save it
1:32 which will simulate saving it
1:33 and we'll get to that when we actually work
1:34 with the database but the next thing to do is
1:37 it should remove this component here
1:40 and it should take us, effectively
1:41 from what the user's perspective is back to the home screen.
1:45 Ready? Boom!
1:47 Home anonymous because that's what we're loading up, right?
1:49 It should be the logged in one.
1:50 I guess, sort of. Isn't that cool?
1:52 How awesome is that? And look how easy it is
1:54 to share this navigation function
1:57 throughout our entire application
1:59 even other modules. Right?
2:02 If we have other modules over here
2:03 potentially they could do navigation.
2:06 Now, one final caveat within this function
2:09 this initialization function
2:11 the sequence of events happening here is
2:14 this add measurement component is about to be put
2:17 into the main view most likely.
2:20 It's not quite there yet.
2:21 It's about to member the processes
2:23 allocate, set data
2:24 and then put it in the component panel there.
2:27 What that means is
2:28 we're not ready to stop navigating here
2:31 and go somewhere else.
2:32 So you can't do something like, I don't know
2:34 if not account
2:36 navigation go home or go account, I don't know.
2:39 Let's put it the other way.
2:40 All right, if account
2:41 we want you to go here instead
2:43 you can do that within response to button clicks
2:46 other behaviors, timers, and whatnot
2:48 but you cannot do that in the initialization here.
2:52 Just because of that workflow
2:54 that we talked about at the beginning.
2:55 We're not even done loading this component.
2:58 We can't navigate away from it yet.
2:59 Okay, so we just keep in mind
3:01 this navigation does not work in the initializers
3:04 but it pretty much works everywhere else
3:06 and it's a thing of beauty.