How to refresh Alert Dialog without closing it in Flutter - flutter

I am having an issue while changing the value in the alert dialog box in flutter. I want to change value of it without closing alert box

you can use like this
dialoge(BuildContext context) {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
scrollable: true,
contentPadding: EdgeInsets.all(5),
title: Center(
child: Text(
'Product Detail',
style: TextStyle(
color: yellowColor,
),
)),
content: shownecklace(selectedpp: selectedpp),
);
});
}
Make alert dialogue uge box within a stateful widget
class shownecklace extends StatefulWidget {
int selectedpp;
shownecklace({Key? key, required this.selectedpp}) : super(key: key);
#override
_shownecklaceState createState() => _shownecklaceState();
}
class _shownecklaceState extends State<shownecklace> {
#override
Widget build(BuildContext context) {
return Container(
width: 675,
height: 475,
child: Column(
children: [
Padding(
padding: const EdgeInsets.only(top: 5.0),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: blackColor,
),
height: 460,
child: PageView.builder(
itemCount: ProductDetailsModel.productDetailsList.length,
controller: PageController(initialPage: widget.selectedpp, keepPage: true, viewportFraction: 1),
itemBuilder: (BuildContext context, int index) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
SizedBox(height: 10),
Container(
height: 370,
width: double.infinity,
child: PinchZoom(
resetDuration: const Duration(milliseconds: 4000),
maxScale: 2.9,
onZoomStart: () {
print('Start zooming');
},
onZoomEnd: () {
print('Stop zooming');
},
child: Image.network(ProductDetailsModel.productDetailsList[index].itemImg.toString(),
fit: BoxFit.cover, height: 270, width: double.infinity)),
),
SizedBox(
height: 10,
),
Padding(
padding: const EdgeInsets.only(left: 10.0, right: 12),
child: Container(
width: 250,
child: Column(
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Product Name :",
style: TextStyle(
fontSize: 14,
color: yellowColor,
),
),
Text(
ProductDetailsModel.productDetailsList[index].itemName.toString(),
style: TextStyle(fontSize: 14, color: yellowColor),
)
],
),
SizedBox(
height: 10,
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Tag No :",
style: TextStyle(
fontSize: 14,
color: yellowColor,
),
),
Text(
ProductDetailsModel.productDetailsList[index].tagNo.toString(),
style: TextStyle(
fontSize: 14,
color: yellowColor,
),
)
],
),
SizedBox(
height: 10,
),
],
),
),
),
],
);
},
),
),
),
SizedBox(
height: 10,
),
],
),
);
}
}

Related

data not rendered in the first time

