Flutter: send data from first screen to second screen - database

I have little problem and I don't know how I can solve this. I am fetching datas from database and when I click on the list it is navigating to new screen. I mean I want to fetch datas which are on first screen to second screen. it is not giving me error but the simulator gives me this and codes below here:
class ServisIhaleEkran extends StatelessWidget {
final url = 'https://escar.com/cek.php';
Future<List<dynamic>> getIhaleData() async {
var response = await http.get(url);
return json.decode(response.body);
}
String _brand(dynamic user) {
return user['marka'];
}
String _model(dynamic user) {
return user['model'];
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: FutureBuilder<List<dynamic>>(
future: getIhaleData(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (context, index) {
return Card(
child: Column(
children: <Widget>[
ListTile(
title: Text(
_brand(
snapshot.data[index],
).toString(),
),
onTap: () => _sendDataToSecondScreen(context),
),
],
),
);
},
);
} else {
return Center(child: Text('Error'));
}
},
),
);
}
void _sendDataToSecondScreen(BuildContext context) {
String brandSend = _brand.toString();
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Details(brand: brandSend),
));
}
}
class Details extends StatelessWidget {
final String brand;
Details({this.brand});
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Center(
child: Text(brand),
));
}
}
The First Screen: ServisIhaleEkran
The Second Screen: Details
I think, the problem is here:
void _sendDataToSecondScreen(BuildContext context) {
String brandSend = _brand.toString();
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Details(brand: brandSend),
));
}
}
probably String brandSend = _brand.toString(); is giving me error but I don't know what is this, please help me, thanks.
and my first screen:

Rasat change your code as below:
void _sendDataToSecondScreen(BuildContext context, String brandSend) {
//String brandSend = _brand.toString();
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Details(brand: brandSend),
));
}
And use it in your widget as:
ListTile(
title: Text(
_brand(
snapshot.data[index],
).toString(),
),
onTap: () => _sendDataToSecondScreen(context, _brand(snapshot.data[index])),
),

Related

How would I show my posts from my firestore?

