Question 249078 in Flutter Question posted in
The official Flutter documentation can be found here.

AppBar on all Screens in flutter

I think I have a simple question but I don’t know why its not work

Simple:
main.dart

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const Welcome(),
    );
  }
}

Second file:
welcome.dart

  class Welcome extends StatelessWidget {
  const Welcome({super.key});

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      appBar: AppBarNav(
        title: 'JobFinder',
      ),
    );
  }
}

AppBar file:
appbar.dart

import 'package:flutter/material.dart';

class AppBarNav extends StatelessWidget {
  final String title;
  const AppBarNav({super.key, required this.title});

  @override
  Widget build(BuildContext context) {
    return AppBar(
      title: Text(title),
    );
  }
}

Debbuger say:
The argument type ‘AppBarNav’ can’t be assigned to the parameter type ‘PreferredSizeWidget?’

Why?

Do you know why the debugger tells me that I can’t use AppBar in the Welcome.dart file?
I know it’s probably simple but I can’t find a solution to it.

Generally I want to place an appBar on every screen (same Appbar)

Tags:

2

Answers


  1. 0

    the argument appBar needs to be directly an AppBar. You are giving it an AppBarNav which is not an AppBar even if it only consists of one.

    Technically it doesn’t need to be an AppBar but a PreferredSizeWidget which an AppBar implements. So alternatively you could also let your AppBarNav implement PreferredSizeWidget like this

    class AppBarNav extends StatelessWidget implements PreferredSizeWidget {
  final String title;
  const AppBarNav({super.key, required this.title});

  @override
  Widget build(BuildContext context) {
    return AppBar(
      title: Text(title),
    );
  }

  @override
  // TODO: implement preferredSize
  Size get preferredSize => throw UnimplementedError();
}

    But then you need to provide an implementation for preferredSize also

    Login or Signup to reply.
  2. 0

    Simple solution

    import 'package:flutter/material.dart';

class AppBarNav extends AppBar {
  final String title;
  const AppBarNav({super.key,String? title}) : super(title : title ?? '');

}

    Or maybe this one :

    import 'package:flutter/material.dart';

class AppBarNav extends StatelessWidget {
  final String title;
  const AppBarNav({super.key, required this.title});

  @override
  Widget build(BuildContext context) {
    return PreferredSize(
        preferredSize: const Size.fromHeight(80.0),
        child: Container(
          decoration: const BoxDecoration(
            gradient: LinearGradient(
              colors: <Color>[Colors.blue, Colors.pink],
            ),
          ),
          child: const Text(title),
        ),
      );
  }
}

    You can check this answer and this documentation example.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search