currently i'm trying to implement getx to my app, so far so good, i got the data i wanted but i'm kinda having some trouble when i tried to display the data to the screen.
This is where data supposed to be rendered as a horizontal listview
Home Screen
But apparently the data will only appear if i click the promo section and click back to the home section on bottom navigation.
Home Screen 2
Here is my home_controller.dart
class HomeController extends GetxController {
RxList<Hotels> listHotel = <Hotels>[].obs;
RxList<Province> listProvince = <Province>[].obs;
Future getListHotel() async {
final listHotel = await ApiService.getHotel();
this.listHotel.value = listHotel;
}
Future getListProvince() async {
final listProvince = await ApiService.getProvince();
this.listProvince.value = listProvince;
}
#override
void onInit() {
super.onInit();
getListHotel();
getListProvince();
}
}
and this is my home_screen.dart
Widget build(BuildContext context) {
final homeController = Get.put(HomeController());
final authController = Get.put(AuthController());
final orientation = MediaQuery.of(context).orientation;
return Scaffold(
body: SingleChildScrollView(
child: Builder(builder: (context) {
return Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
SafeArea(
child: Padding(
padding: EdgeInsets.only(
left: 5.w, right: 5.w, top: 100.h <= 667 ? 5.h : 4.h),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Daftar Hotel",
style: TextStyle(
color: const Color(0xffF0B900),
fontSize: 10.sp,
fontWeight: FontWeight.bold),
),
SizedBox(
height: 31.h,
width: orientation == Orientation.landscape
? 100.h
: 100.w,
child: ListView.separated(
shrinkWrap: true,
separatorBuilder: (BuildContext context, int index) {
return SizedBox(
width: 1.h,
);
},
scrollDirection: Axis.horizontal,
itemCount: homeController.listHotel.length,
itemBuilder: (context, i) {
return InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => HotelDetailScreen(
id: homeController
.listHotel[i].id,
checkin: checkInController.text
.toString(),
checkout: checkOutController.text
.toString(),
)));
},
child: SizedBox(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: 70.w,
height: 20.h,
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Image.network(
homeController.listHotel[i].cover,
fit: BoxFit.cover,
),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 8.0),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
homeController.listHotel[i].name,
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 10.sp),
),
SizedBox(
width: 70.w,
child: Text(
homeController.listHotel[i].address,
maxLines: 2,
style: TextStyle(
fontWeight: FontWeight.w300,
fontSize: 10.sp),
overflow: TextOverflow.clip,
),
)
],
),
),
],
)),
);
},
),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Text(
"Rekomendasi",
style: TextStyle(
color: const Color(0xffF0B900),
fontSize: 10.sp,
fontWeight: FontWeight.bold),
),
),
SizedBox(
height: 25.h,
width: orientation == Orientation.landscape
? 100.h
: 100.w,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: homeController.listProvince.length,
itemBuilder: (context, i) {
String imageUrl = "http://$CURRENT_URL/image/" +
homeController.listProvince[i].cover;
return InkWell(
onTap: () async {
await launch("https://turu.id/property");
},
child: Padding(
padding: const EdgeInsets.only(right: 8.0),
child: SizedBox(
width: 30.w,
child: Stack(
children: [
SizedBox(
width: 30.w,
height: 25.h,
child: ClipRRect(
borderRadius:
BorderRadius.circular(12),
child: Image.network(
imageUrl,
fit: BoxFit.cover,
),
),
),
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(12),
color:
Colors.black.withOpacity(0.2),
),
),
Padding(
padding: EdgeInsets.only(
left: 2.h, bottom: 2.h),
child: Column(
mainAxisAlignment:
MainAxisAlignment.end,
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
homeController
.listProvince[i].name,
style: TextStyle(
color: Colors.white,
fontSize: 10.sp,
fontWeight:
FontWeight.bold),
),
],
),
)
],
),
),
),
);
}),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Text(
"Promo Mantap",
style: TextStyle(
color: const Color(0xffF0B900),
fontSize: 10.sp,
fontWeight: FontWeight.bold),
),
),
],
),
),
),
],
);
}),
),
);
}
also my index.dart (botnav)
class Index extends StatefulWidget {
const Index({Key? key}) : super(key: key);
#override
_IndexState createState() => _IndexState();
}
class _IndexState extends State<Index> {
int _currentIndex = 0;
final List<Widget> _container = [
const HomeScreen(),
const PromoScreen(),
const BookingStatusScreen(),
];
#override
Widget build(BuildContext context) {
return Scaffold(
body: _container[_currentIndex],
bottomNavigationBar: BottomNavigationBar(
selectedItemColor: const Color(0xffF0B900),
unselectedItemColor: const Color(0xffAFAFAF),
currentIndex: _currentIndex,
onTap: (index) {
setState(() {
_currentIndex = index;
});
},
items: const [
BottomNavigationBarItem(
icon: Icon(
Icons.home,
),
label: "Beranda",
),
BottomNavigationBarItem(
icon: Icon(
Icons.price_change_outlined,
),
label: "Promo",
),
BottomNavigationBarItem(
icon: Icon(
Icons.receipt_long_rounded,
),
label: "Transaksi",
),
])
);
}
}
Any help will be appreciated, Thank you.

How can bind items details from the listview in flutter?

