I have been learning to make an app in flutter for 2 weeks using flutter documentation. Today, I have come to this problem regarding Navigator.push(). This was working fine, but it is not after I restart my laptop. And I can't find a solution, I tried
flutter clean
reinstalled flutter and dart plugins
These solutions didn't help.
Code:
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_foodybite/screens/trending.dart';
import 'package:flutter_foodybite/util/categories.dart';
import 'package:flutter_foodybite/util/friends.dart';
import 'package:flutter_foodybite/util/restaurants.dart';
import 'package:flutter_foodybite/widgets/category_item.dart';
import 'package:flutter_foodybite/widgets/search_card.dart';
import 'package:flutter_foodybite/widgets/slide_item.dart';
class Home extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: buildSearchBar(context),
body: Padding(
padding: EdgeInsets.fromLTRB(10.0, 0, 10.0, 0),
child: ListView(
children: <Widget>[
SizedBox(height: 20.0),
buildCategoryRow('Trending Restaurants', context),
SizedBox(height: 10.0),
buildRestaurantList(context),
SizedBox(height: 10.0),
buildCategoryRow('Category', context),
SizedBox(height: 10.0),
buildCategoryList(context),
SizedBox(height: 20.0),
buildCategoryRow('Friends', context),
SizedBox(height: 10.0),
buildFriendsList(),
SizedBox(height: 30.0),
],
),
),
);
}
buildCategoryRow(String category, BuildContext context) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"$category",
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.w800,
),
),
FlatButton(
child: Text(
"Trending",
style: TextStyle(
color: Theme.of(context).accentColor,
),
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (BuildContext context) {
return Trending();
},
),
);
},
),
],
);
}
buildSearchBar(BuildContext context) {
return PreferredSize(
child: Padding(
padding: EdgeInsets.only(
top: Platform.isAndroid ? 30.0 : 50.0,
left: 10.0,
right: 10.0,
),
child: SearchCard(),
),
preferredSize: Size(
MediaQuery.of(context).size.width,
60.0,
),
);
}
buildCategoryList(BuildContext context) {
return Container(
height: MediaQuery.of(context).size.height / 6,
child: ListView.builder(
primary: false,
scrollDirection: Axis.horizontal,
shrinkWrap: true,
itemCount: categories == null ? 0 : categories.length,
itemBuilder: (BuildContext context, int index) {
Map cat = categories[index];
return CategoryItem(
cat: cat,
);
},
),
);
}
buildRestaurantList(BuildContext context) {
return Container(
height: MediaQuery.of(context).size.height / 2.4,
width: MediaQuery.of(context).size.width,
child: ListView.builder(
primary: false,
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemCount: restaurants == null ? 0 : restaurants.length,
itemBuilder: (BuildContext context, int index) {
Map restaurant = restaurants[index];
return Padding(
padding: EdgeInsets.only(right: 10.0),
child: SlideItem(
img: restaurant["img"],
title: restaurant["title"],
address: restaurant["address"],
rating: restaurant["rating"],
),
);
},
),
);
}
buildFriendsList() {
return Container(
height: 50.0,
child: ListView.builder(
primary: false,
scrollDirection: Axis.horizontal,
shrinkWrap: true,
itemCount: friends == null ? 0 : friends.length,
itemBuilder: (BuildContext context, int index) {
String img = friends[index];
return Padding(
padding: EdgeInsets.only(right: 5.0),
child: CircleAvatar(
backgroundImage: AssetImage(
img,
),
radius: 25.0,
),
);
},
),
);
}
}
Please have a look at the attached picture below for the highlighted error.
Here is error encountered
This is an error
Try this
flutter upgrade --force
You should use like this
Navigator.of(context)
.push(
MaterialPageRoute(
builder: (BuildContext context) => Trending(),
),
);
Related
I want to get all the input field values from the listTilewidget on the button click how can I do this?
I have provided the image as well which is here...
we can easily do this with this javascript but is there any way to achieve this type of functionality?
I looked for the solution to this problem on the internet but did not find any solution for that problem.
FutureBuilder(
future: SupervisorAttendanceServices.getAttendancesDetailsList(
widget.attendanceId),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.hasData) {
var data = snapshot.data['hamal'];
return ListView.builder(
itemCount: data.length,
physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return Card(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(children: [
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: [
const SizedBox(
width: 10,
height: 50,
),
const Icon(FeatherIcons.user),
const SizedBox(
width: 20,
),
Text(
data[index]['worker_name'],
style: const TextStyle(fontSize: 18),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment.start,
children: [
SizedBox(
width: 150,
height: 50,
child: TextFormField(
cursorHeight: 25,
controller: _mainWagesController,
// onChanged: _onChangeHandler,
// initialValue: _mainWagesController.text,
decoration: const InputDecoration(
border: OutlineInputBorder(),
hintText: "Wages",
prefixIcon: Icon(
Icons.wallet,
color: Colors.blue,
)),
)),
],
)
]),
),
);
});
} else if (snapshot.hasError) {
return const Center(
child: Text("Something went wrong !"),
);
} else {
return const Center(child: LinearProgressIndicator());
}
},
),
Hello so the problem i am having is the following code
return Scaffold(
body: Padding(
padding: EdgeInsets.all(20),
child: Row(
children: [
const SizedBox(width: 15),
Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(widget.routine.title!, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
SizedBox(height: 6),
Text(widget.routine.description!),
const Divider(
height: 10,
thickness: 2,
indent: 20,
endIndent: 0,
color: Colors.white,
),
FutureBuilder<List<RoutineTask>>(
future: _getRoutineTasks(widget.routine.id!),
builder: (BuildContext context, AsyncSnapshot<List<RoutineTask>> snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if(snapshot.data == null) {
return Center(
child: Text("No Tasks!"),
);
} else if (snapshot.hasError) {
return Center(
child: Text("An Error has Occured: ${snapshot.error}"),
);
} else {
return ListView.separated(
reverse: false,
itemCount: snapshot.data!.length,
scrollDirection: Axis.vertical,
shrinkWrap: true,
separatorBuilder: (BuildContext context, index) => const Divider(),
itemBuilder: (BuildContext context, index) {
return Container(
height: MediaQuery.of(context).size.height * 0.45,
decoration: BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.circular(25)
),
child: CheckboxListTile(
value: snapshot.data![index].isComplete,
onChanged: (bool? value) {
setState(() {
snapshot.data![index].isComplete = value;
});
},
),
);
},
);
}
} else {
return Center(child: CircularProgressIndicator(),);
}
}
)
],
),
],
)),
);
is Returning the error
'package:flutter/src/rendering/viewport.dart': Failed assertion: line 1869 pos 16: 'constraints.hasBoundedWidth': is not true.
and i have no idea how to fix it, been trying every possible combination i can come up with.
Edited: This works. Try to follow this tree structure.
return Scaffold(
body: Row(
children:[
Text('ROWWWWWWWWWWW'),
Expanded(
child: Column(
children:[
Text('COLUMN'),
Expanded(
child: ListView(
children:[
Text('LISTVIEW'),
],
),
),
]
),
)
],
),
);
I Had Question For how create Scroll List Like this
Flutter Scroll List Over Header
According to the answers given, I used DraggableScrollableSheet for implementing this scroll view
but now i have new problem
The Result is here:
now I need to when im scrolling the top Child Stay On Top, like a header
how can do this?
Here is my Code
class HomeScreen extends StatelessWidget {
const HomeScreen({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
double height = MediaQuery.of(context).size.height;
AppController appController = Provider.of<AppController>(context);
HomeController homeController = Provider.of<HomeController>(context);
String selectedCategory = homeController.selectedCategory;
return SafeArea(
child: Container(
//height: 450,
width: double.infinity,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/home_header.png'),
alignment: Alignment.topCenter,
)),
child: Scaffold(
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
flexibleSpace: Padding(
padding: const EdgeInsets.only(left: 20, right: 20),
child: ChiscoAppbar(
icon: MENU,
iconAlignment: Alignment.centerLeft,
title: 'خانه',
onClick: () {
Navigator.pushNamed(context, '/account');
},
),
),
),
backgroundColor: Colors.transparent,
body: Stack(
children: [
Positioned(
child: Container(
color: Colors.transparent,
height: 200,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Expanded(
flex: 3,
child: Align(
alignment: Alignment.center,
child: ChiscoText(
text: 'دستگاههای هوشمند چیسکو',
fontWeight: FontWeight.w500,
textColor: Colors.white,
fontSize: 16,
)),
),
Expanded(
flex: 1,
child: Padding(
padding: EdgeInsets.only(left: 20, right: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: const [
HeaderItem(
titleText: 'کنترلر',
icon: COOLER,
counterText: '2',
),
HeaderItem(
titleText: 'سه راهی',
icon: SOCKET,
counterText: '2',
)
],
),
)),
],
),
),
),
Positioned(
child: DraggableScrollableSheet(
expand: true,
minChildSize: 0.70,
maxChildSize: 0.95,
initialChildSize: 0.70,
builder: (context, scrollController) {
return SingleChildScrollView(
controller: scrollController,
child: Container(
decoration: BoxDecoration(
color: Colors.blue[100],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(25),
topRight: Radius.circular(25))),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ListHandlerView(),
Container(
margin: const EdgeInsets.fromLTRB(20, 8, 20, 10),
height: 30,
child: ListView.builder(
shrinkWrap: true,
physics: const BouncingScrollPhysics(),
itemCount: appController
.listOfDevicesCategory.length,
scrollDirection: Axis.horizontal,
primary: true,
addSemanticIndexes: false,
itemBuilder: (context, index) {
String category = appController
.listOfDevicesCategory[index];
return CategoryListItem(
isSelected: selectedCategory == category,
category: category,
);
}),
),
ListView.builder(
physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemCount: 25,
itemBuilder: (BuildContext context, int index) {
return ListTile(title: Text('Item $index'));
},
),
],
),
),
);
},
),
)
],
),
floatingActionButton: Container(
margin: const EdgeInsets.only(bottom: 16),
child: const ChiscoSpeedDial()),
floatingActionButtonLocation:
FloatingActionButtonLocation.startDocked,
),
),
);
}
}
I think it is better to use bottom from SliverAppBar. Run below widget to see the result
class DAX extends StatefulWidget {
DAX({Key? key}) : super(key: key);
#override
State<DAX> createState() => _DAXState();
}
class _DAXState extends State<DAX> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: CustomScrollView(
slivers: [
SliverAppBar(
expandedHeight: 200,
pinned: true,
backgroundColor: Colors.blue,
elevation: 0,
bottom: PreferredSize(
preferredSize: Size.fromHeight(60),
child: ColoredBox(
color: Colors.blue,
child: Container(
clipBehavior: Clip.hardEdge,
padding: EdgeInsets.all(8),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(12),
topRight: Radius.circular(12),
),
color: Colors.white,
),
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: List.generate(
12,
(index) => Chip(
label: Text("chip $index"),
),
),
),
),
),
)),
),
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => Container(
alignment: Alignment.center,
height: 100,
child: Text("$index"),
),
),
),
],
),
),
);
}
}
I have an application:
The listTile items here come from the database.
Codes:
Container(
child: Padding(
padding: EdgeInsets.only(left: 8, right: 8, bottom: 40),
child: Column(
children: [
SizedBox(height: 15,),
Text("Profile", style: TextStyle(fontSize: 27),),
Divider(thickness: 1, color: Colors.black,),
SizedBox(height: 5),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("Solved Tests:",style: TextStyle(fontSize: 19)),
],
),
SizedBox(height: 20,),
Container(
width: double.infinity,
height: 200,
child: Expanded(
child: FutureBuilder(
future: listUpload(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
late List<String?> items;
if (snapshot.connectionState == ConnectionState.waiting) {
items = [];
} else if (snapshot.connectionState == ConnectionState.done &&
snapshot.hasData) {
items = snapshot.data as List<String?>;
} else {
items = [];
}
return Scrollbar(
isAlwaysShown: true,
controller: _scrollContreller,
scrollbarOrientation: ScrollbarOrientation.right,
child: ListView.builder(
controller: _scrollContreller,
itemCount: items.length,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.only(bottom: 20, left: 10, right: 10),
child: Container(
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: BorderRadius.circular(10),
),
child: ListTile(
title: Text(
items[index].toString(),
style: TextStyle(fontSize: 20),
),
),
),
);
},
),
);
})),
),
Calling items from database:
dynamic listUpload() async {
final prefences = await SharedPreferences.getInstance();
final getTests = prefences.getStringList("tests"); // get item
debugPrint(getTests.toString());
return Future.value(getTests);
}
If there is no data in the database, I want the listTile to say "not found" in its footprint.
For example, I want to make the system in the picture above. You already understand the system, if there is no data from the database, listTile will say not found in its place.
The listTile in my app looks like this when there is no data:
How can I do that? Thanks in advance for the help.
I think you can just have a check for empty data.
if (!snapshot.hasData){
return myEmptyWidget
}
please try:
items.isEmpty ? const SizedBox() : View(),
Code:
Container(
child: Padding(
padding: EdgeInsets.only(left: 8, right: 8, bottom: 40),
child: Column(
children: [
SizedBox(height: 15,),
Text("Profile", style: TextStyle(fontSize: 27),),
Divider(thickness: 1, color: Colors.black,),
SizedBox(height: 5),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("Solved Tests:",style: TextStyle(fontSize: 19)),
],
),
SizedBox(height: 20,),
Container(
width: double.infinity,
height: 200,
child: Expanded(
child: FutureBuilder(
future: listUpload(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
late List<String?> items;
if (snapshot.connectionState == ConnectionState.waiting) {
items = [];
} else if (snapshot.connectionState == ConnectionState.done &&
snapshot.hasData) {
items = snapshot.data as List<String?>;
} else {
items = [];
}
return Scrollbar(
isAlwaysShown: true,
controller: _scrollContreller,
scrollbarOrientation: ScrollbarOrientation.right,
child: items.isEmpty ? const SizedBox() : ListView.builder(
controller: _scrollContreller,
itemCount: items.length,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.only(bottom: 20, left: 10, right: 10),
child: Container(
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: BorderRadius.circular(10),
),
child: ListTile(
title: Text(
items[index].toString(),
style: TextStyle(fontSize: 20),
),
),
),
);
},
),
);
})),
),
You're facing this issue because you're not fully using the power of the FutureBuilder !
It'll "emit" states during Load and Success/Error. Whenever a state is emitted, it'll redraw the widget.
Therefore, you can return a Widget matching every state of your FutureBuilder like this
...
child: FutureBuilder(
future: listUpload(),
builder:
(BuildContext context, AsyncSnapshot snapshot) {
late List<String?> items;
if (snapshot.connectionState ==
ConnectionState.waiting) {
return YourLoaderWidget();
} else if (snapshot.connectionState ==
ConnectionState.done &&
snapshot.hasData) {
items = snapshot.data as List<String?>;
if (items.isEmpty) {
return YourEmptyWidget();
} else {
return YourScrollBar();
}
} else {
return YourErrorWidget();
}
...
I have tried :
ListView.builder(
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return GridView.count(
crossAxisCount: 5,
children: List.generate(10, (index) {
return Center(
child: Text(
'$index AM',
),
);
}),
);
},
itemCount: partnerArr.length,
)
I want to make this type of list view in my Scaffold body, how can I do so?
You can try this Code:
#override
Widget build(BuildContext context) {
return Scaffold(
body: ListView.separated(
separatorBuilder: (context, int) {
return Divider(color: Colors.black,);
},
// shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return GridView.count(
shrinkWrap: true,
crossAxisCount: 3,
childAspectRatio: 2.0,
children: List.generate(6, (index) {
return Center(
child: RaisedButton(
onPressed: (){},
color: Colors.greenAccent,
child: Text(
'$index AM',
),
),
);
}),
);
},
itemCount: 4,
));
}
Output:
use CustomScrollView
CustomScrollView(
slivers: List.generate(
10,
(item) => SliverGrid(
gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
maxCrossAxisExtent: 150.0,
mainAxisSpacing: 10.0,
crossAxisSpacing: 10.0,
childAspectRatio: 4.0,
),
delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
return Container(
alignment: Alignment.center,
color: Colors.amber[100 * (index % 9)],
child: Text('grid item $index'),
);
},
childCount: 6,
),
)),
)
import 'package:flutter/material.dart';
class SubmitRequest extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return _SubmitRequest();
}
}
class _SubmitRequest extends State<SubmitRequest> {
#override
Widget build(BuildContext context) {
return new Scaffold(
drawer: Drawer(
child: Container(
color: Colors.black54,
child: ListView(
padding: EdgeInsets.only(top: 40.0),
children: <Widget>[
ListTile(
title: Text('Dashboard'),
),
ListTile(
title: Text('Submit Reports'),
),
ListTile(
title: Text('Inbox Requests'),
),
],
),
),
),
appBar: AppBar(
backgroundColor: Colors.blue,
leading: IconButton(icon: Icon(Icons.menu), onPressed: () {}),
actions: <Widget>[
// IconButton(icon: Icon(Icons.search), onPressed: () {}),
IconButton(icon: Icon(Icons.help), onPressed: () {}),
],
bottom: PreferredSize(
child: Padding(
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 15.0, 16.0),
child: Container(
margin: EdgeInsets.only(left: 16.0),
child: TextField(
decoration: new InputDecoration(
suffixIcon: IconButton(
icon: Icon(Icons.search),
onPressed: () {
debugPrint('222');
}),
border: new OutlineInputBorder(
borderRadius: const BorderRadius.all(
const Radius.circular(50.0),
),
),
filled: true,
hintStyle: new TextStyle(color: Colors.grey[800]),
hintText: "Search",
fillColor: Colors.white),
),
),
),
preferredSize: Size(0.0, 80.0),
),
),
body: Scaffold(
body: ListView.builder(
// separatorBuilder: (context, int) {
// return Divider(color: Colors.black,);
// },
// shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return GridView.count(
shrinkWrap: true,
crossAxisCount: 4,
childAspectRatio: 1.0,
children: List.generate(6, (index) {
return GridTile(
child: new Card(
color: Colors.blue.shade100,
child: new Center(
child: new Text('Exterior $index'),
),
),
);
}),
);
},
itemCount: 4,
)
)
);
}
}