Okay so my profile posts are working as intended right here, I am showing the users posts that only they have made to their very own profile
Now here is the code doing that
static Future<List<Post>> getUserPosts(String currentUserId) async {
QuerySnapshot userPostsSnap = await postsRef
.doc(currentUserId)
.collection('userPosts')
.orderBy('timestamp', descending: true)
.get();
List<Post> userPosts =
userPostsSnap.docs.map((doc) => Post.fromDoc(doc)).toList();
return userPosts;
}
and also to show them to the profile page as you see in the image:
showProfilePosts(UserModel author) {
return Expanded(
child: ListView.builder(
shrinkWrap: true,
physics: AlwaysScrollableScrollPhysics(),
itemCount: _allPosts.length,
itemBuilder: (context, index) {
return PostContainer(
post: _allPosts[index],
author: author,
currentUserId: widget.currentUserId,
);
}),
);
}
getAllPosts() async {
List<Post> userPosts =
await DatabaseMethods.getUserPosts(widget.visitedUserId);
if (mounted) {
setState(() {
_allPosts = userPosts;
});
}
}
#override
void initState() {
super.initState();
getAllPosts();
}
now my goal is to show every single post made by every user (I'm creating one big forum) so how can I show every single post made by everyone in the database to my home screen? My database also looks like this for some visuals, would I have to loop through?
here is my Home screen's code, where I wish to display every users posts
class HomeScreen extends StatefulWidget {
final String currentUserId;
const HomeScreen({Key? key, required this.currentUserId}) : super(key: key);
#override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
List _homeScreenPosts = [];
bool _loading = false;
buildHomeScreenPosts(Post post, UserModel author) {
return PostContainer(
post: post,
author: author,
currentUserId: widget.currentUserId,
);
}
showHomeScreenPosts(String currentUserId) {
List<Widget> homePostsList = [];
for (Post post in _homeScreenPosts) {
homePostsList.add(
FutureBuilder(
future: usersRef.doc(post.authorId).get(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.hasData) {
UserModel author = UserModel.fromSnap(snapshot.data);
return buildHomeScreenPosts(post, author);
} else {
return SizedBox.shrink();
}
},
),
);
}
return homePostsList;
}
setupHomeScreenPosts() async {
setState(() {
_loading = true;
});
List homeScreenPosts =
await DatabaseMethods.getHomeScreenPosts(widget.currentUserId);
if (mounted) {
setState(() {
_homeScreenPosts = homeScreenPosts;
_loading = false;
});
}
}
#override
void initState() {
super.initState();
setupHomeScreenPosts();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
actions: [
IconButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SearchScreen(
currentUserId: widget.currentUserId,
),
),
);
},
icon: Icon(Icons.search),
),
],
automaticallyImplyLeading: false,
title: Text('Home'),
centerTitle: true,
),
body: RefreshIndicator(
onRefresh: () => setupHomeScreenPosts(),
child: ListView(
physics: BouncingScrollPhysics(
parent: AlwaysScrollableScrollPhysics(),
),
children: [
_loading ? LinearProgressIndicator() : SizedBox.shrink(),
SizedBox(height: 5),
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
SizedBox(height: 5),
Column(
children: _homeScreenPosts.isEmpty && _loading == false
? [
SizedBox(height: 5),
Padding(
padding: EdgeInsets.symmetric(horizontal: 25),
child: Text(
'There is No New posts',
style: TextStyle(
fontSize: 20,
),
),
),
]
: showHomeScreenPosts(widget.currentUserId),
),
],
)
],
),
),
);
}
}
Firebase does not have the a concept of "tables" the way relational/sql databases do. I.e. there is not a built-in method to access all documents labelled as a "post".
Because of this, you'll need to access each post through each of the user documents.
Assuming you have a List of all of your user Id's called allUserIds, then you can do something like the following:
List<Post> allPostsForAllUsers = [];
allUserIds.forEach((id) {
allPostsForAllUsers.addAll(await getUserPosts(id));
}
Okay so I figured it out myself, all I had to do was call the collectionGroup 'userPosts' like so
static Future<List<Post>> getHomeScreenPosts(String currentUserId) async {
QuerySnapshot homePostsSnap = await FirebaseFirestore.instance
.collectionGroup('userPosts')
.orderBy('timestamp', descending: true)
.get();
List<Post> homeScreenPosts =
homePostsSnap.docs.map((doc) => Post.fromDoc(doc)).toList();
return homeScreenPosts;
}

I am unable to read and return data from Firebase database

I am unable to connect my flutter app to Firestore database. This is just a simple app to test the connection but I get "no data" returned each time.
Here is my code, I done everything in Firestore and within Flutter with regards to adding a collection and document, adding the Json file to the app folder in flutter and added all plugins/dependencies to configure Flutter to work with Firebase.
import 'package:firebase_core/firebase_core.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(const FirestoreApp());
}
class FirestoreApp extends StatefulWidget {
const FirestoreApp({Key? key}) : super(key: key);
#override
_FirestoreAppState createState() => _FirestoreAppState();
}
class _FirestoreAppState extends State<FirestoreApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const TextField(),
),
body: Center(
child: StreamBuilder(
stream: FirebaseFirestore.instance.collection("data").snapshots(),
builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
if(!snapshot.hasData) {
return const Text("no data",
);
} else {
return ListView(
children: snapshot.data!.docs.map((grocery) {
return Center(
child: ListTile(
title: Text(grocery['name']),
),
);
}).toList(),
);
}
}),
),
floatingActionButton:
FloatingActionButton(
child: const Icon(Icons.save),
onPressed: () {},
),
),
);
}
If the configurations for firebase is okay in your flutter with firestore then I could rewrite your code as follows
import 'package:firebase_core/firebase_core.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(const FirestoreApp());
}
class FirestoreApp extends StatefulWidget {
const FirestoreApp({Key? key}) : super(key: key);
#override
_FirestoreAppState createState() => _FirestoreAppState();
}
class _FirestoreAppState extends State<FirestoreApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const TextField(),
),
body: Center(
child: StreamBuilder(
stream: FirebaseFirestore.instance.collection("data").snapshots(),
builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
if(!snapshot.hasData) {
return const Text("no data",
);
} else {
return ListView.builder(
padding: EdgeInsets.all(10.0),
itemBuilder: (context, index) => buildItem(context, snapshot.data.documents[index]),
itemCount: snapshot.data.documents.length,
);
}
}),
),
floatingActionButton:
FloatingActionButton(
child: const Icon(Icons.save),
onPressed: () {},
),
),
);
}
Flutter recommends using ListViewBuilder when displaying list of data with unknown length for performance reasons, Feel free to check flutter documentation for more info.

How to hide a floatingActionButton after insert data flutter?

