Question

如何在FloatingActionButton的左侧放置Scaffold？
当前唯一可用的选项是 centerFloat，centerDocked，endFloat和endDocked 。

也许材料设计不打算将FAB定位在 startFloat或startDocked 。
如果 RTL 将 endFloat和endDocked 更改为显示在左侧，那会很好，但事实并非如此。

Answer 1

到目前为止尚未实现。
有关此问题的issue on GitHub正在进行中（一旦有关于实施到框架的新闻，此答案将得到更新。）

有两种解决方法 ：

创建自定义FloatingActionButtonLocation和supply this to the Scaffold。
不不直接插入您的FloatingActionButton into your Scaffold ，但插入一个将FloatingActionButton定位的父对象，您将其添加为儿童。

Answer 2

截至2020年，您可以使用以下内容：

floatingActionButtonLocation: FloatingActionButtonLocation.startFloat

可以从 material.dart

传递到脚手架小部件的参数

来源：PR 51465

Answer 3

还有另一个解决此问题的方法。 Fab按钮默认情况下始终位于屏幕的底部。因此，如果我们用Scaffold包装Directionality并将其文本方向设置为TextDirection.rtl，则该按钮将左移。但是由于现在主体本身已被镜像，因此我们可以用另一个Directionality包裹主体并将其文本方向设置为TextDirection.ltr

  @override
  Widget build(BuildContext context) {
    return 
      Directionality(
      textDirection: TextDirection.rtl,
      child:Scaffold(
      appBar: AppBar(
        title: const Text('Something),
      ),
      body: Directionality(
        textDirection: TextDirection.ltr,
        child: Center(child: const Text('Press the button below!'))),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          
        },
        child: Icon(Icons.navigation),
        backgroundColor: Colors.green,
      ),
    )
      );
  }

将FloatingActionButton放置在左侧

3 个答案: