Could you please help me to align one element in column to extreme right.
Please help me
CodePudding user response:
Wrap that icon with Align
and set alignment to centerRight
, like this:
IntrinsicHeight(
child: Row(
children: [
Expanded(
child: Column(
children: [
Align(
alignment: Alignment.centerRight,
child: Icon(
Icons.info,
size: 20,
),
),
Icon(Icons.lock_clock),
Text('item 1'),
],
),
),
VerticalDivider(
color: Colors.black,
),
Expanded(
child: Column(
children: [
Align(
alignment: Alignment.centerRight,
child: Icon(
Icons.info,
size: 20,
),
),
Icon(Icons.lock_clock),
Text('item 1'),
],
),
),
VerticalDivider(
color: Colors.black,
),
Expanded(
child: Column(
children: [
Align(
alignment: Alignment.centerRight,
child: Icon(
Icons.info,
size: 20,
),
),
Icon(Icons.lock_clock),
Text('item 1'),
],
),
),
],
),
)
Or If you want that icon attach to top right of column in overlay, you can wrap the column wit stack widget and set that icon in it, like this:
IntrinsicHeight(
child: Row(
children: [
Expanded(
child: Stack(
alignment: Alignment.center,
children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: Column(
children: [
Icon(Icons.lock_clock),
Text('item 1'),
],
),
),
Positioned(
child: Icon(
Icons.info,
size: 20,
),
top: 0,
right: 0,
)
],
),
),
VerticalDivider(
color: Colors.black,
),
Expanded(
child: Stack(
alignment: Alignment.center,
children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: Column(
children: [
Icon(Icons.lock_clock),
Text('item 1'),
],
),
),
Positioned(
child: Icon(
Icons.info,
size: 20,
),
top: 0,
right: 0,
)
],
),
),
VerticalDivider(
color: Colors.black,
),
Expanded(
child: Stack(
alignment: Alignment.center,
children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: Column(
children: [
Icon(Icons.lock_clock),
Text('item 1'),
],
),
),
Positioned(
child: Icon(
Icons.info,
size: 20,
),
top: 0,
right: 0,
)
],
),
)
],
),
)
This make icon closer to column.
CodePudding user response:
Please place your current code and explain briefly what you want to do like putting an example of what you want to do so we can understand easily and help you!
anyway you play around mainAxisAlignment as well as CrossAxisAlignment to get what you want!
When I understand what exactly you want to do I will help you to do it.
CodePudding user response:
Use
Expanded(child: SizedBox());
Before the wudget that you want to move in the most right