How to open this type of alert dialog in flutter - android

I wanted to show dialog in my application. How can i achieve this using flutter


You can use a PopupMenuButton (https://api.flutter.dev/flutter/material/PopupMenuButton-class.html) to achieve this in flutter.
See example code below:
PopupMenuButton<int>(
itemBuilder: (context) => [
const PopupMenuItem(
value: 1,
child: Center(
child: Icon(
Icons.download_outlined,
size: 30.0,
),
),
),
const PopupMenuItem(
value: 2,
child: Center(
child: Icon(
Icons.link,
size: 30.0,
),
),
),
const PopupMenuItem(
value: 2,
child: Center(
child: Icon(
Icons.share,
size: 30.0,
),
),
),
],
icon: const Icon(
Icons.more_horiz,
size: 40.0,
),
offset: const Offset(150, -150),
);
The above example popups a list of Icons when the PopupMenuButton is pressed.
You can adapt this to your use-case above.


Finally I found a Solution thanks enfinity. Here how i solve the problem.
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
home: new MyHomePage(),
);
}
}
/// An arbitrary widget that lives in a popup menu
class PopupMenuWidget<T> extends PopupMenuEntry<T> {
const PopupMenuWidget({ Key key, this.height, this.child }) : super(key: key);
#override
final Widget child;
#override
final double height;
#override
bool get enabled => false;
#override
_PopupMenuWidgetState createState() => new _PopupMenuWidgetState();
}
class _PopupMenuWidgetState extends State<PopupMenuWidget> {
#override
Widget build(BuildContext context) => widget.child;
}
class MyHomePage extends StatelessWidget {
MyHomePage({Key key}) : super(key: key);
#override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
actions: <Widget>[
new PopupMenuButton<String>(
onSelected: (String value) {
print("You selected $value");
},
itemBuilder: (BuildContext context) {
return [
new PopupMenuWidget(
height: 40.0,
child: new Row(
children: [
IconButton(
icon: Icon(
Icons.remove,
color: Colors.green,
),
onPressed: () {
print("Remove");
}),
Text("1"),
IconButton(
icon: Icon(
Icons.add,
color: Colors.green,
),
onPressed: () {
print("Add");
}),
],
),
),
];
}
),
],
),
);
}
}

Related

How to refer multiple values sepererately in flutter firebase?