I use sqflite for flutter database management. In particular, I would like the user to enter the data only once and therefore I would need to hide and disable the button only once the data has been entered. How can I do?
Home Page, where is the button
class Casa extends StatefulWidget {
static const routeName = '/';
#override
_CasaState createState() => _CasaState();
}
class _CasaState extends State<Casa> {
DataRepository _repository;
#override
void initState() {
super.initState();
_repository = SqlRepository();
}
#override
void dispose() async {
await _repository.closeDB();
super.dispose();
}
void getNewItem(BuildContext context) async {
Attivita newItem =
await Navigator.pushNamed<Attivita>(context, AddItemScreen.routeName);
if (newItem != null) {
await _repository.add(newItem);
setState(() {});
}
}
void switchAndUpdate(Attivita item) async {
await _repository.put(item.id, item);
setState(() {});
}
void delete(Attivita item) async {
await _repository.delete(item.id);
setState(() {});
}
#override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
backgroundColor: Colors.lightBlue[900],
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add, color: Colors.lightBlue[900],),
backgroundColor: Colors.white,
onPressed: () {
getNewItem(context);
},
),
body:
FutureBuilder<List<Attivita>>(
future: _repository.getAll(),
builder:
(BuildContext context, AsyncSnapshot<List<Attivita>> snapshot) {
return ListView.builder(
padding: EdgeInsets.all(8),
itemCount: snapshot.data == null ? 0 : snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return Dismissible(
key: UniqueKey(),
background: DecoratedBox(
decoration: BoxDecoration(color: Colors.red),
child: Align(
alignment: Alignment(-0.9, 00),
child: Icon(
Icons.delete,
color: Colors.white,
),
),
),
direction: DismissDirection.startToEnd,
onDismissed: (direction) {
Attivita item = snapshot.data[index];
snapshot.data.removeAt(index);
delete(item);
},
child: Card(
child: ListTile(
title: Text(snapshot.data[index].nome, style: TextStyle(color: Colors.lightBlue[900]),),
onTap: () {
Navigator.pushNamed(context, DettaglioScreen.routeName, arguments: snapshot.data[index]);
},
onLongPress: () {
switchAndUpdate(snapshot.data[index]);
},
),
),
);
},
);
},
)
),
);
}
}
so i have to add some details, because it is written that "it looks like your post is mostly code; please add some more details"
To check if user put so data you can use:
Use sharedPreferences and store bool value if user entered data.
On initState check if database contains data if yes it means user put some data and you can hide button.
I don't use Sqlite in flutter but I think you can use
List<Map<String, dynamic>> result;
result = await db.query(tableName);
isNotData = result.isEmpty;
Or something similar :) You can do it
Choose one way and store bool value eg. in bool isNotData
When you will have bool value about data you can write:
In _CasaState above initState: bool isNotData;
and in Scaffold in floatingActionButton property:
Scaffold(
appBar: AppBar(
title: Text('Material App Bar'),
),
floatingActionButton: isNotData
? FloatingActionButton(
onPressed: () {},
)
: null,
body: Center(
),
),
),

Flutter can't change route because undefined name context with PopupMenuButton how to solve?

I want to click an item menu (PopupMenuItem) and go to another route using Navigator.push but context is undefined inside the method.
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
final List<Choice> choices = const <Choice>[
const Choice(title: 'Settings', icon: Icons.settings),
const Choice(title: 'Log out', icon: Icons.exit_to_app),
];
#override
Widget build(BuildContext context) {
final title = 'MyTitle';
return MaterialApp(
title: title,
home: Scaffold(
appBar: AppBar(
title: Text(title),
actions: <Widget>[
PopupMenuButton<Choice>(
onSelected: onItemMenuPress,
itemBuilder: (BuildContext context) {
return choices.map((Choice choice) {
return PopupMenuItem<Choice>(
value: choice,
child: Row(
children: <Widget>[
Icon(
choice.icon,
),
Container(
width: 10.0,
),
Text(
choice.title,
),
],
));
}).toList();
},
),
],
),
body: Text("Hello world")
),
);
}
void onItemMenuPress(Choice choice) {
if (choice.title == 'Log out') {
print("Logout");
Navigator.push(context, MaterialPageRoute(builder: (context) => LogoutRoute()));
}
}
}
class Choice {
const Choice({this.title, this.icon});
final String title;
final IconData icon;
}
class LogoutRoute extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Logout"),
),
body: Center(
child: Text("Screen"),
),
);
}
}
I have tried to pass a context in onItemMenuPress in this way:
void onItemMenuPress(Choice choice, BuildContext context)
but:
onSelected: onItemMenuPress(context)
is not working.
Neither this approach works:
onSelected: (Choice c) { Navigator.push(context, MaterialPageRoute(builder: (context) => LogoutRoute())); }
I was following this tutorial:
https://medium.com/flutter-community/building-a-chat-app-with-flutter-and-firebase-from-scratch-9eaa7f41782e
and there is a snippet of his code (similar to mine) that seems to work for him:
https://github.com/duytq94/flutter-chat-demo/blob/master/lib/main.dart
I refer to line 235 (onSelected) and lines 199-205 (actual onItemMenuPress method)
How is it possible? How can I salve?
Thanks
Here you have :
MyApp <------ context
--> MaterialApp
(--> Navigator built within MaterialApp)
--> Scaffold
--> App Bar
--> ...
So when you're using the context to find the Navigator, you're using a context for the MyApp which isn't under the navigator.
so we can either make a new Stateless or Stateful Widget subclass to contain your Scaffold, as the build function within those will point at that level instead, or we can use a Builder and define the builder callback (which has a context pointing at the Builder) to return the Scaffold.
Working Code we created new subclass - HomeScreen :
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
final title = 'MyTitle';
return MaterialApp(
title: title,
home: HomeScreen(title),
);
}
}
class HomeScreen extends StatelessWidget {
final String title;
HomeScreen(this.title);
final List<Choice> choices = const <Choice>[
const Choice(title: 'Settings', icon: Icons.settings),
const Choice(title: 'Log out', icon: Icons.exit_to_app),
];
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(title),
actions: <Widget>[
PopupMenuButton<Choice>(
onSelected: (val) => onItemMenuPress(val, context),
itemBuilder: (BuildContext context) {
return choices.map((Choice choice) {
return PopupMenuItem<Choice>(
value: choice,
child: Row(
children: <Widget>[
Icon(
choice.icon,
),
Container(
width: 10.0,
),
Text(
choice.title,
),
],
));
}).toList();
},
),
],
),
body: Text("Hello world"));
}
void onItemMenuPress(Choice choice, BuildContext context) {
if (choice.title == 'Log out') {
print("Logout");
Navigator.push(
context, MaterialPageRoute(builder: (context) => LogoutRoute()));
}
}
}
class Choice {
const Choice({this.title, this.icon});
final String title;
final IconData icon;
}
class LogoutRoute extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Logout"),
),
body: Center(
child: Text("Screen"),
),
);
}
}
It happens because your flutter SDK and dark SDK is not working properly. you can solve this issues upgrading your flutter sdk. go to the terminal and type
flutter upgrade --force
after that your fluter sdk and dark sdk will be upgrade, after the installation complete you will be fine.

