Блог

У меня есть следующий код, но я не могу понять, как выровнять имя пользователя слева (рядом с изображением) и текст класса справа от строки. Выравнивание главной оси.расстояние между ними не помогает. Я попробовал несколько различных выравниваний по всем строкам и столбцам, но ничего не работает. единственный способ, которым я мог бы получить пространство между двумя текстами, — это добавить отступ в один из текстов, но это не то, что нужно, потому что имена пользователей имеют разные размеры, и текст класса не будет выровнен справа.

 Container(  width: 180,  decoration: BoxDecoration(  color: const Color(0xffe8d9c3),  border: Border.all(color: Colors.transparent),  borderRadius: const BorderRadius.all(  Radius.circular(4),  ),  boxShadow: const [  BoxShadow(  color: Colors.black,  blurRadius: 2.0,  spreadRadius: 0.0,  offset: Offset(0, 1),  ),  ],  ),  child: Row(  //mainAxisAlignment: MainAxisAlignment.spaceEvenly,  children: [  const CircleAvatar(  backgroundImage: NetworkImage(  'https://www.woolha.com/media/2020/03/eevee.png',  ),  ),  const SizedBox(  width: 5,  ),  Column(  //mainAxisAlignment: MainAxisAlignment.spaceBetween,  //crossAxisAlignment: CrossAxisAlignment.start,  children: [  Row(  mainAxisAlignment: MainAxisAlignment.spaceBetween,  crossAxisAlignment: CrossAxisAlignment.start,  children: [  StreamBuilderlt;DocumentSnapshotgt;(  stream: userdoc.snapshots(),  builder: (BuildContext context,  AsyncSnapshotlt;DocumentSnapshotgt; snapshot) {  return Text(  "${snapshot.data?["username"]}",  style: const TextStyle(  fontSize: 10,  color: Colors.black,  ),  );  },  ),  const Text(  "Class 8",  style: TextStyle(  fontSize: 10,  color: Colors.black,  ),  ),  ],  ),  Stack(  clipBehavior: Clip.none,  children: const [  SizedBox(  width: 120,  height: 15,  child: LinearProgressIndicator(  value: 0.3,  backgroundColor: Color(0xff816840),  color: Color(0xffffc518),  ),  ),  Positioned(  right: 10,  top: 2,  child: Text(  "2918",  style: TextStyle(  fontSize: 10,  color: Colors.white,  ),  ),  ),  ],  ),  ],  ),  ],  ), )  

 import 'package:flutter/material.dart';  void main() {  runApp(const MaterialApp(  home: MyApp(),  )); }  class MyApp extends StatelessWidget {  const MyApp({Key? key}) : super(key: key);   @override  Widget build(BuildContext context) {  return SafeArea(  child: Scaffold(  body: Center(  child: Container(  width: 180,  padding: EdgeInsets.all(5),  decoration: BoxDecoration(  color: const Color(0xffe8d9c3),  border: Border.all(color: Colors.transparent),  borderRadius: const BorderRadius.all(  Radius.circular(4),  ),  boxShadow: const [  BoxShadow(  color: Colors.black,  blurRadius: 2.0,  spreadRadius: 0.0,  offset: Offset(0, 1),  ),  ],  ),  child: Row(  // crossAxisAlignment: CrossAxisAlignment.center,  //mainAxisAlignment: MainAxisAlignment.spaceEvenly,  children: [  const CircleAvatar(  backgroundImage: NetworkImage(  'https://www.woolha.com/media/2020/03/eevee.png',  ),  ),  const SizedBox(  width: 5,  ),  Expanded(  child: Column(  mainAxisSize: MainAxisSize.min,  crossAxisAlignment: CrossAxisAlignment.center,  children: [  Row(  children: const [  Text(  "username",  style: TextStyle(  fontSize: 10,  color: Colors.black,  ),  ),  Spacer(),  Text(  "Class 8",  style: TextStyle(  fontSize: 10,  color: Colors.black,  ),  ),  ],  ),  Stack(  clipBehavior: Clip.none,  children: const [  SizedBox(  height: 15,  child: LinearProgressIndicator(  value: 0.5,  backgroundColor: Color(0xff816840),  color: Color(0xffffc518),  ),  ),  Positioned(  right: 10,  top: 2,  child: Text(  "2918",  style: TextStyle(  fontSize: 10,  color: Colors.white,  ),  ),  ),  ],  ),  ],  ),  ),  ],  ),  ),  )),  );  } }  

вы можете использовать Spacer() виджет между ними