import 'package:firebase_database/firebase_database.dart';
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_auth/firebase_auth.dart';
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: Authentication (),
);
}
}
class Authentication extends StatelessWidget {
const Authentication({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return StreamBuilder(
stream: FirebaseAuth.instance.authStateChanges(),
builder: (context, snapshot){
if(!snapshot.hasData){
return const SignInScreen(
providerConfigs: [
EmailProviderConfiguration()
],
);
}
return const Diarymain ();
},
);
}
}
class Diarymain extends StatefulWidget {
const Diarymain({Key? key}) : super(key: key);
#override
State<Diarymain> createState() => _DiarymainState();
}
class _DiarymainState extends State<Diarymain> {
final fbs = FirebaseDatabase.instance;
var currentUser = FirebaseAuth.instance.currentUser;
#override
Widget build(BuildContext context) {
final ref = fbs.ref().child('diary').child(currentUser!.uid);
return Scaffold(
floatingActionButton: FloatingActionButton(
backgroundColor: Colors.grey[350],
onPressed: () {
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (_) => AddEditDiary(),
),
);
},
child: const Icon(
Icons.add,
),
),
appBar: AppBar(title: Text('Diary'),),
body: FirebaseAnimatedList(
query: ref,
shrinkWrap: true,
itemBuilder: (context, snapshot, animation, index) {
return GestureDetector(
onTap: () {},
child: Container(
child: Padding(
padding: const EdgeInsets.all(8.0),
// child: ListView.builder(
// itemBuilder: (context, index) {
child: ListTile(
shape: RoundedRectangleBorder(
side: const BorderSide(
color: Colors.white,
),
borderRadius: BorderRadius.circular(10),
),
tileColor: Colors.blue[50],
trailing: IconButton(
icon: Icon(
Icons.delete,
color: Colors.blueGrey[900],
),
onPressed: () {
ref.child(snapshot.key!).remove();
},
),
title: Text(
snapshot.value.toString(),
style: const TextStyle(
fontSize: 25,
fontWeight: FontWeight.bold,
),
),
),
// },)
),
),
);
},
),
);
}
}
class AddEditDiary extends StatefulWidget {
const AddEditDiary({Key? key}) : super(key: key);
#override
State<AddEditDiary> createState() => _AddEditDiaryState();
}
class _AddEditDiaryState extends State<AddEditDiary> {
TextEditingController title = TextEditingController();
TextEditingController subtitle = TextEditingController();
final fbs = FirebaseDatabase.instance;
var currentUser = FirebaseAuth.instance.currentUser;
#override
Widget build(BuildContext context) {
final ref = fbs.ref().child('diary').child(currentUser!.uid);
return Scaffold(
appBar: AppBar(title: Text('Add'),),
body: ListView(
children: <Widget> [
Padding(
padding: const EdgeInsets.all(8.0),
child: TextFormField(
controller: title,
decoration: InputDecoration(
labelText: 'Title',
hintText: 'Enter Title',
border: OutlineInputBorder(),
),
)
),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextFormField(
controller: subtitle,
decoration: InputDecoration(
labelText: 'Subtitle',
hintText: 'Enter Subtitle',
border: OutlineInputBorder(),
),
)
),
Padding(
padding: const EdgeInsets.all(8.0),
child: RaisedButton(
onPressed: () {
ref
.push()
.set({
'title' : title.text,
'subtitle' : subtitle.text,
})
.asStream();
Navigator.pushReplacement(
context, MaterialPageRoute(builder: (_) => Diarymain()));
},
child: Text('Save', style: TextStyle(color: Colors.white),),
color: Colors.pink,
),
)
]
)
);
}
}
I'm trying to make a diary and two things which are title and subtitle are stored in the firebase real-time database. Below part of code shows how they are added in the firebase.
child: RaisedButton(
onPressed: () {
ref
.push()
.set({
'title' : title.text,
'subtitle' : subtitle.text,
})
.asStream();
When title and subtitles are shown on the page, I want to show them separately and I think I need something value to refer them individually.
In my code, "snapshot.value.toString()," shows only both title and subtitle together.
Is there any way to indicate them separately?
I would appreciate it if anyone can help me with this.

Encaplsulating a widget for use in another dart file

What I'm trying to achieve:
Have a BottomNavigationBar widget in its own class in its own dart file called navigationBar.dart
Have a main.dart file that has a Scaffold widget that calls this class to create the BottomNavigationBar widget
Then in the main.dart file I want to be able to set the BottomNavigationBar from navigationBar.dart and I want to be able to change the body of the Scaffold widget in the main.dart file depending on which index is selected in the BottomNavigationBar widget (check the comment in the main.dart file in the body property for a better explanation)
Here is my code below so far:
navigationBar.dart
import 'package:flutter/material.dart';
import '../home.dart';
class NavigationBar extends StatefulWidget {
const NavigationBar({Key? key}) : super(key: key);
#override
State<NavigationBar> createState() => _NavigationBar();
}
class _NavigationBar extends State<NavigationBar> {
int selectedIndex = 2;
void _onItemTapped(int index) {
setState(() {
selectedIndex = index;
});
}
#override
Widget build(BuildContext context) {
return BottomNavigationBar(
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Home',
backgroundColor: Colors.red,
),
BottomNavigationBarItem(
icon: Icon(Icons.business),
label: 'Business',
backgroundColor: Colors.green,
),
BottomNavigationBarItem(
icon: Icon(Icons.school),
label: 'School',
backgroundColor: Colors.purple,
),
BottomNavigationBarItem(
icon: Icon(Icons.settings),
label: 'Settings',
backgroundColor: Colors.pink,
),
],
currentIndex: selectedIndex,
selectedItemColor: Colors.amber[800],
onTap: _onItemTapped,
);
}
main.dart
import 'package:flutter/material.dart';
import 'components/navigationBar.dart';
void main() {
runApp(const MaterialApp(home: App()));
}
class App extends StatefulWidget {
const App({Key? key}) : super(key: key);
#override
State<App> createState() => _App();
}
class _App extends State<App> {
static const List<Widget> _widgetOptions = <Widget>[
Text(
'Index 0: Home',
),
Text(
'Index 1: Business',
),
Text(
'Index 2: School',
),
Text(
'Index 3: Settings',
),
];
#override
Widget build(BuildContext context) {
const navBar = navigationBar()
return Scaffold(
appBar: AppBar(
title: const Text('Test App',
style: TextStyle(
color: Colors.white,
fontFamily: 'LogoFont',
fontSize: 30.0,
letterSpacing: 1.5)),
centerTitle: true,
backgroundColor: Colors.lightBlue[500],
elevation: 0.0,
),
backgroundColor: Colors.lightBlue[800],
body: //something like this: _widgetOptions.elementAt(navbar.selectedIndex)
),
bottomNavigationBar: navBar);
}
}
Any ideas on how I could create what I need in the bullet points? Any help would be great, thanks

