Related
i am trying to update the state of the animated switcher in the middle area. i am trying to do this using a setstate in the lower area. but it does not work.
the first thing i did is to create a variable with a boolean data type in the home class.
then i passed the variable to both the middle area and the lower area
the idea was that if the same variable is passed to the class whose state i am trying to update, and the class with the set state, it would work. but it seems i am wrong. i would appreciate some assistance.
the boolean variable i am trying to make work is the _rep variable
This is the Home widget
class HomePage extends StatefulWidget {
const HomePage({Key? key}) : super(key: key);
#override
State<HomePage> createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
late AnimationController _animationController;
late AnimationController _controller;
late Animation<Offset> _animation;
late Animation<Offset> _anime;
bool _rep = true;
#override
void initState() {
_animationController = AnimationController(
vsync: this,
duration: Duration(seconds: 2)
);
_animation = Tween<Offset>(
begin:Offset (0.0, 0.0),
end: Offset (0.0,3.0),
).animate(CurvedAnimation(
parent: _animationController,
curve: Curves.easeIn));
_anime = Tween<Offset>(
begin:Offset (0.0, 0.0),
end: Offset (0.0,-0.55),
).animate(CurvedAnimation(
parent: _animationController,
curve: Curves.easeIn));
super.initState();
}
#override
void dispose() {
_animationController.dispose();
_controller.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
scrollDirection: Axis.vertical,
physics: const NeverScrollableScrollPhysics(),
child: Padding(
padding: EdgeInsets.only(top: 3.h),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
TopIcon(icons: Icons.arrow_back, color:Colors.grey.shade300 ,),
SizedBox(
height: 13.h,
width: 13.w,
child: Image.asset('assets/images/download.png')
),
TopIcon(icons: Icons.shopping_bag_outlined, color: Colors.grey.shade300,),
],
),
SizedBox(
height: 3.h,
),
Text('Frappuccino',
style: TextStyle(
fontSize: 27.sp,
fontWeight: FontWeight.bold
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text('White Chocolate',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.grey.shade400
),
),
),
MiddleArea(
controller: _animationController,
animation: _animation,
rep: _rep,
),
LowerArea(controller: _animationController, anime: _anime, rep = _rep),
],
),
),
),
);
}
}
This is the middle area
class MiddleArea extends StatefulWidget {
MiddleArea({Key? key, required this.controller, required this.animation, required this.rep}) : super(key: key);
AnimationController controller;
Animation<Offset> animation;
final bool rep;
#override
State<MiddleArea> createState() => _MiddleAreaState();
}
class _MiddleAreaState extends State<MiddleArea> {
bool _flag = true;
bool _favourite = true;
#override
Widget build(BuildContext context) {
print(widget.rep);
return SizedBox(
height: 52.h,
child: Stack(
children: [
Column(
children: [
Padding(
padding: const EdgeInsets.only(top: 135.0),
child: Text('STARBUCKS',
style: TextStyle(
fontFamily: 'Typette',
color: Colors.brown.shade200,
fontSize: 30.sp,
fontWeight: FontWeight.w400
),
),
),
Text('STARBUCKS',
style: TextStyle(
fontFamily: 'Typette',
color: Colors.brown.shade100,
fontSize: 30.sp,
fontWeight: FontWeight.w400
),
),
Text('STARBUCKS',
style: TextStyle(
fontFamily: 'Typette',
color: Colors.brown.shade50,
fontSize: 30.sp,
fontWeight: FontWeight.w400
),
),
],
),
Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: const [
SizeAndFave(text: 'Preference'),
SizeAndFave(text: 'Fave!')
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
onTap: (){
setState(() {
_flag = !_flag;
});
},
child: AnimatedSwitcher(
duration: const Duration(milliseconds: 500),
transitionBuilder: (Widget child, Animation<double> animation){
return FadeTransition(opacity: animation, child: child,);
},
child: widget.rep == true?Padding(
padding: const EdgeInsets.all(14.0),
key: const Key('1'),
child: Container(
height: 40,
width: 40,
decoration: BoxDecoration(
border: Border.all(
color: Colors.brown.shade300,
width: 3
),
borderRadius: BorderRadius.circular(10)
),
child: const Center(
child: Icon(
Icons.coffee_outlined,
size: 20,
),
)
),
):null,
)
),
GestureDetector(
onTap: (){
setState(() {
_favourite = !_favourite;
});
},
child: _favourite? TopIcon(icons: Icons.favorite_border, color: Colors.brown.shade300)
:TopIcon(
icons: Icons.favorite, color: Colors.brown.shade300)
)
],
)
],
),
AnimatedSwitcher(
duration: Duration(seconds: 1),
transitionBuilder: (Widget child, Animation<double> animation) {
return FadeTransition( opacity: animation,
child: child);
},
child: _flag == true ? Center(
key: const Key('1'),
child: SlideTransition(
position: widget.animation,
child: SizedBox(
height: 80.h,
width: 80.w,
child: Image.asset('assets/images/starcup.png'),
),
),
):Center(
key: const Key('2'),
child: SlideTransition(
position: widget.animation,
child: SizedBox(
height: 80.h,
width: 80.w,
child: Image.asset('assets/images/greeen.png'),
),
),
),
),
Positioned(
child:
Align(
alignment: Alignment.bottomRight,
child: Padding(
padding: EdgeInsets.only(top: 30.h),
child: TopIcon(
icons: Icons.car_crash_outlined, color: Colors.brown.shade300),
),
)),
const Positioned(
child:
Align(
alignment: Alignment.bottomLeft,
child: Padding(
padding: EdgeInsets.only(top: 330.0, left: 14),
child: Text('\$ 5.99',
style: TextStyle(
fontSize: 27,
fontWeight: FontWeight.bold
),
),
),
))
],
),
);
}
}
and lastly, the lower area
class LowerArea extends StatefulWidget {
final AnimationController controller;
final Animation<Offset> anime;
bool rep;
LowerArea({Key? key, required this.controller, required this.anime, required this.rep}) : super(key: key);
#override
State<LowerArea> createState() => _LowerAreaState();
}
class _LowerAreaState extends State<LowerArea> {
bool _bigger = true;
bool _fade = true;
void move(){
}
#override
Widget build(BuildContext context) {
return Column(
children: [
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Padding(
padding: EdgeInsets.all(1.h),
child: const Text('Tall Frappuccino',
style: TextStyle(
fontWeight: FontWeight.w500
),
),
),
Padding(
padding: EdgeInsets.only(right: 5.h),
child: const Text('Swipe Down',
style: TextStyle(
fontWeight: FontWeight.w500
),
),
),
Padding(
padding: EdgeInsets.all(2.h),
child: const Text('Pickup',
style: TextStyle(
fontWeight: FontWeight.w500
),
),
)
],
),
),
SlideTransition(
position: widget.anime,
child: AnimatedContainer(
// height: 11.h,
width: _bigger ? 35.h: 80.h,
duration: const Duration(milliseconds: 500),
child: Stack(
fit: StackFit.loose,
children: [
Center(child: Image.asset('assets/images/baggie.png')),
Center(
child: Padding(
padding: EdgeInsets.only(bottom: 4.h),
child: GestureDetector(
onTap: (){
widget.controller.forward();
setState(() {
_bigger = !_bigger;
_fade = !_fade;
widget.rep = !widget.rep;
print('this is fade $_fade ');
});
},
child: AnimatedSwitcher(
duration: Duration(milliseconds: 300),
transitionBuilder: (Widget child, Animation<double> animation){
return FadeTransition(opacity: animation, child: child,);
},
child: _fade? Container(
key: Key('1'),
height: 8.h,
width: 7.w,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(15)
),
child: Column(
children: [
Padding(
padding: EdgeInsets.all(0.3.h),
child: Icon(
Icons.lock_outline,
color: Colors.white54,
size: 2.5.h,
),
),
Icon(
Icons.arrow_drop_down,
color: Colors.white12,
size: 3.h,
),
],
),
):null,
),
),
),
)
],
),
),
)
],
);
}
use provider pacakges https://pub.dev/packages/provider
Create a class that inherits the functions of ChangeNotifyer to create a flag to control and create a setter.
provider class
class StateController extends ChangeNotifier{
bool _req = false;
bool get req => _req; //getter
setReqValue(){
_req = !_req;
notifyListener();
}
}
Declare the provider class in the main function. You can change the location of the declaration according to Wiget tree, but first declare it in main
Change main.dart
void main(){
runApp(
Multiprovider(
providers: [
ChangeNotifierProvider(create: (_) => StateController()),
],
child: HomePage(),
)
);
}
The UI is updated by notifyListener().
change UI
child: context.watch<StateController>().req == true ? Padding(
padding: const EdgeInsets.all(14.0),
key: const Key('1'),
child: Container(
height: 40,
width: 40,
decoration: BoxDecoration(
border: Border.all(
color: Colors.brown.shade300,
width: 3
),
borderRadius: BorderRadius.circular(10)
),
child: const Center(
child: Icon(
Icons.coffee_outlined,
size: 20,
),
)
),
):null,
Change State
onTap: (){
widget.controller.forward();
setState(() {
_bigger = !_bigger;
_fade = !_fade;
context.read<StateController>().setReqValue();
print('this is fade $_fade ');
});
},
I am too lazy to try understand your code. But if you want to update state of the page after you pop from Navigation to it.
In page you want to update
Navigation.push(context, /* Page that will change something */)
// Future will trigger then you return to this page.
.then((_) => setState(() {}))
I am developing an app with flutter and I am getting an error about height.
I have a listview.separated and I have a SingleChildScrollView. I am getting flex error.
This is my file to align widgets inside Scaffold and SafeArea. I have a file for runApp but it is not important for the question.
class ProfilePageC extends StatelessWidget {
const ProfilePageC({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: SingleChildScrollView(
child: Column(
children: [
AboutTopBarW(), // It has not listview
ImageFieldW(), // It has no listview
PercentsW(), //It has no listview
HomeArticleList2W() //It has a listview.separated
],
),
),
),
);
}
}
this is my file for listview.separated widget.
class HomeArticleList2W extends ConsumerWidget {
const HomeArticleList2W({Key? key}) : super(key: key);
#override
Widget build(BuildContext context, WidgetRef ref) {
final futureCatFacts = ref.watch(multiFutureArticleProvider);
return Expanded(
child: futureCatFacts.when(
loading: () => const ShimmerHomeW(),
error: (err, stack) => Text('Error: $err'),
data: (data) {
final decodedData = json.decode(data.body);
return ListView.separated(
separatorBuilder: (BuildContext context, int index) {
if (index % 3 == 0) {
return const Divider();
}
return const Divider();
},
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemCount: decodedData.length ,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.only(
left: 20,
right: 20,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(10),
child: Image.network(
decodedData[index]['largeImage'].toString(),
fit: BoxFit.cover,
height: 70,
width: 70,
)),
const SizedBox(
width: 10,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
decodedData[index]['title'],
style: const TextStyle(
fontSize: 15, fontWeight: FontWeight.bold),
),
const SizedBox(
height: 5,
),
Row(
children: [
const Icon(
Icons.av_timer_sharp,
size: 20,
),
Text(decodedData[index]['date']),
],
),
],
),
),
const SizedBox(
width: 5,
),
const Icon(Icons.bookmark_border),
],
),
);
},
);
},
),
);
}
}
There is no error when I erase HomeArticleList2W() from the SingleChildScrollView. Therefore I thnink the error consist of the listview.separated.
How to solve this problem.
Remove the expanded widget and add mainAxisSize min
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
decodedData[index]['title'],
style: const TextStyle(
fontSize: 15, fontWeight: FontWeight.bold),
),
const SizedBox(
height: 5,
),
Row(
children: [
const Icon(
Icons.av_timer_sharp,
size: 20,
),
Text(decodedData[index]['date']),
],
),
],
),
The space between tab bar view and bottom navigation bar is the extra space that I want to remove.
in the image, you can see the space that shouldn't be there
class Tab_Bar2 extends StatefulWidget {
const Tab_Bar2({Key? key}) : super(key: key);
#override
_Tab_Bar2State createState() => _Tab_Bar2State();
}
class _Tab_Bar2State extends State<Tab_Bar2> with SingleTickerProviderStateMixin {
final bodyGlobalKey = GlobalKey();
final List<Widget> myTabs = [
Text(..),
Text(..),
Text(..),
Text(..),
Text(..),
Text(..),
];
late TabController _tabController;
late ScrollController _scrollController;
#override
void initState() {
_scrollController = ScrollController();
_tabController = TabController(length: 6, vsync: this);
super.initState();
}
#override
void dispose() {
_tabController.dispose();
_scrollController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("Dashboard"),
centerTitle: true,
backgroundColor: const Color(0xffFFC36A),
actions: [
IconButton(
onPressed: () {},
icon: const Icon(Icons.notifications),
),
]),
drawer: Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: [
const DrawerHeader(
decoration: BoxDecoration(
color: Color(0xffFFC36A),
),
child: Padding(
padding: EdgeInsets.only(top: 20.0, left: 60),
child: Text(
'Drawer',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 20),
),
),
),
ListTile(
title: const Text('Log Out'),
onTap: () {
},
),
ListTile(
title: const Text('Item 2'),
onTap: () {
Navigator.pop(context);
},
),
],
),
),
body: NestedScrollView(
controller: _scrollController,
headerSliverBuilder: (BuildContext context, value) {
return [
SliverToBoxAdapter(child: Column(
children: [img1(), grid(), rsp(), LiveChart()],
),),
SliverToBoxAdapter(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.symmetric(horizontal: 15,vertical: 15),
child: Text('Latest',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
fontFamily: 'railway',
color: Theme_Data.font_color,
),
),
),
Container(
margin: EdgeInsets.symmetric(horizontal: 3.5),
padding: EdgeInsets.symmetric(horizontal: 2.5,vertical: 2.5),
height: 35,
decoration: BoxDecoration(
border: Border.all(color: Colors.grey.shade200),
borderRadius: BorderRadius.all(
Radius.circular(25),
),
),
child: TabBar(
controller: _tabController,
labelPadding: EdgeInsets.symmetric(horizontal: 2.0, vertical: 5),
indicator: BoxDecoration(
borderRadius: BorderRadius.circular(50), // Creates border
color: Theme_Data.th_light_color),
tabs: myTabs,
),
),
],
),
),
];
},
body: Container(
padding: EdgeInsets.symmetric(horizontal: 10),
child: Theme(
data: Theme.of(context).copyWith(
dividerColor: Colors.white
),
child: TabBarView(
controller: _tabController,
children: <Widget>[
SalesTable(),
QuotationsTable(),
PurchasesTable(),
TransfersTable(),
ConsumersTable(),
SuppliersTable(),
],
),
),
),
),
);
}
}
in above code i think there might be the issues between the usage of SviverToBoxAdapter what widget should i use instead to achieve the required design
I was trying to make this page but this design in last is not shifting to the last bottom, I've tried padding but this doesn't look good and also I've tried positioned widget but it is showing some error please someone tell how I can shift that design to bottom last
this is my git repo: https://github.com/cryptic-exe/Otp_verfication
this is my code:
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
debugShowCheckedModeBanner: false,
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String dropdownValue = 'English';
#override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Center(
child: Column(
children: [
Icon(
Icons.photo_outlined,
size: 100.0,
),
Padding(
padding: const EdgeInsets.only(top: 40.0),
child: Text(
'Please Select Your Language',
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 20.0),
),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 20),
child: Text(
'You can change the language \n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t at any time',
style: TextStyle(
fontWeight: FontWeight.w300, fontSize: 15.0),
),
),
Padding(
padding: const EdgeInsets.only(top: 9.0),
child: Container(
width: 200,
padding: const EdgeInsets.only(left: 10.0, right: 10.0),
decoration: BoxDecoration(
border: Border.all(),
),
child: DropdownButton<String>(
value: dropdownValue,
icon: const Icon(Icons.arrow_drop_down_outlined),
isExpanded: true,
iconSize: 30,
elevation: 16,
style: const TextStyle(color: Colors.black),
onChanged: (String? newValue) {
setState(() {
dropdownValue = newValue!;
});
},
items: <String>[
'English',
'Hindi',
'French',
'Spanish',
'Russian',
'Arabic'
].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(
value,
style: TextStyle(
fontSize: 20,
letterSpacing: 0.9,
fontWeight: FontWeight.w300),
),
);
}).toList(),
),
),
),
Padding(
padding: const EdgeInsets.all(20.0),
child: Container(
width: 200,
padding: const EdgeInsets.only(left: 10.0, right: 10.0),
decoration: BoxDecoration(
color: Colors.deepPurple,
border: Border.all(),
),
child: TextButton(
onPressed: () {},
child: Text(
'NEXT',
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
fontWeight: FontWeight.w400,
letterSpacing: 0.9),
),
),
),
),
],
),
),
Stack(
children: [
Positioned.fill(
child: Container(
width: 393,
child: Image(
image: AssetImage('Images/design2.png'),
fit: BoxFit.fill,
),
),
),
Positioned(
child: Container(
width: 393,
child: Image(
image: AssetImage('Images/design1.png'),
colorBlendMode: BlendMode.overlay,
fit: BoxFit.fill,
),
),
),
],
),
],
),
);
}
}
you can use bottomSheet to place your image.
Add the below code inside your Scaffold
bottomSheet: Container(
width: double.infinity,
child: Image(
image: AssetImage('Images/design1.png'),
colorBlendMode: BlendMode.overlay,
fit: BoxFit.fill,
),
),
You can also use a spacer to push the content down
https://api.flutter.dev/flutter/widgets/Spacer-class.html
On mobile so I cannot give snippet
I'm new to Flutter and I just start coding the UI of a chat app so I figure out that my widget doesn't take all the space of the bottom navigation bar like the photo shows : shows
This is my camera widget code :
import 'package:flutter/material.dart';
import 'dart:io';
import 'package:image_picker/image_picker.dart';
class Camera extends StatefulWidget {
#override
_CameraState createState() => _CameraState();
}
class _CameraState extends State<Camera> {
File _image;
final imagePicker = ImagePicker();
Future getImage() async {
final image = await imagePicker.getImage(source: ImageSource.camera);
setState(() {
_image = File(image.path);
});
}
#override
Widget build(BuildContext context) {
return SizedBox(
height: 100,
child: Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Container(
width: 80.0,
height: 80.0,
child: FloatingActionButton(
backgroundColor: Colors.white,
onPressed: getImage,
child: Icon(
Icons.camera_alt_rounded,
color: Colors.lightBlue[600],
size: 35.0,
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(20.0))),
),
),
],
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Colors.lightBlue[50],
boxShadow: [
BoxShadow(color: Colors.grey[100], spreadRadius: 3),
],
),
height: 50,
),
);
}
}
and this is the chat screen code :
import 'dart:io';
import 'package:mychat/services/auth.dart';
import 'package:flutter/material.dart';
import 'package:mychat/chat/chat.dart';
import 'package:mychat/widgets/Med_form.dart';
import 'package:mychat/widgets/bottomButtons.dart';
import 'package:mychat/widgets/camera.dart';
import 'package:mychat/widgets/incrementAndDecrement.dart';
import 'package:mychat/widgets/yesOrno.dart';
class ChatScreen extends StatefulWidget {
#override
_ChatScreenState createState() => _ChatScreenState();
}
class _ChatScreenState extends State<ChatScreen> {
File _image;
final AuthService _auth = AuthService();
List<String> messages = [
'fizikefgzerpgr',
'fioezhfejzifojef',
'fvfzerfergnyolnkyokjy',
'rgop^l^lmf^prlgprgprp'
];
List<String> responses = [
'fizikefgzerpgr',
'fezfzefzefezff',
'ofpkoepzkfopkzef',
'fjeziofjiozejfozejf'
];
//final AuthService _auth = AuthService();
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Directionality(
textDirection: TextDirection.rtl,
child: Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(90),
child: AppBar(
title: new Text(
"لاباس ⸮",
style: TextStyle(
color: Colors.black,
fontSize: 30.0,
fontWeight: FontWeight.bold),
),
centerTitle: true,
flexibleSpace: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topRight,
end: Alignment.bottomRight,
colors: [Colors.blueGrey[300], Colors.grey[50]])),
),
actions: <Widget>[
IconButton(
icon: Icon(
Icons.arrow_forward_ios_outlined,
color: Colors.black,
),
onPressed: () async {
await _auth.signOut();
})
],
elevation: 0.0,
),
),
body: Chat_page(messages: messages, responses: responses),
bottomNavigationBar: Camera(),
),
));
}
}
and this is the code of the messages:
import 'package:bubble/bubble.dart';
import 'package:flutter/material.dart';
class Chat_page extends StatefulWidget {
List<String> messages;
List<String> responses;
Chat_page({this.messages, this.responses});
#override
_Chat_pageState createState() => _Chat_pageState();
}
class _Chat_pageState extends State<Chat_page> {
String message;
int data;
#override
Widget build(BuildContext context) {
return Container(
child: Column(
children: [
/* Container(
padding: EdgeInsets.only(top: 15, bottom: 10),
child: Text(
"Today, 10",
style: TextStyle(fontSize: 20, color: Colors.white),
),
), */
Flexible(
child: widget.messages.length > 0
? ListView.builder(
reverse: true,
shrinkWrap: true,
itemCount: widget.messages.length,
itemBuilder: (context, index) => Column(
children: [
widget.messages.length > 0
? chat(widget.messages[index].toString(), 1)
: Container(),
widget.responses.length > 0
? chat(widget.responses[index].toString(), 0)
: Container(),
],
))
: Container(),
),
SizedBox(
height: 20,
),
SizedBox(
height: 15.0,
)
],
));
}
}
Widget chat(String message, int data) {
return Container(
padding: EdgeInsets.only(left: 20, right: 20),
child: Row(
mainAxisAlignment:
data == 1 ? MainAxisAlignment.end : MainAxisAlignment.start,
children: [
data == 0
? Container(
height: 60,
width: 60,
child: CircleAvatar(
child: Icon(Icons.account_circle),
),
)
: Container(),
Padding(
padding: EdgeInsets.all(10.0),
child: Bubble(
radius: Radius.circular(15.0),
color: data == 0 ? Color(0xFFf7ede2) : Color(0xFFf7ede2),
elevation: 0.0,
child: Padding(
padding: EdgeInsets.all(2.0),
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SizedBox(
width: 10.0,
),
Flexible(
child: Container(
constraints: BoxConstraints(maxWidth: 200),
child: Text(
message,
style: TextStyle(
color: Colors.black, fontWeight: FontWeight.bold),
),
))
],
),
)),
),
data == 1
? Container(
height: 60,
width: 60,
child: CircleAvatar(
child: Icon(Icons.account_circle),
),
)
: Container(),
],
),
);
}
so how can I fix this the make my camera widget take the full space
try to change
SizedBox(
height: 100,
child: Container(
to
Container(
height: 100,
width:double.infinty,