How to make alignment in row if I give space in between spaces occupies between widgets, but I need to get two text at the left and another one in the right. How to do it?
Row(
// mainAxisAlignment:
// MainAxisAlignment.spaceBetween,
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text(snapshot.data![index].comments.toString(),
style: TextStyle(
fontSize: 14.0, fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
),
Align(
alignment: Alignment.topRight,
child: Text(snapshot.data![index].date.toString()),
)
]),
check the image in the description
CodePudding user response：
Try below code hope its help to you. You can used 
CodePudding user response：
you can use Spacer() for this purpose, like this:
Row(
children:[
Text("TEXT 1"),
Text("TEXT 2"),
Spacer(),
Text("TEXT 3"),
]
)
CodePudding user response：
Row(
children: [
Expanded(
child: Align(
alignment: Alignment.topLeft,
child: Row(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text("6",
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
)
],
),
),
),
Expanded(
child: Align(
alignment: Alignment.topRight,
child: Text("Aug 4,2021"),
),
)
])
OR
Row(
// mainAxisAlignment:
// MainAxisAlignment.spaceBetween,
children: [
Wrap(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text("6",
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
)
],
),
Expanded(
child: Align(
alignment: Alignment.topRight,
child: Text("Aug 4,2021"),
),
)
])
OR
Row(
// mainAxisAlignment:
// MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Wrap(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text("6",
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
)
],
),
),
Text("Aug 4,2021")
])
FullCode:
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
// testIt();
runApp(MaterialApp(home: Mainwidget()));
}
class Mainwidget extends StatefulWidget {
const Mainwidget({Key? key}) : super(key: key);
@override
_MainwidgetState createState() => _MainwidgetState();
}
class _MainwidgetState extends State<Mainwidget> {
@override
Widget build(BuildContext context) {
var richText = RichText(
text: TextSpan(
text: '*',
style: TextStyle(
fontSize: 25, color: Colors.red, fontWeight: FontWeight.bold)));
return Scaffold(
body: SafeArea(
child: Container(
padding: EdgeInsets.all(8.0),
height: 100,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0,vertical: 8),
child: Row(
// mainAxisAlignment:
// MainAxisAlignment.spaceBetween,
children: [
Wrap(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text("6",
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
)
],
),
Expanded(
child: Align(
alignment: Alignment.topRight,
child: Text("Aug 4,2021"),
),
)
]),
)
],
),
),
),
);
}
Row buildRow2() {
return Row(
// mainAxisAlignment:
// MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Wrap(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text("6",
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
)
],
),
),
Text("Aug 4,2021")
]);
}
Expanded buildExpanded() {
return Expanded(
child: Align(
alignment: Alignment.topLeft,
child: Row(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text("6",
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
)
],
),
),
);
}
}
CodePudding user response：
Use Expanded widget.
Row(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Expanded(
child: Container(
child: Text(
snapshot.data![index].comments
.toString(),
style: TextStyle(
fontSize: 14.0,
fontWeight:
FontWeight.bold)),
margin: EdgeInsets.only(left: 5.0),
),
),
Align(
alignment: Alignment.topRight,
child: Text(snapshot
.data![index].date
.toString()),
),
],
),
CodePudding user response：
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Row(
children: [
Container(
child: Icon(Icons.comment),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text(
snapshot.data![index].comments.toString(),
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.bold,
),
),
margin: EdgeInsets.only(left: 5.0),
),
],
),
Text(snapshot.data![index].date.toString()),
],
),
I guess this is what you want.
CodePudding user response：
This will help you.. result in pic you can decore your's
Padding(
padding: const EdgeInsets.only(right: 10,left:10),
child: Container(
padding: const EdgeInsets.only(left:20,right:20),
color: Colors.blue,
width: MediaQuery.of(context).size.width,
height: 50,
child: Row(
children:[
Align(
alignment: Alignment.centerLeft,
child: Wrap(
children: const [
Icon(Icons.settings),
Icon(Icons.settings)
]
),
),
const Spacer(),
const Align(
alignment: Alignment.centerRight,
child:Text('00:00'),
),
],
),
),
),
CodePudding user response：