Mobile 在pdf查看器上显示/隐藏选项栏

我试图在用户从pdf中读取的页面上保持跟踪，因此首先我尝试控制文件的滚动，因为pdf显示时没有多大意义，因此，如果我将pdf页面分割成不同的文件，我可以保持跟踪，但为了允许用户更改页面，我想添加一些控件，如“下一页”和“上一页”。首先，我尝试添加一个浮动操作按钮，当用户点击屏幕时，该按钮应隐藏并显示，因此我这样做：

我正在使用flatter\u full\u pdf\u查看器插件

import 'dart:async';
import 'dart:io';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_full_pdf_viewer/full_pdf_viewer_scaffold.dart';
import 'package:path_provider/path_provider.dart';

void main() {
  runApp(MaterialApp(
    title: 'Little Readers',
    home: MyApp(),
  ));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String pathPDF = "";
  double iconSize = 80;
  MaterialColor iconColor = Colors.blue;

  @override
  void initState() {
    super.initState();
    createFileOfPdfUrl().then((file) {
      setState(() {
        pathPDF = file.path;
        print(pathPDF);
      });
    });
  }

  Future<File> createFileOfPdfUrl() async {
    final url = "http://africau.edu/images/default/sample.pdf";
    final filename = url.substring(url.lastIndexOf("/") + 1);
    var request = await HttpClient().getUrl(Uri.parse(url));
    var response = await request.close();
    var bytes = await consolidateHttpClientResponseBytes(response);
    String dir = (await getApplicationDocumentsDirectory()).path;
    File file = new File('$dir/$filename');
    await file.writeAsBytes(bytes);
    return file;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('My App'),
      ),
      body: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          verticalDirection: VerticalDirection.down,
          children: <Widget>[
            Align(
              alignment: Alignment.topCenter,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  IconButton(
                    iconSize: iconSize,
                    color: iconColor,
                    icon: Icon(Icons.book),
                    onPressed: () => Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (context) => PDFScreen(pathPDF)),
                        ),
                  ),
                ],
              ),
            ),
          ]),
    );
  }
}

class PDFScreen extends StatelessWidget {
  String pathPDF = "";
  PDFScreen(this.pathPDF);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          PDFViewerScaffold(
            appBar: AppBar(
              title: Text("My Book"),
              actions: <Widget>[
                IconButton(
                  icon: Icon(Icons.share),
                  onPressed: () => {},
                )
              ],
            ),
            path: pathPDF,
          ),
          Positioned(
            child: new FloatingActionButton(
              child: Icon(Icons.camera_alt),
              backgroundColor: Colors.green.shade800,
              onPressed: () => {},
            ),
          ),
        ],
      ),
    );
  }
}

导入'dart:async'；
导入“dart:io”；
进口“包装：颤振/基础.dart”；
进口“包装：颤振/材料.省道”；
导入“package:flatter_full_pdf_viewer/full_pdf_viewer_scaffold.dart”；
导入“package:path_provider/path_provider.dart”；
void main（）{
runApp（材料应用程序）(
标题:"小读者",，
主页：MyApp（），
));
}
类MyApp扩展了StatefulWidget{
@凌驾
_MyAppState createState（）=>new_MyAppState（）；
}
类MyAppState扩展了状态{
字符串pathPDF=“”；
双iconSize=80；
MaterialColor iconColor=Colors.blue；
@凌驾
void initState（）{
super.initState（）；
CreateFileOffURL（）。然后（（文件）{
设置状态（）{
pathPDF=file.path；
印刷品（PDF）；
});
});
}
将来的CreateFileOffUrl（）异步{
最终url=”http://africau.edu/images/default/sample.pdf";
最终文件名=url.substring（url.lastIndexOf（“/”）+1）；
var request=wait HttpClient（）.getUrl（Uri.parse（url））；
var response=wait request.close（）；
var bytes=等待合并HttpClientResponseBytes（响应）；
字符串dir=（等待getApplicationDocumentsDirectory（））.path；
File File=新文件（“$dir/$filename”）；
等待文件。writeAsBytes（字节）；
返回文件；
}
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：const Text（“我的应用程序”），
),
正文：专栏(
crossAxisAlignment:crossAxisAlignment.stretch，
垂直方向：垂直方向。向下，
儿童：[
对齐(
对齐：alignment.topCenter，
孩子：排(
mainAxisAlignment:mainAxisAlignment.spaceBetween，
儿童：[
图标按钮(
iconSize:iconSize，
颜色：iconColor，
图标：图标（Icons.book），
按下：（）=>Navigator.push(
上下文
材料路线(
生成器：（上下文）=>PDFScreen（pathPDF）），
),
),
],
),
),
]),
);
}
}
类PDFScreen扩展了无状态小部件{
字符串pathPDF=“”；
PDFScreen（this.pathPDF）；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
主体：堆栈(
儿童：[
PDFViewerScaffold(
appBar:appBar(
标题：文本（“我的书”），
行动：[
图标按钮(
图标：图标（Icons.share），
按下：（）=>{}，
)
],
),
路径：pathPDF，
),
定位(
子：新的浮动操作按钮(
子：图标（Icons.camera\u alt），
背景颜色：Colors.green.shade800，
按下：（）=>{}，
),
),
],
),
);
}
}

问题是，FAB显示在AppBar上，无论我设置了top、bottom、left或right属性，它实际上都会根据我设置的位置移动，但仅通过AppBar移动

作为一个替代方案，实际上我认为这将是一个更优雅的解决方案，我想添加一个选项栏，就像安卓的图像库在点击图像时所做的那样

---

当然，我想通过pdf查看器获得它，但我在寻找组件或方法时遇到了问题。所以我正在寻找一些方向…

实际上我最近不得不自己做一些类似的事情。我用一个Align小部件包装了我的浮动操作按钮，如下所示

floatingActionButton: Align(
      child: Container(
        child: FloatingActionButton(
          heroTag: 'scaffoldBtn'+_scafKey.hashCode.toString(),
          onPressed: () {
            _scafKey.currentState.openDrawer();
          },
          backgroundColor: Utils.hexToColor('#07467A'),
          tooltip: 'Menu',
          child: Padding(
            padding: const EdgeInsets.only(left: 13.0),
            child: Icon(Icons.menu),
          ),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.horizontal(
              right: Radius.circular(20.0),
            ),
            side:
                BorderSide(color: Utils.hexToColor('#979797'), width: 2.0),
          ),
        ),
        width: 65.0,
        height: 55.0,
      ),
      alignment: Alignment(-0.99, 0.9),
    ),

这里有一个指向Align小部件的链接，以了解更多详细信息

---

希望这有帮助

你找到解决办法了吗？