Flutter Checkbox not working in AlertDialog [duplicate]

I'm trying to create a Radio in a showDialog, however the animation that occurs on Radio does not appear in showDialog.
For example: when tapped in foo2 nothing happens, and when you exit in showDialog and go back to it, foo2 is selected.
Below is the code and a gif showing what is happening:
import "package:flutter/material.dart";
void main() {
runApp(new ControlleApp());
}
class ControlleApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
title: "My App",
home: new HomePage(),
);
}
}
class HomePage extends StatefulWidget {
#override
HomePageState createState() => new HomePageState();
}
enum _RadioGroup {
foo1,
foo2
}
class HomePageState extends State<HomePage> {
_RadioGroup _itemType = _RadioGroup.foo1;
void changeItemType(_RadioGroup type) {
setState(() {
_itemType = type;
});
}
void showDemoDialog<T>({ BuildContext context, Widget child }) {
showDialog<T>(
context: context,
child: child,
);
}
#override
Widget build(BuildContext context){
return new Scaffold(
appBar: new AppBar(backgroundColor: new Color(0xFF26C6DA)),
body: new Container(
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new InkWell(
onTap: (){
showDemoDialog<String>(
context: context,
child: new SimpleDialog(
title: const Text("show"),
children: <Widget>[
new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Radio<_RadioGroup>(
groupValue: _itemType,
value: _RadioGroup.foo1,
onChanged: changeItemType
),
const Text("foo1"),
new Radio<_RadioGroup>(
groupValue: _itemType,
value: _RadioGroup.foo2,
onChanged: changeItemType
),
const Text("foo2"),
],
)
],
)
);
},
child: new Container(
margin: new EdgeInsets.only(top: 16.0, bottom: 8.0),
child: new Text("Show"),
),
)
],
),
)
);
}
}
Remember that components are immutable.
When you call showDialog, the content of that dialog won't change even if HomePage does.
The solution is easy. You need to refactor a bit your code to something like :
showDialog(
context: context,
builder: (context) => MyForm()
)
and instead of changing the state of HomePage, you instead change the state of MyForm.
example :
class Test extends StatelessWidget {
void onSubmit(String result) {
print(result);
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: RaisedButton(
onPressed: () => showDialog(context: context, builder: (context) => MyForm(onSubmit: onSubmit)),
child: Text("dialog"),
),
),
);
}
}
typedef void MyFormCallback(String result);
class MyForm extends StatefulWidget {
final MyFormCallback onSubmit;
MyForm({this.onSubmit});
#override
_MyFormState createState() => _MyFormState();
}
class _MyFormState extends State<MyForm> {
String value = "foo";
#override
Widget build(BuildContext context) {
return SimpleDialog(
title: Text("My form"),
children: <Widget>[
Radio(
groupValue: value,
onChanged: (value) => setState(() => this.value = value),
value: "foo",
),
Radio(
groupValue: value,
onChanged: (value) => setState(() => this.value = value),
value: "bar",
),
FlatButton(
onPressed: () {
Navigator.pop(context);
widget.onSubmit(value);
},
child: new Text("submit"),
)
],
);
}
}

Resources