I need help on how to achive binding items from the list view into other widget. For example, I have a listview of Products to be sold, when a sale person click any product from the list, it should be added on top of the screen with it price, then more product can be added each time a sale person press new product from the listview. I have already tried different ways to achieve this. This is a sample of the screen I want to achieve.
This is what I have achieved so far
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class NewSale extends StatefulWidget {
const NewSale({Key? key}) : super(key: key);
#override
_NewSaleState createState() => _NewSaleState();
}
class _NewSaleState extends State<NewSale> {
TextEditingController searchingInput = TextEditingController();
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
iconTheme: IconThemeData(color: Colors.green),
backgroundColor: Colors.white,
elevation: 0.0,
title: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.only(top: 8.0),
child: Text(
"Sales",
style: TextStyle(color: Color(0xff444444), fontSize: 19),
),
),
Text(
"Manage Sales",
style: TextStyle(color: Color(0xffa1a1a1), fontSize: 13),
),
],
),
actions: [
Builder(
builder: (context) => IconButton(
icon: Image.asset("assets/images/icons/sync_products.png"),
onPressed: () => {},
)),
],
leading: Builder(
builder: (BuildContext context) {
return IconButton(
icon: const Icon(
Icons.arrow_back,
color: Colors.black,
size: 40, // Changing Drawer Icon Size
),
onPressed: () {
Navigator.pop(context);
},
);
},
),
),
bottomNavigationBar: new Container(
height: 70.0,
padding: EdgeInsets.only(top: 10),
color: Colors.white,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Flexible(
child: Container(
width: MediaQuery.of(context).size.width * 0.4,
child: Column(
children: [
MaterialButton(
elevation: 0.00,
shape: RoundedRectangleBorder(
side: BorderSide(
color: Color(0xffFA7659),
width: 1,
style: BorderStyle.solid),
borderRadius: BorderRadius.circular(3)),
textColor: Colors.white,
color: Color(0xffFA7659),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.all(14.0),
child: Text('CLEAR',
style: TextStyle(
fontSize: 16,
color: Colors.white,
fontWeight: FontWeight.w300)),
),
],
),
],
),
onPressed: () {
Navigator.pop(context);
},
),
],
),
),
),
Flexible(
child: Container(
width: MediaQuery.of(context).size.width * 0.4,
child: Column(
children: [
MaterialButton(
elevation: 0.00,
shape: RoundedRectangleBorder(
side: BorderSide(
color: Color(0xff78BD42),
width: 1,
style: BorderStyle.solid),
borderRadius: BorderRadius.circular(3)),
textColor: Colors.white,
color: Color(0xff78BD42),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.all(14.0),
child: Text(
'CONFIRM',
style: TextStyle(
fontSize: 16,
color: Colors.white,
fontWeight: FontWeight.w300),
),
),
],
),
],
),
onPressed: () {},
),
],
),
),
),
],
),
),
body: SafeArea(
child: Container(
color: Colors.red,
height: MediaQuery.of(context).size.height * 1,
width: MediaQuery.of(context).size.width * 1,
child: Column(
children: [
Flexible(
child: Container(
height: MediaQuery.of(context).size.height * .5,
width: MediaQuery.of(context).size.width * 1,
color: Colors.grey,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'==== Product Cart ====',
style: TextStyle(color: Color(0xff5c5c5c)),
textAlign: TextAlign.center,
),
),
),
),
Flexible(
child: Container(
height: MediaQuery.of(context).size.height * .5,
width: MediaQuery.of(context).size.width * 1,
color: Colors.white,
child: Column(
children: [
Row(
children: [
Column(
children: [
Container(
padding: EdgeInsets.fromLTRB(15, 10, 0, 0),
child: MaterialButton(
elevation: 0.00,
shape: RoundedRectangleBorder(
side: BorderSide(
color: Color(0xff828282),
width: 1,
style: BorderStyle.solid),
borderRadius: BorderRadius.circular(3)),
textColor: Colors.white,
color: Color(0xff828282),
child: Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Column(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
Row(
children: [
Image.asset(
'assets/images/icons/scan.png',
width: 20,
height: 20,
),
Padding(
padding:
const EdgeInsets.all(14.0),
child: Text('SCAN',
style: TextStyle(
fontSize: 16,
color: Colors.white,
fontWeight:
FontWeight.w300)),
),
],
),
],
),
],
),
onPressed: () {},
),
),
],
),
Flexible(
child: Column(
children: [productSearchingField()],
),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Flexible(
child: Container(
width: MediaQuery.of(context).size.width * 0.6,
padding: EdgeInsets.fromLTRB(15, 7, 15, 0),
child: Column(
children: [
MaterialButton(
elevation: 0.00,
shape: RoundedRectangleBorder(
side: BorderSide(
color: Color(0xff78BD42),
width: 1,
style: BorderStyle.solid),
borderRadius: BorderRadius.circular(3)),
textColor: Colors.white,
color: Color(0xff78BD42),
child: Row(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Column(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
Row(
children: [
Column(
children: [Icon(Icons.add)],
),
Column(
children: [
Padding(
padding:
const EdgeInsets.only(
top: 14.0,
bottom: 14.0),
child: Text(
'ADD NEW PRODUCT',
style: TextStyle(
fontSize: 14,
color: Colors.white,
fontWeight:
FontWeight
.w300),
),
),
],
),
],
),
],
),
],
),
onPressed: () {},
),
],
),
),
),
],
),
Flexible(
child: Container(
child: ListView.builder(
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
return ListTile(
leading: Image.asset(
'assets/images/icons/brand-identity.png',
width: 50,
height: 50,
),
trailing: Text(
"100,000",
style: TextStyle(
color: Colors.green, fontSize: 15),
),
title: Text("This is item $index"),
subtitle: Text('Electronics'),
);
}),
),
),
],
),
),
),
],
),
),
),
);
}
productSearchingField() {
return Container(
padding: EdgeInsets.fromLTRB(15, 10, 15, 0),
height: 60,
child: TextFormField(
controller: searchingInput,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Search Product or Barcode',
prefixIcon: Padding(
padding: const EdgeInsets.all(8.0),
child: Icon(
Icons.search,
color: Colors.black54,
)),
),
),
);
}
}
Here i manage to do this using the below code hope it will work for you
class _DummyDesignState extends State<DummyDesign> {
List<String> ShoppingItems = ['Ball', 'Clet', 'JoyStick'];
List<String> PurchasedItem = [];
#override
Widget build(BuildContext context) {
print('List length is ${ShoppingItems.length}');
print('List length is ${PurchasedItem.length}');
return Scaffold(
appBar: AppBar(
title: Text('Hello'),
),
body: PurchasedItem.isEmpty
? Center(
child: Container(
height: MediaQuery.of(context).size.height * 0.2,
child: ListView.builder(
itemCount: ShoppingItems.length,
itemBuilder: (context, index) {
return ListTile(
onTap: (){
PurchasedItem.add(ShoppingItems[index]);
setState(() {
});
},
leading: Icon(Icons.list),
title: Text(
ShoppingItems[index],
style: TextStyle(color: Colors.green, fontSize: 15),
));
}),
),
)
: Center(
child: SingleChildScrollView(
child: Column(
children: <Widget>[
SizedBox(
height: MediaQuery.of(context).size.height * 0.4,
child: ListView.builder(
itemCount: PurchasedItem.length,
itemBuilder: (context, index) {
return Text(PurchasedItem[index]);
}),
),
Container(
height: MediaQuery.of(context).size.height * 0.4,
child: ListView.builder(
itemCount: ShoppingItems.length,
itemBuilder: (context, index) {
return ListTile(
onTap: (){
PurchasedItem.add(ShoppingItems[index]);
setState(() {
});
},
leading: Icon(Icons.list),
title: Text(
ShoppingItems[index],
style: TextStyle(color: Colors.green, fontSize: 15),
));
}),
),
],
),
),
));
}
}