I think there is no way with stateful widget but you can do this by provider, like example below.
Provider:
class MainViewProvider with ChangeNotifier ,
DiagnosticableTreeMixin{
int activeItem = 2;
changeActiveItem(int activeElement){
activeItem = activeElement;
notifyListeners();
}
}
BottomNavBar Widget:
class BotNavWidget extends StatelessWidget {
const BotNavWidget({Key? key}) : super(key: key);
get context => null;
#override
Widget build(BuildContext context) {
final watch = context.watch<ColorsProvider>();
return Container(
padding: EdgeInsets.symmetric(
horizontal: getWidth(16), vertical: getHeight(10)),
child: Container(
height: SizeConfig.height! * .1,
width: SizeConfig.width!,
decoration: BoxDecoration(
color: watch.colors[1],
borderRadius: BorderRadius.circular(getWidth(20))),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
buildIcon(watch.bottomIcons[0], context, 0),
buildIcon(watch.bottomIcons[1], context, 1),
buildIcon(watch.bottomIcons[2], context, 2),
buildIcon(watch.bottomIcons[3], context, 3),
buildIcon(watch.bottomIcons[4], context, 4),
],
),
),
);
}
buildIcon(ColorFiltered icon, BuildContext context, int i) {
final read = context.read<MainViewProvider>();
final watch = context.watch<MainViewProvider>();
final watchColors = context.watch<ColorsProvider>().colors;
return InkWell(
onTap: () async{
read.changeActiveItem(i);
},
child: Container(
padding: EdgeInsets.all(getWidth(15)),
height: SizeConfig.height! * .07,
width: SizeConfig.height! * .07,
decoration: BoxDecoration(
color: watch.activeItem == i ? watchColors[2] : Colors.transparent,
borderRadius: BorderRadius.circular(getWidth(20))),
child: SizedBox(
height: getHeight(24),
width: getHeight(24),
child: icon
),
),
);
}
}
P.S: You can use custom BottomNavigationBar Widget instead of making it manually

Black-Screen with the FlatButton in the AppBar

