在flutter中的行和列内设置数据

Question

我需要这样设置数据

我尝试先行，然后列，然后再行，但是在行中，我无法在作业ID和011之间设置空格。

Row(
                mainAxisSize: MainAxisSize.max,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  new Container(
                      margin: EdgeInsets.only(right: 10.0),
                      width: 50.0,
                      height: 50.0,
                      decoration: new BoxDecoration(
                          shape: BoxShape.circle,
                          image: new DecorationImage(
                            fit: BoxFit.fill,
                            image: AssetImage('assets/noimage.jpg'),
                          ))),
                  Column(
                    mainAxisSize: MainAxisSize.max,
                    crossAxisAlignment: CrossAxisAlignment.start,
                     mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          Text('Job id',
                              style: TextStyle(
                                  color: Colors.grey.shade700,
                                  fontSize: 16.0,
                                  fontWeight: FontWeight.normal)),
                          Text('011',
                              style: TextStyle(
                                  color: Colors.grey.shade700,
                                  fontSize: 16.0,
                                  fontWeight: FontWeight.normal)),
                        ],
                      ),
],
                  ),
                ],
              ),

在作业ID和数据之间设置空间，但在我的情况下，它将为jobid011。

Answer 1

尝试这样：

   Row( 
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Padding(padding: EdgeInsets.only(left: 10.0),),
        Container(
          margin: EdgeInsets.only(right: 10.0),
          width: 50.0,
          height: 50.0,
          color: Colors.red
         ),
         Expanded(
          child:  Column(
          children: <Widget>[
             Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Text('Job id',
                    style: TextStyle(
                    color: Colors.grey.shade700,
                    fontSize: 16.0,
                    fontWeight: FontWeight.normal)),
                  Text('011',
                    style: TextStyle(
                    color: Colors.grey.shade700,
                    fontSize: 16.0,
                    fontWeight: FontWeight.normal)),
                 ],
                )
              ],
             ),
            ),
            Padding(padding: EdgeInsets.only(right: 10.0),)

           ],
       ),

Answer 2

您可以使用Spacer（）小部件使此工作

    Row(
                mainAxisSize: MainAxisSize.max,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  new Container(
                      margin: EdgeInsets.only(right: 10.0),
                      width: 50.0,
                      height: 50.0,
                      decoration: new BoxDecoration(
                          shape: BoxShape.circle,
                          image: new DecorationImage(
                            fit: BoxFit.fill,
                            image: AssetImage('assets/noimage.jpg'),
                          ))),
                  Column(
                    mainAxisSize: MainAxisSize.max,
                    crossAxisAlignment: CrossAxisAlignment.start,
                     mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      Row(
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: <Widget>[
                          Text('Job id',
                              style: TextStyle(
                                  color: Colors.grey.shade700,
                                  fontSize: 16.0,
                                  fontWeight: FontWeight.normal)),
                           Spacer(),
                          Text('011',
                              style: TextStyle(
                                  color: Colors.grey.shade700,
                                  fontSize: 16.0,
                                  fontWeight: FontWeight.normal)),
                        ],
                      ),
],
                  ),
                ],
              ),

详细了解此here

Answer 3

可以在 LineSegment2D(Point p1, Point p2) RotationMatrix2D(PointF center, double angle, double scale)

crossAxisAlignment: CrossAxisAlignment.start