在 Flutter 中对齐元素不起作用答案

【问题标题】：Aligning elements in Flutter isn't working在 Flutter 中对齐元素不起作用
【发布时间】：2021-08-04 06:01:37
【问题描述】：

我编写了一个代码，它使用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();
  }
}

我指的是对齐小部件的链接：https://flutter.dev/docs/development/ui/layout#aligning-widgets
我正在尝试将子元素对齐为children: <Widget>[]。但我得到错误

未定义命名参数“mainAxisAlignment”。（文档）尝试将名称更正为现有命名参数的名称，或使用名称“mainAxisAlignment”定义命名参数。
未定义命名参数“children”。（文档）尝试将名称更正为现有命名参数的名称，或使用名称“children”定义命名参数。

我错过了什么？

【问题讨论】：

将Center 更改为Column
您使用的是Center，请将其更改为Column。
哦，好的，谢谢...

标签： flutter computer-vision flutter-layout morse-code

【解决方案1】：

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

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

【讨论】：