My App contains basically 2 parts -> Appbar (with 1 Button) and BottomNavigationBar (with some buttons that works properly). The problem came when I pressed the Appbar button (goes to a black screen instead of show the "manual_page.dart")
this is the content of the 2 files (the home_page.dart and manual_page.dart):
home_page.dart
import 'package:flutter/material.dart';
import 'package:opening_a_pdf/manual_page.dart';
import 'package:opening_a_pdf/first_page.dart';
import 'package:opening_a_pdf/second_page.dart';
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _selectedPage = 0;
List<Widget> pageList = List<Widget>();
#override
void initState() {
pageList.add(FirstPage());
pageList.add(SecondPage());
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xFFFAFAFA),
appBar: AppBar(
backgroundColor: Colors.black,
title: const Text('Aplicación en Desarrollo'),
actions: <Widget>[
FlatButton(
textColor: Colors.white,
child: Text(
'MANUAL',
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
),
),
onPressed: (){
Navigator.push(
context,
MaterialPageRoute(builder: (context) => Voice()),
);
}
)
],
),
body: IndexedStack(
index: _selectedPage,
children: pageList,
),
bottomNavigationBar: BottomNavigationBar(
// type: BottomNavigationBarType.fixed,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
backgroundColor: Colors.black,
icon: Icon(Icons.compare_arrows),
title: Text('Conectividad'),
),
BottomNavigationBarItem(
backgroundColor: Colors.black,
icon: Icon(Icons.blur_on),
title: Text('Captura Datos'),
),
BottomNavigationBarItem(
backgroundColor: Colors.black,
icon: Icon(Icons.graphic_eq),
title: Text('Voz'),
),
BottomNavigationBarItem(
backgroundColor: Colors.black,
icon: Icon(Icons.list),
title: Text('Comandos'),
),
BottomNavigationBarItem(
backgroundColor: Colors.black,
icon: Icon(Icons.settings),
title: Text('Ajustes'),
),
],
currentIndex: _selectedPage,
selectedItemColor: Colors.amber[800],
onTap: _onItemTapped,
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
void _onItemTapped(int index) {
setState(() {
_selectedPage = index;
});
}
}
manual_page.dart
import 'package:flutter/material.dart';
// ignore: camel_case_types
class Voice extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Sección de Órdenes por Voz"),
),
body: Stack(
fit: StackFit.expand,
children: <Widget>[
Positioned(
bottom: 0,
width: MediaQuery.of(context).size.width,
child: Center(
child: MaterialButton(
onPressed: () {},
color: Colors.red,
),
),
)
],
),
);
}
}

Try to initial the height of container in the second screen before Stack

There are no errors in the code. Works correctly. Maybe the fault is in the main () or in the emulator.
Code in main:
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}

I executed your code and found no problem with it:
But you can put empty Container() as the child of MaterialButton().
Corrected code:
MaterialButton(
onPressed: () {},
color: Colors.red,
child:Container(),
),

Flutter ListView on click navigate to another screen

