Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add add implements PreferredSizeWidget in stateful widget

For separate appbar widget its must to add implements PreferredSizeWidget in class. Issue is that I see everyone uses it will StateLess Widget.

But I have a Stateful widget and wants to use it with that. How to add implement methods on Stateful widgets

When I add implements PreferredSizeWidget it gives error

class MyAppBar extends StatefulWidget implements PreferredSizeWidget  {
  @override
  _MyAppBarState createState() => _MyAppBarState();
}

How can I fix it?

like image 581
Haseeb Ahmad Avatar asked Mar 18 '20 16:03

Haseeb Ahmad


People also ask

How do you pass data to a stateful widget?

To pass data to stateful widget, first of all, create two pages. Now from the first page open the second page and pass the data. Inside the second page, access the variable using the widget. For example widget.

How do I use PreferredSizeWidget in flutter?

If you want to create your own custom prefered size widget all you need to do is to implement PreferredSizeWidget interface in your widget. Example: import 'package:flutter/material. dart'; class MyWidget extends StatelessWidget implements PreferredSizeWidget { @override Size get preferredSize => Size.

How do I create a stateful widget?

To create a stateful widget in a flutter, use the createState() method. The stateful widget is the widget that describes part of a user interface by building a constellation of other widgets that represent a user interface more concretely. A stateful Widget means a widget that has a mutable state.

Which method of stateful widget notifies the changes in UI?

A stateful widget is implemented by two classes: a subclass of StatefulWidget and a subclass of State . The state class contains the widget's mutable state and the widget's build() method. When the widget's state changes, the state object calls setState() , telling the framework to redraw the widget.


3 Answers

For anybody having the same problem, this is what I did

class MyAppBar extends StatefulWidget implements PreferredSizeWidget  {
  @override
  _MyAppBarState createState() => _MyAppBarState();

  // you can replace 100 to whatever value you wish to use

  @override
  Size get preferredSize => new Size.fromHeight(100);
}

class _MyAppBarState extends State<MyAppBar> {
  @override
  Widget build(BuildContext context) {}
}
like image 85
Eric Aig Avatar answered Oct 18 '22 20:10

Eric Aig


You can use PreferredSize for that, Like

Scaffold(
    appBar: PreferredSize(
      preferredSize: Size.fromHeight(yourAppBarHeight),
      child:Container(child: Text("Body of your app bar")  
         )
       )

If you want to separate your app bar implementation and your code the other answer is more suitable for you.

like image 30
meditat Avatar answered Oct 18 '22 20:10

meditat


Override preferredSize method and return Size using any constructor.

 @override
  Size get preferredSize => Size.fromHeight(50);
like image 26
Suman Maharjan Avatar answered Oct 18 '22 20:10

Suman Maharjan