DEV Community

Cover image for Flutter & Dart Tips - Week In Review #5
Offline Programmer
Offline Programmer

Posted on

Flutter & Dart Tips - Week In Review #5

Hello Reader,

In this post, I'll share the Flutter\Dart tips I tweeted last week. One of those tweets got more than 35 likes. Can you guess which one?

1- AppBar is the topmost component of the app (or sometimes the bottom-most), the AppBar’s layout contains three components: leading, title, and actions


    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text(
            'App Title',
          ),
          centerTitle: true,
          actions: [
            IconButton(
              icon: Icon(Icons.logout),
              onPressed: () {},
            ),
          ],
          backgroundColor: Colors.yellowAccent[600],
          elevation: 50.0,
          leading: IconButton(
            icon: Icon(Icons.menu),
            tooltip: 'Menu Icon',
            onPressed: () {},
          ), //IconButton
          brightness: Brightness.dark,
        ),
        body: const Center(
          child: Text(
            "Enjoy",
            style: TextStyle(fontSize: 24),
          ), //Text
        ), //Center
      ); //Scaffold;
    }

Enter fullscreen mode Exit fullscreen mode

2- To write any Dart program, be it a script or a Flutter app, you must define a function called main(). It is the entry point of every app.


    void main() {
    var list = ['London', 'Dublin', 'Paris'];
    list.forEach((item) {
        print('${list.indexOf(item)}: $item');
    });
    }

Enter fullscreen mode Exit fullscreen mode

3- You can change the text color of a button when it’s pressed.


    TextButton(
        onPressed: () {},
        style: ButtonStyle(
        foregroundColor: MaterialStateProperty.resolveWith<Color>(
            (Set<MaterialState> states) {
            if (states.contains(MaterialState.pressed)) return Colors.pink;
            return null; // Defer to the widget's default.
        }),
        ),
        child: Text(
        'Change My Color',
        style: TextStyle(fontSize: 30),
        ),
    ),

Enter fullscreen mode Exit fullscreen mode

4- The example below is about running a code after dismissing a GetX dialog.


    Get.dialog(MyAlert()).then(
        (value) => runSomeCode(),
    );

Enter fullscreen mode Exit fullscreen mode

5- Enums and extension methods can make code cleaner to read. In the example below, we are converting Enums to Strings.


    enum Cities { London, Dublin, Paris }

    extension ToString on Cities {
    String get name => toString().split('.').last;
    }

    void main() {
    print(Cities.London.name);
    print(Cities.Dublin.name);
    print(Cities.Paris.name);
    }

Enter fullscreen mode Exit fullscreen mode

6- Dart allows you to create a callable class so you can call the instance of the class as a function


    class WelcomeToTheCity {
    // Defining call method
    String call(String a, String b, String c) => 'Welcome to $a$b$c';
    }

    void main() {
    var welcome_to_city = WelcomeToTheCity();

    // Calling the class through its instance
    var welcome_msg = welcome_to_city('SanDiego ', 'CA ', 'USA');

    print(welcome_msg);
    }

Enter fullscreen mode Exit fullscreen mode

See you next week. 👋🏻

Follow me on Twitter for more tips about #coding, #learning, #technology...etc.

Check my Apps on Google Play

Cover image Clem Onojeghuo on Unsplash

Discussion (0)