I'm learning Flutter. I have a ListView and I would like to make the list items clickable. My idea is that when the user clicks on an item, it will be directed to another screen. Each buttom should leads to different screen. I'm having trouble implementing it, I don't know what to use: gesture detector or ontap. What should I do? Should I use ListTile instead of ListView?
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
final title = "ListView List";
return MaterialApp(
title: title,
home: Scaffold(appBar: AppBar(
title: Text(title),
),
body: new ListView(
shrinkWrap: true,
padding: const EdgeInsets.all(20.0),
children: List.generate(choices.length, (index) {
return Center(
child: ChoiceCard(choice: choices[index], item: choices[index]),
);
}
)
)
)
);
}
}
class Choice {
const Choice({this.title, this.icon});
final String title;
final IconData icon;
}
const List<Choice> choices = const <Choice>[
const Choice(title: 'This is a Car', icon: Icons.directions_car),
const Choice(title: 'This is a Bicycle', icon: Icons.directions_bike),
const Choice(title: 'This is a Boat', icon: Icons.directions_boat),
const Choice(title: 'This is a Bus', icon: Icons.directions_bus),
const Choice(title: 'This is a Train', icon: Icons.directions_railway),
];
class ChoiceCard extends StatelessWidget {
const ChoiceCard(
{Key key, this.choice, this.onTap, #required this.item, this.selected: false}
) : super(key: key);
final Choice choice;
final VoidCallback onTap;
final Choice item;
final bool selected;
#override
Widget build(BuildContext context) {
TextStyle textStyle = Theme.of(context).textTheme.display1;
if (selected)
textStyle = textStyle.copyWith(color: Colors.lightGreenAccent[400]);
return Card(
color: Colors.white,
child: Row(
children: <Widget>[
new Container(
padding: const EdgeInsets.all(8.0),
alignment: Alignment.topLeft,
child: Icon(choice.icon, size:80.0, color: textStyle.color,)),
new Expanded(
child: new Container(
padding: const EdgeInsets.all(10.0),
alignment: Alignment.topLeft,
child:
Text(choice.title, style: null, textAlign: TextAlign.left, maxLines: 5,),
)
),
],
crossAxisAlignment: CrossAxisAlignment.start,
)
);
}
}

You can copy paste run full code below
Step 1: To allow Navigator.push work, you can move MaterialApp to upper level
Step 2: In onTap pass Navigator.push
ChoiceCard(
choice: choices[index],
item: choices[index],
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Detail(choice: choices[index])),
);
},
),
Step 3: Wrap Card with InkWell and call onTap()
return InkWell(
onTap: () {
onTap();
},
child: Card(
working demo
full code
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(home: HomePage());
}
}
class HomePage extends StatelessWidget {
final title = "ListView List";
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(title),
),
body: new ListView(
shrinkWrap: true,
padding: const EdgeInsets.all(20.0),
children: List.generate(choices.length, (index) {
return Center(
child: ChoiceCard(
choice: choices[index],
item: choices[index],
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Detail(choice: choices[index])),
);
},
),
);
})));
}
}
class Choice {
const Choice({this.title, this.icon});
final String title;
final IconData icon;
}
const List<Choice> choices = const <Choice>[
const Choice(title: 'This is a Car', icon: Icons.directions_car),
const Choice(title: 'This is a Bicycle', icon: Icons.directions_bike),
const Choice(title: 'This is a Boat', icon: Icons.directions_boat),
const Choice(title: 'This is a Bus', icon: Icons.directions_bus),
const Choice(title: 'This is a Train', icon: Icons.directions_railway),
];
class ChoiceCard extends StatelessWidget {
const ChoiceCard(
{Key key,
this.choice,
this.onTap,
#required this.item,
this.selected: false})
: super(key: key);
final Choice choice;
final VoidCallback onTap;
final Choice item;
final bool selected;
#override
Widget build(BuildContext context) {
TextStyle textStyle = Theme.of(context).textTheme.display1;
if (selected)
textStyle = textStyle.copyWith(color: Colors.lightGreenAccent[400]);
return InkWell(
onTap: () {
onTap();
},
child: Card(
color: Colors.white,
child: Row(
children: <Widget>[
new Container(
padding: const EdgeInsets.all(8.0),
alignment: Alignment.topLeft,
child: Icon(
choice.icon,
size: 80.0,
color: textStyle.color,
)),
new Expanded(
child: new Container(
padding: const EdgeInsets.all(10.0),
alignment: Alignment.topLeft,
child: Text(
choice.title,
style: null,
textAlign: TextAlign.left,
maxLines: 5,
),
)),
],
crossAxisAlignment: CrossAxisAlignment.start,
)),
);
}
}
class Detail extends StatelessWidget {
final Choice choice;
Detail({this.choice});
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Second Route"),
),
body: Column(
children: <Widget>[
Text("${choice.title}"),
Center(
child: RaisedButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('Go back!'),
),
),
],
),
);
}
}

import 'package:easy_buss/screen/client.dart';
import 'package:easy_buss/screen/invoice.dart';
import 'package:easy_buss/screen/invoice_settings.dart';
import 'package:easy_buss/screen/payment_info.dart';
import 'package:easy_buss/widgets/payment_info_form.dart';
import 'package:flutter/material.dart';
class Settings extends StatefulWidget {
#override
_SettingsState createState() => _SettingsState();
}
class _SettingsState extends State<Settings> {
List<IconData> _icon = [
Icons.accessible,
Icons.analytics,
Icons.question_answer_sharp,
Icons.message,
Icons.share,
Icons.star_half,
Icons.add_business,
Icons.privacy_tip,
];
List<String> _title = [
'Invoice Settings',
'Reports',
'Frequently Ask Questions',
'Write Us',
'Share With A Friends',
'Rate Us',
'Terms & Conditions',
'Privacy Policy',
];
List<Color> _colors = [
Colors.cyan,
Colors.yellow,
Colors.red,
Colors.purple,
Colors.orange,
Colors.grey,
Colors.pink[300],
Colors.green[200],
];
List _items = [
InvoiceSettings(),
InvoiceSettings(),
InvoiceSettings(),
InvoiceSettings(),
InvoiceSettings(),
InvoiceSettings(),
InvoiceSettings(),
InvoiceSettings(),
];
#override
Widget build(BuildContext context) {
return ListView.separated(
itemCount: _title.length,
separatorBuilder: (BuildContext context, int index) => Container(
padding: EdgeInsets.only(
left: 10,
right: 10,
),
child: Divider(
thickness: 1,
),
),
itemBuilder: (BuildContext context, int index) => ListTile(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => _items[index],
),
);
},
leading: Container(
padding: const EdgeInsets.all(5.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: _colors[index],
),
child: Icon(
_icon[index],
color: Colors.white,
size: 20,
),
),
title: Text(
_title[index],
style: TextStyle(
fontWeight: FontWeight.bold,
),
),
trailing: Icon(
Icons.chevron_right,
size: 40,
),
),
);
}
}

