Placeholder Image

Subtitles section Play video

  • what's going on?

  • Everybody.

  • And welcome to part six of our key V tutorial in this video, we're going to be finishing up our TV chat application and then, uh, testing it made sure it all works.

  • And then in the next video, we'll actually be packed.

  • Well, we'll be going over packaging, and we'll all at least go over.

  • You know how you would do it on Windows and how you can do it on Android.

  • Uh, mayor may not cover IOS and other things we will see.

  • Okay, so let's go and get started.

  • So Ah, basically the crux of all the things that we have to change here are going to be in our chat page.

  • So as soon as I find shat Page here we are.

  • So we need to change the send message bit.

  • Um, and then we also want to add a couple more things, even tore, innit?

  • Method?

  • So let's go ahead and do that first.

  • So the first thing we're gonna do is window.

  • We're gonna adopt bind, and we're going to say on key down equals self dot on underscore key.

  • Underscore down.

  • Ah, we will add that method.

  • Basically what that's gonna before is so we can bind the enter key to also send a message.

  • Cool.

  • Okay, um, that way you don't like.

  • Click it, you know, every chat up you hit enter and it sends a message.

  • All right, so once we've done that, uh, now what we want to do is we are going to clock dot sh Edgell.

  • Uh, once I am, we're going to schedule self dot focus, underscore text, underscore input.

  • We'll do that in one second, and then we will.

  • Ah, socket.

  • Underscore.

  • Client dot Start on her score listening and then self dot Incoming underscore message and show error.

  • Should there be an error.

  • Okay, so now let's go ahead in handle for that on key down time.

  • So defined on underscore key.

  • Underscore down.

  • And that will be self instance.

  • Keyboard key code, text and modifiers.

  • Okay.

  • Why didn't you tab over?

  • Uh, no, no, no, no, no, no.

  • Now you are.

  • Why?

  • Okay, we'll let that slide.

  • I'm gonna let that slide.

  • I'm a little worried.

  • Little, little nervous, not gonna lie.

  • If key code is 40 that's your enter.

  • Key self dot Send underscore message, and then we'll pass none there, Uh, because son messages Expecting something.

  • Uh, now, now what do we do so we could cut?

  • Let's do the send message next.

  • So rather than printing send messages useful is that once was we're gonna say message equals self dot new underscore message dot text that is core responding to this, right, our text input.

  • So again, that's just always able to be pulled.

  • And we're just gonna grab whatever is in there any time someone hits the enter key or clicks on that button.

  • So either way, they hit the enter key it run, send message, or if they click on that button, it runs.

  • Send message.

  • So we grab the message and then immediately let's self dot new message dot ms dot text.

  • We're gonna set that to be empty because we want to empty out once they send the message that we don't want that message to remain in that box.

  • That would be annoying.

  • Ah, so long as there is a message if message we're gonna say self dot history dot update shat history hiss story.

  • Okay, then we got a long line here.

  • Um, I suppose I'll type it and we'll talk about it, so it's gonna be in every string.

  • And then we're going to say the color is equal to D D 2020 and so the are user name and then other user names are gonna be different colors.

  • So dd 2020 and then we're gonna say, uh, chat app dot connect page dot user name.

  • So this is just and then dot tax no, forget dot text.

  • Uh, this is just gonna be your username, right?

  • So we're just gonna grab your user name from, uh, that original log in page.

  • Then we're gonna close off our color tags, so slash color are slashed color, and then what we're going to dio is, um, just dio a greater than symbol there.

  • And then whatever the message is, eso using F strings will just format that in their beautiful cool.

  • So once we've done that, we want to send that message out to everybody else so we see our message, but now you need everybody else to see our message.

  • So we're going to use the socket client and where schools a socket client us send a message, and it's gonna handle all the socket stuff for us.

  • lovely.

  • Uh, now, what we want to dio is refocus on that input field.

  • So we're gonna say clock clock dot schedule, uh, once.

  • Wow.

  • Wow.

  • Uh, self dot Focus, text input.

  • And we'll just do that really quickly after they've hit the enter key.

  • Hopefully, this is not like a super fast user.

  • Ah, and we could actually slow people down.

  • I'm I'm a totally ah person who, like, sends a message and then hit center and then continue.

  • Like, rather than make all one big message, I make, like, four lines.

  • Um, we could really slow people down this way anyway.

  • But we won't, so All right, once we've done that, um, now we're gonna need to focus text input.

  • Well, we're gonna need that to be a method.

  • So define focus.

  • Text input.

  • That'll be self and a non important.

  • Parameter self dot New underscore message dot Focus is equal to true.

  • So just really do that.

  • And then finally, um, we need to get any new messages.

  • So we're gonna say define, uh, incoming message self.

  • The user name and the message.

  • So self dot history dot update chat history.

  • Uh, with an F string and again, We're gonna say color, and this time we're going to give it a 20 dd 20 and then it will be whatever that user name waas and then slash color And then, like before the message.

  • Cool.

  • So we will save that.

  • And I'm tempted to run that.

  • I'm sure we're forgetting something.

  • Let's just go ahead and run and see what happens.

  • So see if we have any heirs Voice devil.

  • Well, go ahead and connect locally because we're running locally.

  • Hello.

  • Okay, so we're definitely Oh, you know what?

  • I probably ran the old one.

  • Yeah, I did.

  • Okay.

  • Keep you up.

  • Six.

  • Cool.

  • Connect.

  • Great.

  • Hello.

  • Okay.

  • Finally, um oh, do we?

  • Here's what I probably didn't do.

  • Um, we gave Scroll Herbal label and I bet on the chat page and I didn't change label.

  • Yeah, so we need to change this self history that needs to be a scroll herbal label.

  • So the air I got just to be clear.

  • Um, it just it just said label has no entre attributes update chat history.

  • So that kind of signals to me, I know what has that.

  • That's the scroll of a label, and obviously It's not a label object.

  • It's mobile label.

  • Um Okay, so let's go ahead and just rerun that again.

  • See what happens.

  • Hello.

  • Up still crashes and label object has no attributes.

  • Update chat history.

  • Well, that's kind of I didn't save.

  • Let's try again.

  • Oh, okay.

  • It works.

  • Okay, Now we need to test to see if it updates for other, um, other people correctly.

  • So let's check that really quick.

  • Let me run TV app six over again.

  • And this time I'm gonna connect to my actual server.

  • 231239 The other thing you could use his run to locally.

  • Um, but I'm gonna do it this way.

  • Hello?

  • And then.

  • All right.

  • Great.

  • Cool.

  • Okay.

  • So that that works.

  • We get text from both, uh, you know, us and the other people.

  • Hopefully, I don't have any other errors here.

  • Um, that's a lot of code that we just kind of ran through really quickly, but yeah.

  • Cool.

  • So, uh, the next thing that we're going to do is work on learning how to fix that, first of all, but well, we'll save that for the next 50.

  • Uh, yeah.

  • We lose some of this, uh, of the interactivity because of our fancy thing.

  • Cool.

  • Um, yeah.

  • The interest.

  • Yeah.

  • Okay.

  • First meeting.

  • Okay, so we're gonna have to fix that.

  • Will fix that in the next video as well as talk about deployments.

  • Um, or maybe I will.

  • Yeah, I think we'll fix this.

  • Let's just fix this real quick.

  • I've got that in my notes for this video.

  • So let's go ahead and fix that.

  • That way, the next video could be purely deployment.

  • So, uh, update chat, history layout.

  • Eso I would go see you Just think about how I want to do this.

  • I think I'm just gonna copy and paste these things in tow.

  • Fix this because the issue is that we've made this like a pressure.

  • Is this custom scroll herbal, Uh, label update, chat history.

  • So me copy this, and I'm gonna add this here, and this is all in the text based version is tutorial.

  • And if you just scroll down to the bottom, these air, the fixes.

  • So basically, what we're trying to do is like when we send the message it resized because of what we called here.

  • So we're just gonna go ahead and call this to occur all the time.

  • Um, And then the other thing I want to do, let me grab this bit of code, and we're gonna go to the chat page, innit?

  • Method.

  • And I think I'll just throw it here, adjust fields, and then I'm gonna add this to our chat page here, see if we can fix it.

  • Okay?

  • Yeah.

  • Let me just rerun that really quick.

  • I make sure that works.

  • Because this was kind of a funky, a funky issue that we were having because you normally, like you shouldn't have to deal with that kind of stuff.

  • Okay, you just confront.

  • Yeah.

  • Okay, So now, because the big thing is the big thing was, like, dependent.

  • Like wherever the APP started, it usually worked out really well with the layout.

  • But the problem is, with phones, you're you want to be able to rotate the phone.

  • So you need this chat app to constantly change one of the interesting things that we found.

  • Ah, doing this waas um, that in a just fields, if you just called this toe, run that update, um, update the layout.

  • That would not work.

  • We and Instead, we had to just schedule it once.

  • Period it schedule it once 0.1 seconds out.

  • So you couldn't schedule it immediately or you couldn't just call it.

  • You had to schedule it to run soon.

  • Uh, not really sure why?

  • Like there's pricing back in thing that's happening there.

  • Like maybe things get drawn and then some logic is done, and then it's shown, and then that's what happens when.

  • So this way we got it drawn later.

  • I really don't know.

  • It's kind of funky, but anyways, all we're doing, basically is just re sizing things.

  • So when the window gets resized, we re sized things.

  • Uh, which again we wouldn't really want to dio.

  • And I'm not really sure if there's a way around that.

  • So anyway, I'm just I'm not gonna go too deeply into that because the only reason we have to do that, I believe, is purely because of the scroll herbal label that we created.

  • I'm pretty sure the other all of the other key, the widgets, you would never have to actually do that.

  • But if you want to make your own, I guess you got to start thinking about how to make him also be re sizable.

  • Okay, so now I freed us up.

  • So the next video, I can talk purely about deployment.

  • But if you have any questions specifically on exactly what we did or this code doesn't make any sense to you, for whatever reason, it's pretty basic python, but, um, feel free to ask, uh, anyway, yeah, I think that's it.

  • Questions, comments, concerns, whatever.

  • Feel free to leave them below.

  • Always.

  • I'll see you guys in the next video where we'll be deploying things.

  • Um, and actually, you could even see.

  • I've got it on my on my phone as we speak.

  • Look at that chat up.

  • Incredible.

  • It's super fun.

  • Deploying toe android.

  • Okay, so you guys there?

what's going on?

Subtitles and vocabulary

Click the word to look it up Click the word to find further inforamtion about it