How to center row correctly - flutter

Question

Layout
I've got a Row with 'Long Text', divider and 'Text'. How can i align them properly, so the divider would always be at center of the screen (I added a red rectangle to ease positiong of the divider relative to the center). Also, the content of 'Text', so it could occupy more or less space. Here is my code:
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Test',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.black,
body: Column(
children: [
SizedBox(height: 100),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
"Long text",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w700,
fontSize: 14,
),
),
SizedBox(
width: 12,
),
Container(height: 16, width: 1, color: Colors.orange),
SizedBox(
width: 12,
),
Text(
"Text",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w700,
fontSize: 14,
decoration: TextDecoration.underline),
),
],
),
SizedBox(height: 20),
Center(child: Container(color: Colors.red, width: 3, height: 20))
],
),
);
}
}
Thanks in advance.

Answer 1

You can wrap your texts with Expanded and then with Center.
I tried this snippet locally and it works as described:
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Center(
child: Text(
"Long text",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w700,
fontSize: 14,
),
),
),
),
SizedBox(
width: 12,
),
Container(height: 16, width: 1, color: Colors.orange),
SizedBox(
width: 12,
),
Expanded(
child: Center(
child: Text(
"Text",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w700,
fontSize: 14,
decoration: TextDecoration.underline),
),
),
),
],
),