SetState Not updating value of parameter Flutter ?? I want to Toggle between grid but setstate only showing the grid view. ?? How can i update state o

when I click on IconButton photo_size_select it's not updating the text form _setPostToggle(String toggletype). it's only showing grid view text when I clicked on both icon button? why set state is not working? I/flutter (27517): gridView I/flutter (27517): gridView SetState Not updating value of parameter Flutter? I want to Toggle between grid but setstate only showing the grid view. How can i update state o
class Profile extends StatefulWidget {
final String? profileId;
Profile({required this.profileId});
#override
_ProfileState createState() => _ProfileState();
}
class _ProfileState extends State<Profile> {
final String? currentUserId = currentUser?.id;
String postViewStyle = 'gridView';
bool isLoading = false;
int postCount = 0;
List<Post> posts = [];
#override
void initState() {
super.initState();
getProfilePosts();
}
getProfilePosts() async {
setState(() {
isLoading = true;
});
QuerySnapshot snapshot = await postRef
.doc(widget.profileId)
.collection('userPosts')
.orderBy('timestamp', descending: true)
.get();
setState(() {
isLoading = false;
postCount = snapshot.docs.length;
posts = snapshot.docs
.map((doc) => Post.fromDocument(doc))
.toList(growable: true);
});
print(posts.toList().toString());
}
editProfile() {
Navigator.push(
this.context,
MaterialPageRoute(
builder: (context) => EditProfilePageWidget(
currentUserId: currentUserId,
)),
);
}
//build button on users condtion
buildButton({required String text, required Function function}) {
return Padding(
padding: EdgeInsets.fromLTRB(15, 20, 15, 0),
child: TextButton(
style: ButtonStyle(
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.0),
side: BorderSide(
color: Colors.grey.shade900,
width: 1,
)),
)),
onPressed: () async {
await function();
},
child: Text(
text,
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Lato',
fontSize: 18,
),
),
),
);
}
// Button for Profile header
buildProfileButton() {
// View our own profile and follow button
bool isProfileOwner = currentUserId == widget.profileId;
if (isProfileOwner) {
return buildButton(text: "Edit Profile", function: editProfile);
}
}
buildProfilePost() {
if (isLoading) {
return CircularProgressIndicator();
} else if (postViewStyle == 'gridView') {
List<GridTile> gridTiles = [];
posts.forEach((element) {
gridTiles.add(
GridTile(
child: PostGrid(post: element),
),
);
});
return GridView.count(
padding: EdgeInsets.zero,
crossAxisCount: 3,
childAspectRatio: 1,
crossAxisSpacing: 2.5,
mainAxisSpacing: 2.5,
shrinkWrap: true,
primary: false,
// physics: NeverScrollableScrollPhysics(),
scrollDirection: Axis.vertical,
children: gridTiles,
);
} else if (postViewStyle == "listView") {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: posts,
);
}
}
_setPostToggle(String toggleType) {
setState(() {
toggleType = this.postViewStyle;
});
}
buildToogleView() {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
IconButton(
onPressed: () {
_setPostToggle("gridView");
print(postViewStyle);
},
icon: Icon(
Icons.grid_view_rounded,
size: 25,
),
color: Colors.deepPurple.shade500,
),
IconButton(
onPressed: () {
_setPostToggle("listView");
print(postViewStyle);
},
icon: Icon(
Icons.photo_size_select_actual_outlined,
size: 25,
),
color: Colors.deepPurple.shade500,
)
],
);
}
override
Widget build(BuildContext context) {
return FutureBuilder(
future: usersRef.doc(widget.profileId).get(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return circularProgressBar();
}
Users user = Users.fromDocument(snapshot.data);
return Scaffold(
appBar: header(context, titleText: "Knot me"),
body: SafeArea(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: EdgeInsets.fromLTRB(0, 0, 0, 10),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: EdgeInsets.fromLTRB(8, 8, 0, 0),
child: Icon(
Icons.alternate_email_rounded,
color: Colors.grey.shade600,
size: 17,
),
),
Padding(
padding: EdgeInsets.fromLTRB(1, 8, 0, 0),
child: Text(
user.username,
style: GoogleFonts.aBeeZee(
fontSize: 19.0,
fontWeight: FontWeight.bold,
color: Colors.grey.shade800),
),
),
],
),
],
),
),
Expanded(
child: ListView(
padding: EdgeInsets.zero,
shrinkWrap: true,
scrollDirection: Axis.vertical,
children: <Widget>[
Padding(
padding: EdgeInsets.fromLTRB(0, 10, 0, 0),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Padding(
padding: EdgeInsets.fromLTRB(12, 0, 0, 1),
child: Container(
width: 100,
height: 100,
child: Stack(
children: [
Align(
alignment: Alignment(-0.4, -0.02),
child: Padding(
padding:
EdgeInsets.fromLTRB(1, 0, 0, 0),
child: Container(
width: 100,
height: 96,
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
shape: BoxShape.circle,
),
child: Image(
image: CachedNetworkImageProvider(
user.photoUrl),
),
),
),
),
Align(
alignment: Alignment(1, 1),
child: Container(
width: 27,
height: 27,
decoration: BoxDecoration(
color: Color(0xFF1062AE),
shape: BoxShape.circle,
),
child: Icon(
CupertinoIcons.add_circled,
color: Colors.white,
size: 24,
),
),
)
],
),
),
),
Padding(
padding: EdgeInsets.fromLTRB(0, 0, 15, 0),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.spaceEvenly,
children: [
Column(
mainAxisSize: MainAxisSize.max,
children: [
Text(
"$postCount".toString(),
style: TextStyle(
fontFamily: 'Lato',
fontSize: 18,
color: Colors.black,
fontWeight: FontWeight.bold,
),
),
Padding(
padding:
EdgeInsets.fromLTRB(0, 3, 0, 0),
child: Text(
'Posts',
style: TextStyle(
fontFamily: 'Lato',
fontSize: 17,
),
),
)
],
),
Padding(
padding: EdgeInsets.fromLTRB(20, 0, 20, 0),
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Text(
'179',
style: TextStyle(
fontFamily: 'Lato',
fontSize: 17,
),
),
Padding(
padding:
EdgeInsets.fromLTRB(0, 3, 0, 0),
child: Text(
'Followers',
style: TextStyle(
fontFamily: 'Lato',
fontSize: 17,
// color: Colors.white,
),
),
)
],
),
),
Column(
mainAxisSize: MainAxisSize.max,
children: [
Text(
'144',
style: TextStyle(
fontFamily: 'Lato',
fontSize: 17,
),
),
Padding(
padding:
EdgeInsets.fromLTRB(0, 3, 0, 0),
child: Text(
'Followers',
style: TextStyle(
fontFamily: 'Lato',
fontSize: 17,
),
),
)
],
)
],
),
)
],
),
),
Padding(
padding: EdgeInsets.fromLTRB(0, 16, 0, 0),
child: Row(
mainAxisSize: MainAxisSize.max,
children: [
Container(
width: MediaQuery.of(context).size.width * 0.55,
decoration: BoxDecoration(
color: Colors.transparent,
),
child: Align(
alignment: Alignment(-1, 0),
child: Padding(
padding: EdgeInsets.fromLTRB(20, 0, 0, 0),
child: Column(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
user.displayName,
textAlign: TextAlign.start,
style: TextStyle(
fontFamily: 'Lato',
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
Padding(
padding:
EdgeInsets.fromLTRB(0, 3, 0, 0),
child: Text(
user.bio,
style: TextStyle(
fontFamily: 'Lato',
fontSize: 15,
),
),
)
],
),
),
),
)
],
),
),
buildProfileButton(),
Divider(
height: 0.0,
),
buildToogleView(),
Divider(
height: 0.0,
),
buildProfilePost(),
],
),
)
],
),
),
);
},
);
}
}
Build Page

