شرح استخدام ويدجت Row في فلاتر

Row(
  children: <Widget>[
    // Add your widgets here
  ],
)

// MainAxisAlignment.start example
Row(
  mainAxisAlignment: MainAxisAlignment.start,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// MainAxisAlignment.end example
Row(
  mainAxisAlignment: MainAxisAlignment.end,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// MainAxisAlignment.center example
Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// MainAxisAlignment.spaceBetween example
Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// MainAxisAlignment.spaceAround example
Row(
  mainAxisAlignment: MainAxisAlignment.spaceAround,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// CrossAxisAlignment.start example
Row(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// CrossAxisAlignment.end example
Row(
  crossAxisAlignment: CrossAxisAlignment.end,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// CrossAxisAlignment.center example
Row(
  crossAxisAlignment: CrossAxisAlignment.center,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// CrossAxisAlignment.stretch example
Row(
  crossAxisAlignment: CrossAxisAlignment.stretch,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// CrossAxisAlignment.baseline example
Row(
  crossAxisAlignment: CrossAxisAlignment.baseline,
  textBaseline: TextBaseline.alphabetic,
  children: <Widget>[
    Text('First', style: TextStyle(fontSize: 20)),
    Text('Second', style: TextStyle(fontSize: 30)),
    Text('Third', style: TextStyle(fontSize: 40)),
  ],
)

// MainAxisSize.max example
Row(
  mainAxisSize: MainAxisSize.max,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// MainAxisSize.min example
Row(
  mainAxisSize: MainAxisSize.min,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// TextDirection.ltr example
Row(
  textDirection: TextDirection.ltr,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// TextDirection.rtl example
Row(
  textDirection: TextDirection.rtl,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// VerticalDirection.down example
Row(
  verticalDirection: VerticalDirection.down,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// VerticalDirection.up example
Row(
  verticalDirection: VerticalDirection.up,
  children: <Widget>[
    Text('First'),
    Text('Second'),
    Text('Third'),
  ],
)

// crossAxisAlignment and textBaseline example
Row(
  crossAxisAlignment: CrossAxisAlignment.baseline,
  textBaseline: TextBaseline.alphabetic,
  children: <Widget>[
    Text('First', style: TextStyle(fontSize: 20)),
    Text('Second', style: TextStyle(fontSize: 30)),
    Text('Third', style: TextStyle(fontSize: 40)),
  ],
)

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Row Example',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Row Example'),
        ),
        body: Center(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Container(
                width: 50.0,
                height: 50.0,
                color: Colors.red,
              ),
              Container(
                width: 50.0,
                height: 50.0,
                color: Colors.green,
              ),
              Container(
                width: 50.0,
                height: 50.0,
                color: Colors.blue,
              ),
            ],
          ),
        ),
      ),
    );
  }
}