Menu
I've written some code that opens up a new container every time when you press the add button. Each of these containers opens up RPage(check the code if you don't understand).
Code:
import 'package:flutter/material.dart';
import 'dart:io';
void main() => runApp(MainPage());
class MainPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp (
debugShowCheckedModeBanner: false,
home:Scaffold (
backgroundColor: Colors.white,
body: Column (
children: <Widget> [
Container (
height: 100.0
),
Body(),
]
)
)
);
}
}
class Body extends StatefulWidget {
@override
_BodyState createState() => _BodyState();
}
class _BodyState extends State<Body> {
final String open1 = 'open';
int count = 1;
@override
Widget build(BuildContext context) {
return Expanded (
child: Container (
child: NotificationListener<OverscrollIndicatorNotification> (
onNotification: (OverscrollIndicatorNotification overscroll) {
overscroll.disallowGlow();
},
child: PageView.builder(
reverse: true,
pageSnapping: false,
controller: PageController(viewportFraction: 0.85),
itemCount: count,
itemBuilder: (context, i) {
if (i == 0) {
return GestureDetector (
onTap: () {
Navigator.push(
context,
MaterialPageRoute (
builder: (context) => RPage (
open: open1,
)
),
);
count++;
},
child: Hero (
tag: open1,
child: Padding (
padding: EdgeInsets.only(
left: MediaQuery.of(context).size.height * 0.015,
right: MediaQuery.of(context).size.height * 0.015,
top: MediaQuery.of(context).size.width * 0.08,
bottom: MediaQuery.of(context).size.width * 0.15
),
child: Material (
borderRadius: BorderRadius.circular(40.0),
color: Colors.white,
elevation: 8.0,
child: InkWell (
child: Column (
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget> [
Icon (
Icons.add,
size: 30.0,
color: Colors.black,
)
]
),
)
)
)
)
);
}
else {
return RCard(i);
}
}
)
)
)
);
}
}
class RCard extends StatefulWidget {
final int count;
RCard(this.count);
@override
RCardState createState() => RCardState();
}
class RCardState extends State<RCard> {
int count;
String open2;
@override
void initState() {
super.initState();
count = widget.count;
open2 = 'open$count';
}
@override
Widget build(BuildContext context) {
return Hero (
tag: open2,
child: GestureDetector (
onTap: () {
Navigator.push(
context,
MaterialPageRoute (
builder: (context) => RPage (
open: open2,
)
),
);
},
child: Padding (
padding: EdgeInsets.only(
left: MediaQuery.of(context).size.height * 0.015,
right: MediaQuery.of(context).size.height * 0.015,
top: MediaQuery.of(context).size.width * 0.08,
bottom: MediaQuery.of(context).size.width * 0.15
),
child: Material (
borderRadius: BorderRadius.circular(40.0),
color: Colors.white,
elevation: 8.0,
)
)
),
);
}
}
class RPage extends StatelessWidget {
final String open;
RPage({this.open});
@override
Widget build(BuildContext context) {
return GestureDetector (
child: Hero (
tag: open,
child: Material (
child: Container (
color: Colors.white,
child: Center (
child: RBody()
)
)
)
),
onTap: () {
Navigator.pop(context);
},
);
}
}
class Constants {
static const String add = 'Add';
static const List<String> choices = <String>[
add
];
}
class RBody extends StatefulWidget {
@override
RBodyState createState() => RBodyState();
}
class RBodyState extends State<RBody> {
final String open1 = 'open';
static bool platform;
static int count = 1;
@override
Widget build(BuildContext context) {
if (Platform.isIOS) {
platform = true;
}
if (Platform.isAndroid) {
platform = false;
}
return Column (
children: <Widget> [
Container (
height: MediaQuery.of(context).size.height * 0.15,
width: MediaQuery.of(context).size.width * 1.0,
child: Row (
children: <Widget> [
Expanded (
child: Container (
alignment: Alignment(-0.9, 1.0),
child: IconButton (
iconSize: 15.0,
icon: Icon (Icons.arrow_back_ios),
onPressed: () {
Navigator.pop(context);
},
)
),
),
Expanded (
child: Container (
alignment: Alignment(0.9, 1.0),
child: platform ? RotatedBox (
quarterTurns: 1,
child: PopupMenuButton<String> (
onSelected: (_) {
setState(() {
count ++;
});
},
itemBuilder: (BuildContext context) {
return Constants.choices.map(
(String choice) {
return PopupMenuItem<String> (
value: choice,
child: Text(choice)
);
}
).toList();
},
)
) :
PopupMenuButton<String> (
onSelected: (_) {
setState(() {
count ++;
});
},
itemBuilder: (BuildContext context) {
return Constants.choices.map(
(String choice) {
return PopupMenuItem<String> (
value: choice,
child: Text(choice)
);
}
).toList();
},
)
)
)
]
),
),
Title(),
Padding (
padding: EdgeInsets.symmetric(
vertical: platform ? 10.0 : 30.0
),
),
Expanded (
child: Align (
alignment: Alignment.topCenter,
child: Container (
height: MediaQuery.of(context).size.height * 0.34,
width: MediaQuery.of(context).size.height * 1.0,
child: RList()
)
)
)
]
);
}
}
class RList extends StatefulWidget {
@override
RListState createState() => RListState();
}
class RListState extends State<RList> {
@override
Widget build(BuildContext context) {
return NotificationListener<OverscrollIndicatorNotification> (
onNotification: (OverscrollIndicatorNotification overscroll) {
overscroll.disallowGlow();
},
child: ListView.builder(
controller: PageController(viewportFraction: 0.85),
itemCount: RBodyState.count,
itemBuilder: (context, i) {
if (i == 0) {
return Container();
} else {
return Cell(i);
}
}
)
);
}
}
class Title extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container (
color: Colors.white,
height: MediaQuery.of(context).size.height * 0.2,
width: MediaQuery.of(context).size.width * 1.0,
child: Align (
alignment: Alignment.bottomCenter,
child: Material (
color: Colors.white,
child: Text (
'T I T L E',
style: TextStyle (
fontWeight: FontWeight.bold,
fontSize: 20.0,
),
)
)
)
);
}
}
class Cell extends StatefulWidget {
final int count;
Cell(this.count);
@override
CellState createState() => CellState();
}
class CellState extends State<Cell> {
@override
Widget build(BuildContext context) {
return Column (
children: <Widget> [
Material (
color: Colors.white,
child: Text (
'T E X T',
style: TextStyle (
fontSize: 12.0,
fontWeight: FontWeight.bold,
),
)
),
Padding (
padding: EdgeInsets.symmetric(
vertical: MediaQuery.of(context).size.height * 0.025
),
),
]
);
}
}
RPage will create new texts every time you press the popup menu button. But I was expecting that there would be texts added only on that specific page. But, I found out that my code adds texts on every single page. How can I make the text add on only one specific page?
985
Launch Microsoft Word Click anywhere on the Word document. On the menu bar, click the Insert tab. In the Text group, click the Quick Parts button. Then select Field from the drop-down menu.
Well if you are not aware about redux at all in flutter. It'll seem a little too complicated in the starting but if you get to learn redux before looking at this then u'll see that this is way too easy to manage state in redux without making your code complicated at all. but u'll have to make more files to keep your code ordered. I have uploaded the code on github the link to which is given here you can clone that project and try for yourself Redux Card Example
64
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
