Flutter 中的对齐元素不起作用

Question

我编写了一个代码，它使用 flutter_mobile_vision 和 morse 通过移动摄像头扫描文本并将这些扫描的文本转换为摩尔斯电码。
这是我的代码：

import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_mobile_vision/flutter_mobile_vision.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:lottie/lottie.dart';
import 'package:morse/morse.dart';

class OCRPage extends StatefulWidget {
  @override
  _OCRPageState createState() => _OCRPageState();
}

class _OCRPageState extends State<OCRPage> {

  int _ocrCamera = FlutterMobileVision.CAMERA_BACK;
  String _text = "TEXT";

  Future<Null> _read() async {
    List<OcrText> texts = [];
    try {
      texts = await FlutterMobileVision.read(
        camera: _ocrCamera,
        waitTap: true,
      );

      setState(() {
        _text = texts[0].value;
      });
    } on Exception {
      texts.add( OcrText('Failed to recognize text'));
    }
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return SingleChildScrollView(
      child: Center(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Lottie.asset('assets/scan-some-words.json', repeat: false),
          SizedBox(height: 20),
          Text(_text, style: GoogleFonts.orbitron(textStyle: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.w500)), textAlign: TextAlign.center,),
          SizedBox(height: 10),
          Text(Morse(_text).encode(), style: GoogleFonts.orbitron(textStyle: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.w500)),textAlign: TextAlign.center,),
          SizedBox(height: 30),
          ElevatedButton(
            onPressed: _read,
            child: new Text('Start Scanning'),
            // color: Color(0xFFFF16CD),
            // splashColor: Colors.orangeAccent,
          ),
          SizedBox(height: 10),
          Text('Tap on the text to convert into Morse Code', style: TextStyle(color: Color(0xffE6BBFC)),)
        ]

      )
    );


    throw UnimplementedError();
  }
}

我指的是这个 link 用于对齐小部件：https://flutter.dev/docs/development/ui/layout#aligning-widgets
我试图将子元素对齐为 children: <Widget>[]。但是我得到错误

The named parameter 'mainAxisAlignment' isn't defined. (Documentation) Try correcting the name to an existing named parameter's name, or defining a named parameter with the name 'mainAxisAlignment'.
The named parameter 'children' isn't defined. (Documentation) Try correcting the name to an existing named parameter's name, or defining a named parameter with the name 'children'.

我错过了什么？

Answer 1

mainAxisAlignment 属性是如何在 flex 布局中沿主轴放置 children。 Center 小部件没有 mainAxisAlignment 属性因为它不是弹性布局。

在这里您可以使用Column小部件。

Flutter 中的对齐元素不起作用

Aligning elements in Flutter isn't working

morse-code

computer-vision

flutter

flutter-layout