How to Set Timer Countdown in Flutter for 30 Second with OnPressed FAB Button?

Currently, I have write codes for making up the counter app with two buttons. 1 raised button to reset and one fab button for increment counter.
is it possible to add the countdown timer to implement on FAB button? When FAB button clicks 20-second countdown timer start.
Also, I have found below thread for the same type of function implement. But I don't where to put codes in my app to implement countdown work on FAB button.
How to make a countdown in flutter?
import 'package:flutter/material.dart';
import 'dart:ui';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Counter App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Counter App'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
int _counter = 0;
AnimationController controller;
bool _isButtonDisabled;
Duration get duration => controller.duration * controller.value;
bool get expired => duration.inSeconds == 0;
#override
void initState() {
controller = AnimationController(
vsync: this,
duration: Duration(seconds: 20),
);
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'number $_counter added',
),
AnimatedBuilder(
animation: controller,
builder: (BuildContext context, Widget child) {
return new Text(
'${duration.inSeconds}',
style: new TextStyle(
fontWeight: FontWeight.bold,
fontSize: 50.0,
),
);
}),
new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new RaisedButton(
padding: const EdgeInsets.all(15.0),
textColor: Colors.white,
color: Colors.redAccent,
onPressed: () {
setState(() {
controller.reset();
_counter = 0;
});
},
child: new Text("Reset"),
),
new RaisedButton(
onPressed: () => setState(() {
controller.reverse(from: 1);
}),
textColor: Colors.white,
color: Colors.purple,
padding: const EdgeInsets.all(15.0),
child: new Text(
"Start",
),
),
],
),
],
),
),
bottomNavigationBar: BottomAppBar(
child: Container(
height: 50.0,
),
),
floatingActionButton: FloatingActionButton(
onPressed: () => setState(() {
_counter++;
}),
tooltip: 'Increment Counter',
child: Icon(Icons.add),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
}
}

you can use anywhere this code.
Timer(Duration(seconds: 30), () {
//checkFirstSeen(); your logic
});

try the following:
import 'package:flutter/material.dart';
import 'dart:ui';
import 'dart:async';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Counter App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Counter App'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
int _counter = 0;
AnimationController controller;
Duration get duration => controller.duration * controller.value;
bool get expired => duration.inSeconds == 0;
#override
void initState() {
controller = AnimationController(
vsync: this,
duration: Duration(seconds: 20),
);
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
AnimatedBuilder(
animation: controller,
builder: (BuildContext context, Widget child) {
return new Text(
'${duration.inSeconds}',
style: new TextStyle(
fontWeight: FontWeight.bold,
fontSize: 50.0,
),
);
}),
new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new RaisedButton(
padding: const EdgeInsets.all(15.0),
textColor: Colors.white,
color: Colors.redAccent,
onPressed: () {
setState(() {
controller.reset();
});
},
child: new Text("Reset"),
),
],
),
],
),
),
bottomNavigationBar: BottomAppBar(
child: Container(
height: 50.0,
),
),
floatingActionButton: FloatingActionButton(
onPressed: () => setState(() {
controller.reverse(from: 1);
}),
tooltip: 'Increment Counter',
child: Icon(Icons.add),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
}
}

Categories

Resources