Flutter: How to control a PageView by GetxController?

Subject: PageView and GetX
I'm having trouble detaching the controls on a PageView widget from the HomeView module. I have a GlobalController with its respective GlobalBinding that are instantiated when opening the HomeView. I would like to take the setPage(int page) method to the GlobalController that would eventually make the HomeView's PageView change pages. I don't know how to get PageController from PageView to GlobalController in order to make it work. How should I proceed?
Something Like this?
am using pageview in onboarding
class Onboard{
final headTitle;
final secondarytitle;
final discription;
final pngimage;
Onboardslist(this.headTitle, this.secondarytitle, this.discription, this.pngimage);
}
then for the controller
class OnboardController extends GetxController{
var selectedPagexNumber = 0.obs;
bool get isLastPage => selectedPagexNumber.value == onBoardPages.length -1;
var pageControll = PageController();
forwardAct()
{
if(isLastPage) Get.offNamedUntil(signin, (route)=> false);
else pageControll.nextPage(duration: 300.milliseconds, curve: Curves.ease);
}
List<Onboardslist> onBoardPages =
[
Onboardslist("title",
"short description",
"long description",
imageString),
Onboardslist("title",
"short description",
"long description",
imageString),
Onboardslist("title",
"short description",
"long description",
imageString),
Onboardslist("title",
"short description",
"long description",
imageString)
];
}
then for the view i did was simply like this
class Onboarding extends StatelessWidget {
final yourController= OnboardController();
#override
Widget build(BuildContext context) {
SizeXGet().init(context);
return Scaffold(
backgroundColor: decent_white,
appBar: AppBarCustom(
title: 'Skip',
button: ()=>Get.offNamedUntil(signin,(route)=>false),
),
body: WillPopScope(
onWillPop: () async => false,
child: SafeArea(
child: Stack(
children: [
PageView.builder(
controller: yourController.pageControll,
onPageChanged: yourController.selectedPagexNumber,
itemCount: yourController.onBoardPages.length,
itemBuilder: (context, index)
=>Padding(
padding: const EdgeInsets.only(left: 10,right: 10),
child: Container(
child: SingleChildScrollView(
physics: BouncingScrollPhysics(),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
height: getHeight(150),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.only(left: 20,right: 20),
child: Text(yourController.onBoardPages[index].headTitle,
style: TextStyle(
color: darkish_color,
fontSize: getHeight(20),
fontFamily: 'Metropolis-SemiBold' ,
fontWeight: FontWeight.bold
),),
),
SizedBox(height: 15,),
Padding(
padding: const EdgeInsets.only(left: 50,right: 50),
child: Text(yourController.onBoardPages[index].secondarytitle,
style: TextStyle(
color: not_sopure_black,
fontSize: getHeight(26),
fontFamily: 'Metropolis-Bold' ,
fontWeight: FontWeight.bold
),
),
),
SizedBox(height: 15,),
Padding(
padding: const EdgeInsets.only(left: 40,right: 40),
child: Text(yourController.onBoardPages[index].discription,
style: TextStyle(
color: not_sopure_black,
fontSize: getHeight(15),
fontFamily: 'Metropolis-Regular' ,
),
),
),
],
),
),
SizedBox(height: 15,),
Image.asset(yourController.onBoardPages[index].pngimage),
],
),
),
),
),
),
],
),
),
),
bottomNavigationBar: BottomAppBar(
color: Colors.transparent,
elevation: 0,
child: Container(
height: 75,
width: MediaQuery.of(context).size.width,
child: Padding(
padding: const EdgeInsets.only(left: 25,right:25,),
child: Container(
width: MediaQuery.of(context).size.width,
child: Stack(
children: [
Align(
alignment: Alignment.centerLeft,
child: Container(
child: Row(
children: List.generate(yourController.onBoardPages.length,
(index)=>Obx(()=>
AnimatedContainer(
duration: Duration(milliseconds: 200),
margin: EdgeInsets.only(right: 5),
height: 10,
width: yourController.selectedPagexNumber.value == index ? 20 : 10,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(60),
color: yourController.selectedPagexNumber.value == index
? darkish_color
: not_sopure_black,),
),
)),
),
),
),
Align(
alignment: Alignment.centerRight,
child: Container(
width: 130,
height: 52,
child: RaisedButton(
elevation: 0,
onPressed: yourController.forwardAct,
splashColor: not_sopure_black,
color: darkish_color,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(100)
),
child: Obx(() =>
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(yourController.isLastPage ? 'Next' : 'Next',
style: TextStyle(
color: Colors.white,
fontFamily: 'Metropolis-Semibold',
fontSize: 16,
),
),
],
),
),
),
),
)
],
),
),
),
),
),
);
}
}

