如何将图标向右移动

Question

我是Flutter的新手，正试图构建一个简单的UI，但是遇到了问题。 我构建了一个带有图标的AppBar。我使用Align类将其向右移动，但仍位于左侧。 这是我的main.dart文件：

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp (
      home: Scaffold (
        appBar: AppBar(
          elevation: 0,
          backgroundColor: Colors.white,
          title: Row(
            children: <Widget>[
              Align(
                alignment: Alignment.Right,
                child: Icon(
                  Icons.add,
                  color: Colors.black,
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}

顺便说一句：我知道我应该使用IconButton，但是我试图构建一个页面UI，而不是通过导航构建

Answer 1

要将图标添加到AppBar的右侧，可以使用actions属性

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp (
      home: Scaffold (
        appBar: AppBar(
          elevation: 0,
          backgroundColor: Colors.white,
          title: Row(
            children: <Widget>[
              Align(
                alignment: Alignment.Right,
                child: Icon(
                  Icons.add,
                  color: Colors.black,
                ),
              )
            ],
          ),
          actions: <Widget>[ // add the icon to this list
            Icon(
              Icons.add,
              color: Colors.black,
            ),
          ],
        ),
      ),
    );
  }
}

Answer 2

使用actions属性，您可以轻松地将其放在右侧。 默认情况下，所有内容都像领先属性一样处理

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(home: MyApp(),));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        actions: <Widget>[
          Icon(Icons.add)
        ],
      )
    );
  }
}