scroll_screenshot 0.0.2 scroll_screenshot: ^0.0.2 copied to clipboard
A new Flutter package 'scroll_screenshot' function allows you to capture a full-size screenshot, and scrolling functionality is also available to capture full screens, including those hidden at the bottom
0.0.2 #
A new Flutter package 'scroll_screenshot' function allows you to capture a full-size screenshot, and scrolling functionality is also available to capture full screens, including those hidden at the bottom
Essential Guide #
Flutter Scroll Screenshot Medium
Installation #
- Add the latest version of package to your pubspec.yaml (and run
dart pub get
):
dependencies:
scroll_screenshot: ^0.0.2
- Import the package and use it in your Flutter App.
import 'dart:developer';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:scroll_screenshot/scroll_screenshot.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
final GlobalKey globalKey = GlobalKey();
@override
void initState() {
super.initState();
}
Future<void> _captureAndSaveScreenshot() async {
String? base64String =
await ScrollScreenshot.captureAndSaveScreenshot(globalKey);
log(base64String!);
}
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).primaryColor,
title: const Text("Scroll Screenshot"),
),
body: SingleChildScrollView(
child: RepaintBoundary(
key: globalKey,
child: Column(
children: <Widget>[
SizedBox(
height: 2250,
width: MediaQuery.of(context).size.width,
child: Column(children: [
LayoutBuilder(
builder:
(BuildContext context, BoxConstraints constraints) {
return SizedBox(
height: 2250, // Adjust the height as needed
child: ListView.builder(
physics: const NeverScrollableScrollPhysics(),
itemCount: 40,
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text(
'Item ${index+1}',
),
);
},
),
);
},
),
]),
),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _captureAndSaveScreenshot,
child: const Icon(Icons.screenshot),
),
),
);
}
}