Bug when using Offlinebuilder in Liquidswipe

Hello I am using Offlinebuilder and Liquidswipe but it gives me a strange error someone knows how I can fix? thank you very much!
ERROR:
You should specify either a builder or a child
'package:flutter_offline/src/main.dart':
Failed assertion: line 41 pos 16: '!(builder is WidgetBuilder && child is Widget) && !(builder == null && child == null)'
class Luz extends State<MyApp> {
...
Widget build(BuildContext context) {
pages(bool connected) => [
//pagina1
Container(
...
),
Container(
color: Colors.pinkAccent[400],
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
flex: 5,
child: Align(
child: AnimatedContainer(
alignment: Alignment(0, 0.3),
duration: Duration(milliseconds: 600),
child: AnimatedContainer(
width: 135,
height: 135,
color: Colors.transparent,
duration: Duration(milliseconds: 1250),
curve: Curves.bounceOut,
child: GestureDetector(
onTap: () async {
...
},
child: Container(
decoration: BoxDecoration(
color:Colors.purple[700].withOpacity(0.90),
borderRadius: BorderRadius.circular(40),
boxShadow: [
BoxShadow(
color: Colors.white,
spreadRadius: 4,
blurRadius: 50,
offset: Offset(0, 0),
),
],
),
),
),
),
),
),
),
Expanded(
flex: 5,
child: Stack(
children: <Widget>[
Positioned(
left: 8,
right: 8,
top: 0,
child: Align(
alignment: Alignment(0, -0.3),
child: Container(
width: 250,
height: 250,
child: (
Text(
'Luz desligada',
textAlign: TextAlign.center,
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 28,
color: Colors.white,
),
)
),
),
),
),
],
),
),
Container(
color: Colors.transparent,
child: ClipPath(
clipper: WaveClipperOne(flip: true, reverse: true),
child: Container(
height: 120,
color: Colors.limeAccent[400],
),
),
),
Positioned(
left: 35,
right: 35,
top: connected ? -1000 : 175,
child: GestureDetector(
/*onTap: () async {
Navigator.push(
context,
PageTransition(
type: PageTransitionType.rightToLeftWithFade,
child: MyApp()
)
);
},*/
child: Container(
height: 500,
width: 250,
color: Colors.transparent,
child:Center(
child: Container(
width: 250,
height: 111,
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: BorderRadius.circular(25),
),
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.fromLTRB(27, 32, 27, 0),
child: Text(
'SEM INTERNET',
style: TextStyle(
fontSize: 19,
fontWeight: FontWeight.bold,
),
),
),
Padding(
padding: EdgeInsets.fromLTRB(25, 1, 25, 30),
child: Text(
'RECONNECTCE',
style: TextStyle(
fontSize: 19,
fontWeight: FontWeight.bold,
),
),
),
],
),
),
),
),
),
),
Column(
children: <Widget>[
Text(''),
],
),
],
),
),
];
return Scaffold(
body: OfflineBuilder(
connectivityBuilder: (
BuildContext context,
ConnectivityResult connectivity,
Widget Container,
) {
final bool connected = connectivity != ConnectivityResult.none;
return LiquidSwipe(
pages: pages(connected),
enableLoop: true,
fullTransitionValue: 700,
enableSlideIcon: false,
waveType: WaveType.liquidReveal,
positionSlideIcon: 0.7,
);
},
),
);
}
}
You can copy paste run full code below
Step 1: change Widget Container to Widget child
Step 2: You can use builder of OfflineBuilder and use Stack in connectivityBuilder
code snippet
bool connected;
return MaterialApp(
home: Scaffold(
body: OfflineBuilder(
connectivityBuilder: (
BuildContext context,
ConnectivityResult connectivity,
Widget child,
) {
connected = connectivity != ConnectivityResult.none;
print(connected);
return Stack(
fit: StackFit.expand,
children: [
child,
Positioned(
height: 32.0,
left: 0.0,
right: 0.0,
child: AnimatedContainer(
duration: const Duration(milliseconds: 350),
color: connected ? Color(0xFF00EE44) : Color(0xFFEE4400),
child: AnimatedSwitcher(
duration: const Duration(milliseconds: 350),
child: connected
? Text('ONLINE')
: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('OFFLINE'),
SizedBox(width: 8.0),
SizedBox(
width: 12.0,
height: 12.0,
child: CircularProgressIndicator(
strokeWidth: 2.0,
valueColor:
AlwaysStoppedAnimation<Color>(Colors.white),
),
),
],
),
),
),
),
],
);
},
builder: (BuildContext context) {
return LiquidSwipe(
pages: pages(connected),
fullTransitionValue: 200,
enableSlideIcon: true,
enableLoop: true,
positionSlideIcon: 0.5,
currentUpdateTypeCallback: updateTypeCallback,
waveType: WaveType.liquidReveal,
);
},
)));
working demo
full code
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:liquid_swipe/liquid_swipe.dart';
import 'package:flutter_offline/flutter_offline.dart';
void main() {
runApp(
MyApp(),
);
}
class MyApp extends StatefulWidget {
static final style = TextStyle(
fontSize: 30,
fontFamily: "Billy",
fontWeight: FontWeight.w600,
);
#override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
int page = 0;
UpdateType updateType;
List<Container> pages(bool connected) => [
Container(
color: Colors.pink,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Image.network(
'https://picsum.photos/500?image=14',
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsets.all(20.0),
),
Column(
children: <Widget>[
Text(
"Hi",
style: MyApp.style,
),
Text(
"It's Me",
style: MyApp.style,
),
Text(
"Sahdeep",
style: MyApp.style,
),
],
),
],
),
),
Container(
color: Colors.deepPurpleAccent,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Image.network(
'https://picsum.photos/500?image=13',
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsets.all(20.0),
),
Column(
children: <Widget>[
Text(
"Take a",
style: MyApp.style,
),
Text(
"look at",
style: MyApp.style,
),
Text(
"Liquid Swipe",
style: MyApp.style,
),
],
),
],
),
),
Container(
color: Colors.greenAccent,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Image.network(
'https://picsum.photos/500?image=11',
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsets.all(20.0),
),
Column(
children: <Widget>[
Text(
"Liked?",
style: MyApp.style,
),
Text(
"Fork!",
style: MyApp.style,
),
Text(
"Give Star!",
style: MyApp.style,
),
],
),
],
),
),
Container(
color: Colors.yellowAccent,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Image.network(
'https://picsum.photos/500?image=9',
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsets.all(20.0),
),
Column(
children: <Widget>[
Text(
"Can be",
style: MyApp.style,
),
Text(
"Used for",
style: MyApp.style,
),
Text(
"Onboarding Design",
style: MyApp.style,
),
],
),
],
),
),
Container(
color: Colors.redAccent,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Image.network(
'https://picsum.photos/500?image=10',
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsets.all(20.0),
),
Column(
children: <Widget>[
Text(
"Do",
style: MyApp.style,
),
Text(
"Try it",
style: MyApp.style,
),
Text(
"Thank You",
style: MyApp.style,
),
],
),
],
),
),
];
Widget _buildDot(int index) {
double selectedness = Curves.easeOut.transform(
max(
0.0,
1.0 - ((page ?? 0) - index).abs(),
),
);
double zoom = 1.0 + (2.0 - 1.0) * selectedness;
return Container(
width: 25.0,
child: Center(
child: Material(
color: Colors.white,
type: MaterialType.circle,
child: Container(
width: 8.0 * zoom,
height: 8.0 * zoom,
),
),
),
);
}
bool connected;
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: OfflineBuilder(
connectivityBuilder: (
BuildContext context,
ConnectivityResult connectivity,
Widget child,
) {
connected = connectivity != ConnectivityResult.none;
print(connected);
return Stack(
fit: StackFit.expand,
children: [
child,
Positioned(
height: 32.0,
left: 0.0,
right: 0.0,
child: AnimatedContainer(
duration: const Duration(milliseconds: 350),
color: connected ? Color(0xFF00EE44) : Color(0xFFEE4400),
child: AnimatedSwitcher(
duration: const Duration(milliseconds: 350),
child: connected
? Text('ONLINE')
: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('OFFLINE'),
SizedBox(width: 8.0),
SizedBox(
width: 12.0,
height: 12.0,
child: CircularProgressIndicator(
strokeWidth: 2.0,
valueColor:
AlwaysStoppedAnimation<Color>(Colors.white),
),
),
],
),
),
),
),
],
);
},
builder: (BuildContext context) {
return LiquidSwipe(
pages: pages(connected),
fullTransitionValue: 200,
enableSlideIcon: true,
enableLoop: true,
positionSlideIcon: 0.5,
currentUpdateTypeCallback: updateTypeCallback,
waveType: WaveType.liquidReveal,
);
},
)));
}
updateTypeCallback(UpdateType updateType) {
print(updateType);
}
}