Introducing: DashBot the Chatbot! | Learning to Fly

Ғылым және технология

In this episode of Learning to Fly, Khanh builds a Dash Chatbot. Implementing a chat interface complete with blue bubbles, why won’t the chat UI scroll to the bottom, and what are Dash’s best jokes? Plus - a special guest joins from a boring location!
GitHub → goo.gle/3PuGOYf
Catch more Learning to Fly videos → goo.gle/LearningToFly
Subscribe to Flutter! → goo.gle/FlutterYT
#LearningToFly #Flutter #Developer

Пікірлер: 54

  • @dushes_botalov
    @dushes_botalov2 жыл бұрын

    I've been working with flutter since 2018, but I constantly feel like I'm writing the code wrong and I'm a bad developer if it has a lot of conditions in build method, like in your bubble example. Thank you for reminding people that sometimes this is normal 🙂

  • @_chappie_

    @_chappie_

    2 жыл бұрын

    Use something like Stacked framework from filled stack. Allows you to separate your UI from the business logic look them up on KZread. I hate having to put logic into the build method too.

  • @dushes_botalov

    @dushes_botalov

    2 жыл бұрын

    @@_chappie_ I meant that sometimes u think that there is a more elegant and simple solution for writing code, but in reality your solution can be normal and working, even if it has a lot of conditions and code at all. It's like imposter syndrome maybe

  • @_chappie_

    @_chappie_

    2 жыл бұрын

    @@dushes_botalov ohhh gotcha gotcha. I get that feeling a lot to

  • @suranjithnishalaka7395

    @suranjithnishalaka7395

    2 жыл бұрын

    I have the same problem 😵‍💫 however, thanks Crag, your advice ❤️

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Admitting that I'm not confident in my code to an audience is scary, but knowing that you found it to be a helpful reminder makes that scary leap it all worth it. Thank you for taking the time to write such a kind comment. It really means a lot to me! 💙

  • @phalady
    @phalady2 жыл бұрын

    Feature suggestion: A response from Dash chatbot that displays a horizontally scrollable list of fan images (maybe use Cards). Since now we're talking about lists within a list, you may have to use CustomScrollView instead of ListView.

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    There are a lot of Dash fan images out there, plus I haven't used a CustomScrollView in the app yet. Great idea!

  • @darttutorial
    @darttutorial2 жыл бұрын

    Great to see the progress of flutter

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thank you for your continued support 😀

  • @AJFlutterTutorials
    @AJFlutterTutorials2 жыл бұрын

    You are the best Flutter Team. We, your fans are always with you 🤩

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thank you for the support 😎

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Thank you! 💙

  • @sivaprasadnk123
    @sivaprasadnk1232 жыл бұрын

    I would like to suggest to customize the DashBot icon(image) with a list of Dash images the user can select and set in their chat

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Oooh that would be a fun one! There's a ton of cute Dash images out there too...

  • @jeanmartinpachasvilla6640
    @jeanmartinpachasvilla66402 жыл бұрын

    one feature I would add is the history of the whole chat.... because as we know, in a chat we cannot load all the messages in a single request, so it would be good to add that part... something like pull refresh but showing more old messages...

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    That's a really good one!

  • @verticrow
    @verticrow2 жыл бұрын

    Thanks for another great episode!

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    You are very welcome! Thank you for joining us 😄

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Thank you for watching :)

  • @suranjithnishalaka7395
    @suranjithnishalaka73952 жыл бұрын

    Craig and Khanh, one thing to say, I ❤️ u both. bcz of your valuable contents

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thank you for your kind words, Suranjith 😎

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    💙!!

  • @harshgupta-ud9di
    @harshgupta-ud9di Жыл бұрын

    Great video pls make more videos

  • @lemidiriba3878
    @lemidiriba38782 жыл бұрын

    love to watch you guys. your Awsome!

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Thank you for sticking around and watching!! 💙

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thanks for your support! We're happy to have you onboard 😄

  • @santatrahasitiana7223
    @santatrahasitiana72232 жыл бұрын

    Good episode :)

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Thanks for watching! :)

  • @mamaefit8084
    @mamaefit80842 жыл бұрын

    Thank you for sharing this tutorial

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    We're glad you enjoyed the tutorial 😄 Be sure to check out more Learning to Fly videos here: goo.gle/LearningToFly

  • @albertoazinar1209
    @albertoazinar12092 жыл бұрын

    Awesome

  • @ningbuxiangjian
    @ningbuxiangjian2 жыл бұрын

    new for flutter, it's quit good

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thank you for the kind words, Smith. We're glad that you're enjoying Flutter 😁

  • @nifhanif
    @nifhanif2 жыл бұрын

    nice information 👍

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thanks, Nif! We're glad you enjoyed the video 🙂

  • @TungNguyen-lt5ej
    @TungNguyen-lt5ej2 жыл бұрын

    From Viet Nam with lov3!

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    💙

  • @khurshidddbek
    @khurshidddbek2 жыл бұрын

    One of the most important features is the notification.

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Hmm, I considered notifications for a regular chat app but didn't think about with a chatbot. Good callout!

  • @ilyasarafath7585
    @ilyasarafath75852 жыл бұрын

    Cool👍🏻

  • @nidalbakir4720
    @nidalbakir47202 жыл бұрын

    For question 2: Please use Chain of responsibility design pattern

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Hmm, so I broke out a lot of the original widget into separate widgets that had a single responsibility. Would you break it down even more?

  • @nidalbakir4720

    @nidalbakir4720

    2 жыл бұрын

    ​@@KhanhFlutter Sure, so we will call one function to return a Widget, that Widget will be our message. We have a chain of knots, And every chain knot will check if it can handle the message - if yes then the chain knot will call the build method and return our message widget. - if the chain knot can't handle the message it will pass the message to the next chain knot. and so on, until we reach the last knot in our chain, the _(unsupported_message_type)_ that will call the build method and return a widget to tell the user that the message he received is not supported and the user should update the app. With this design pattern, we can introduce new types of messages like voice and video messages without any problem at all. And everything is separated from each other. Here I will provide you with a code snippet I'm using in my current project. *_message_builder.dart_* /// Chain of Responsibility design pattern /// /// This is the BaseBuilder abstract class MessageBuilder { final MessageBuilder? nextMessageBuilderHandler; MessageBuilder(this.nextMessageBuilderHandler); Widget build(LocalChatMessage message); } class MessageBuilderWidget { static MessageBuilderWidget? _instance; late final TextMessageBuilder _textMessageBuilder; late final ImageMessageBuilder _imageMessageBuilder; late final UnsupportedMessageTypeBuilder _unsupportedMessageTypeBuilder; MessageBuilderWidget._() { _unsupportedMessageTypeBuilder = UnsupportedMessageTypeBuilder(); _imageMessageBuilder = ImageMessageBuilder(_unsupportedMessageTypeBuilder); _textMessageBuilder = TextMessageBuilder(_imageMessageBuilder); } static Widget buildMessage(LocalChatMessage message) { _instance ??= MessageBuilderWidget._(); return _instance!._build(message); } Widget _build(LocalChatMessage message) { return _textMessageBuilder.build(message); } } ______________________________________________________________________________ *_text_message_builder.dart_* class TextMessageBuilder extends MessageBuilder { TextMessageBuilder(MessageBuilder nextMessageBuilderHandler) : super(nextMessageBuilderHandler); @override Widget build(LocalChatMessage message) { if (message.messageType != MessageType.text.name) { return super.nextMessageBuilderHandler!.build(message); } return _TextMessageBuilderWidget( key: Key(message.localMessageId.toString()), message: message, ); } } ______________________________________________________________________________ *_image_message_builder.dart_* class ImageMessageBuilder extends MessageBuilder { ImageMessageBuilder(MessageBuilder nextMessageBuilderHandler) : super(nextMessageBuilderHandler); @override Widget build(LocalChatMessage message) { if (message.messageType != MessageType.image.name) { return super.nextMessageBuilderHandler!.build(message); } return _ImageMessageBuilderWidget( key: Key(message.localMessageId.toString()), message: message, ); } } ______________________________________________________________________________ *_unsupported_message_type_builder.dart_* class UnsupportedMessageTypeBuilder extends MessageBuilder { UnsupportedMessageTypeBuilder() : super(null); @override Widget build(LocalChatMessage message) { return _UnsupportedMessageTypeBuilderWidget( key: Key(message.localMessageId.toString()), message: message, ); } } ______________________________________________________________________________ And simply We call the (MessageBuilderWidget.buildMessage) like this: ListView.builder( itemCount: _chatMessages.length, itemBuilder: (context, index) { return MessageBuilderWidget.buildMessage(_chatMessages[index]); }), Have a good day ☕

  • @jasonfox13
    @jasonfox132 жыл бұрын

    I think it’s will be cool to see AI in chat bot)

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Dash AI!

  • @sixtusagbo
    @sixtusagbo2 жыл бұрын

    Flutterful, 🤩!

  • @flutterdev

    @flutterdev

    2 жыл бұрын

    Thanks for the love, Sixtus! We're glad you enjoyed the video😎

  • @webdeveloper9826
    @webdeveloper98262 жыл бұрын

    about 1.5 year ago i developed a chat app using flutter.At that time Webrtc are not stable as much the only problem i face is for calling VOIP and how to do background things work when app is get killed ? is their any better solution now a days for that. #background custom method processing and receiving calls Thanks

  • @minhmantv18
    @minhmantv182 жыл бұрын

    Xin chào Khanh Nguyen :)

  • @KhanhFlutter

    @KhanhFlutter

    2 жыл бұрын

    Chào bạn :)

  • @azkadev
    @azkadev2 жыл бұрын

    can you make a tutorial how to play video on cross platform?

  • @etcworld3660
    @etcworld36602 жыл бұрын

    Subscribers done🇧🇩🇧🇩🇧🇩🇧🇩

Келесі