mirror of
https://gitlab.com/veilid/veilidchat.git
synced 2025-08-03 19:54:27 -04:00
layout fixes
This commit is contained in:
Christien Rioux
parent
71f4d37efa
commit
216aef8173
56 changed files with 654 additions and 342 deletions
|
|
@ -1,10 +1,18 @@
|
|||
import 'dart:io';
|
||||
import 'dart:math';
|
||||
import 'dart:typed_data';
|
||||
|
||||
import 'package:async_tools/async_tools.dart';
|
||||
import 'package:awesome_extensions/awesome_extensions.dart';
|
||||
import 'package:file_saver/file_saver.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_translate/flutter_translate.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:pdf/widgets.dart' as pw;
|
||||
import 'package:printing/printing.dart';
|
||||
import 'package:qr_flutter/qr_flutter.dart';
|
||||
import 'package:screenshot/screenshot.dart';
|
||||
import 'package:share_plus/share_plus.dart';
|
||||
import 'package:veilid_support/veilid_support.dart';
|
||||
|
||||
import '../../layout/default_app_bar.dart';
|
||||
|
|
@ -13,13 +21,18 @@ import '../../tools/tools.dart';
|
|||
import '../../veilid_processor/veilid_processor.dart';
|
||||
|
||||
class ShowRecoveryKeyPage extends StatefulWidget {
|
||||
const ShowRecoveryKeyPage({required SecretKey secretKey, super.key})
|
||||
: _secretKey = secretKey;
|
||||
const ShowRecoveryKeyPage(
|
||||
{required WritableSuperIdentity writableSuperIdentity,
|
||||
required String name,
|
||||
super.key})
|
||||
: _writableSuperIdentity = writableSuperIdentity,
|
||||
_name = name;
|
||||
|
||||
@override
|
||||
ShowRecoveryKeyPageState createState() => ShowRecoveryKeyPageState();
|
||||
|
||||
final SecretKey _secretKey;
|
||||
final WritableSuperIdentity _writableSuperIdentity;
|
||||
final String _name;
|
||||
}
|
||||
|
||||
class ShowRecoveryKeyPageState extends State<ShowRecoveryKeyPage> {
|
||||
|
|
@ -33,18 +46,99 @@ class ShowRecoveryKeyPageState extends State<ShowRecoveryKeyPage> {
|
|||
});
|
||||
}
|
||||
|
||||
Widget _recoveryKeyWidget(SecretKey _secretKey) {
|
||||
Future<void> _shareRecoveryKey(
|
||||
BuildContext context, Uint8List recoveryKey, String name) async {
|
||||
setState(() {
|
||||
_isInAsyncCall = true;
|
||||
});
|
||||
|
||||
final screenshotController = ScreenshotController();
|
||||
final bytes = await screenshotController.captureFromWidget(
|
||||
Container(
|
||||
color: Colors.white,
|
||||
width: 400,
|
||||
height: 400,
|
||||
child: _recoveryKeyWidget(context, recoveryKey, name)),
|
||||
);
|
||||
|
||||
setState(() {
|
||||
_isInAsyncCall = false;
|
||||
});
|
||||
|
||||
if (Platform.isLinux) {
|
||||
// Share plus doesn't do Linux yet
|
||||
await FileSaver.instance.saveFile(name: 'recovery_key.png', bytes: bytes);
|
||||
} else {
|
||||
final xfile = XFile.fromData(
|
||||
bytes,
|
||||
mimeType: 'image/png',
|
||||
name: 'recovery_key.png',
|
||||
);
|
||||
await Share.shareXFiles([xfile]);
|
||||
}
|
||||
}
|
||||
|
||||
static Future<void> _printRecoveryKey(
|
||||
BuildContext context, Uint8List recoveryKey, String name) async {
|
||||
final wrapped = await WidgetWrapper.fromWidget(
|
||||
context: context,
|
||||
widget: SizedBox(
|
||||
width: 400,
|
||||
height: 400,
|
||||
child: _recoveryKeyWidget(context, recoveryKey, name)),
|
||||
constraints: const BoxConstraints(maxWidth: 400, maxHeight: 400),
|
||||
pixelRatio: 3);
|
||||
|
||||
final doc = pw.Document()
|
||||
..addPage(pw.Page(
|
||||
build: (context) =>
|
||||
pw.Center(child: pw.Image(wrapped, width: 400)) // Center
|
||||
)); // Page
|
||||
|
||||
await Printing.layoutPdf(onLayout: (format) async => doc.save());
|
||||
}
|
||||
|
||||
static Widget _recoveryKeyWidget(
|
||||
BuildContext context, Uint8List recoveryKey, String name) {
|
||||
final theme = Theme.of(context);
|
||||
final textTheme = theme.textTheme;
|
||||
//final scaleConfig = theme.extension<ScaleConfig>()!;
|
||||
|
||||
return Column(mainAxisSize: MainAxisSize.min, children: [
|
||||
Text(
|
||||
style: textTheme.headlineSmall!.copyWith(
|
||||
color: Colors.black,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
translate('show_recovery_key_page.recovery_key'))
|
||||
.paddingLTRB(16, 16, 16, 0),
|
||||
FittedBox(
|
||||
child: QrImageView.withQr(
|
||||
size: 300,
|
||||
qr: QrCode.fromUint8List(
|
||||
data: recoveryKey,
|
||||
errorCorrectLevel: QrErrorCorrectLevel.L)))
|
||||
.paddingLTRB(16, 16, 16, 8)
|
||||
.expanded(),
|
||||
Text(
|
||||
style: textTheme.labelMedium!.copyWith(
|
||||
color: Colors.black,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
name)
|
||||
.paddingLTRB(16, 8, 16, 24),
|
||||
]);
|
||||
}
|
||||
|
||||
static Widget _recoveryKeyDialog(
|
||||
BuildContext context, Uint8List recoveryKey, String name) {
|
||||
final theme = Theme.of(context);
|
||||
//final textTheme = theme.textTheme;
|
||||
final scaleConfig = theme.extension<ScaleConfig>()!;
|
||||
|
||||
final cardsize =
|
||||
min<double>(MediaQuery.of(context).size.shortestSide - 48.0, 400);
|
||||
|
||||
final phonoString = prettyPhonoString(
|
||||
encodePhono(_secretKey.decode()),
|
||||
wordsPerLine: 2,
|
||||
);
|
||||
return Dialog(
|
||||
shape: RoundedRectangleBorder(
|
||||
side: const BorderSide(width: 2),
|
||||
|
|
@ -55,65 +149,19 @@ class ShowRecoveryKeyPageState extends State<ShowRecoveryKeyPage> {
|
|||
constraints: BoxConstraints(
|
||||
minWidth: cardsize,
|
||||
maxWidth: cardsize,
|
||||
minHeight: cardsize,
|
||||
maxHeight: cardsize),
|
||||
child: Column(mainAxisSize: MainAxisSize.min, children: [
|
||||
Text(
|
||||
style: textTheme.headlineSmall!.copyWith(
|
||||
color: Colors.black,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
translate('show_recovery_key_page.recovery_key'))
|
||||
.paddingAll(32),
|
||||
Text(
|
||||
style: textTheme.headlineSmall!.copyWith(
|
||||
color: Colors.black, fontFamily: 'Source Code Pro'),
|
||||
phonoString)
|
||||
])));
|
||||
}
|
||||
|
||||
Widget _optionBox(
|
||||
{required String instructions,
|
||||
required Icon buttonIcon,
|
||||
required String buttonText,
|
||||
required void Function() onClick}) {
|
||||
final theme = Theme.of(context);
|
||||
final scale = theme.extension<ScaleScheme>()!;
|
||||
final scaleConfig = theme.extension<ScaleConfig>()!;
|
||||
|
||||
return Container(
|
||||
constraints: const BoxConstraints(maxWidth: 400),
|
||||
decoration: BoxDecoration(
|
||||
color: scale.primaryScale.subtleBackground,
|
||||
borderRadius:
|
||||
BorderRadius.circular(8 * scaleConfig.borderRadiusScale),
|
||||
border: Border.all(color: scale.primaryScale.border)),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Text(
|
||||
style: theme.textTheme.labelMedium!
|
||||
.copyWith(color: scale.primaryScale.appText),
|
||||
softWrap: true,
|
||||
textAlign: TextAlign.center,
|
||||
instructions),
|
||||
ElevatedButton(
|
||||
onPressed: onClick,
|
||||
child: Row(mainAxisSize: MainAxisSize.min, children: [
|
||||
buttonIcon.paddingLTRB(0, 8, 12, 8),
|
||||
Text(textAlign: TextAlign.center, buttonText)
|
||||
])).paddingLTRB(0, 12, 0, 0).toCenter()
|
||||
]).paddingAll(12))
|
||||
.paddingLTRB(24, 0, 24, 12);
|
||||
minHeight: cardsize + 16,
|
||||
maxHeight: cardsize + 16),
|
||||
child: _recoveryKeyWidget(context, recoveryKey, name)));
|
||||
}
|
||||
|
||||
@override
|
||||
// ignore: prefer_expression_function_bodies
|
||||
Widget build(BuildContext context) {
|
||||
final secretKey = widget._secretKey;
|
||||
final theme = Theme.of(context);
|
||||
final scale = theme.extension<ScaleScheme>()!;
|
||||
final scaleConfig = theme.extension<ScaleConfig>()!;
|
||||
// final scale = theme.extension<ScaleScheme>()!;
|
||||
// final scaleConfig = theme.extension<ScaleConfig>()!;
|
||||
|
||||
final displayModalHUD = _isInAsyncCall;
|
||||
|
||||
return StyledScaffold(
|
||||
// resizeToAvoidBottomInset: false,
|
||||
|
|
@ -146,42 +194,55 @@ class ShowRecoveryKeyPageState extends State<ShowRecoveryKeyPage> {
|
|||
Text(
|
||||
textAlign: TextAlign.center,
|
||||
translate('show_recovery_key_page.instructions_options'))
|
||||
.paddingLTRB(12, 0, 12, 12),
|
||||
_optionBox(
|
||||
.paddingLTRB(12, 0, 12, 24),
|
||||
OptionBox(
|
||||
instructions:
|
||||
translate('show_recovery_key_page.instructions_print'),
|
||||
buttonIcon: const Icon(Icons.print),
|
||||
buttonIcon: Icons.print,
|
||||
buttonText: translate('show_recovery_key_page.print'),
|
||||
onClick: () {
|
||||
//
|
||||
setState(() {
|
||||
_codeHandled = true;
|
||||
});
|
||||
}),
|
||||
_optionBox(
|
||||
instructions:
|
||||
translate('show_recovery_key_page.instructions_view'),
|
||||
buttonIcon: const Icon(Icons.edit_document),
|
||||
buttonText: translate('show_recovery_key_page.view'),
|
||||
onClick: () {
|
||||
//
|
||||
singleFuture(this, () async {
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (context) => _recoveryKeyWidget(secretKey));
|
||||
await _printRecoveryKey(context,
|
||||
widget._writableSuperIdentity.recoveryKey, widget._name);
|
||||
});
|
||||
|
||||
setState(() {
|
||||
_codeHandled = true;
|
||||
});
|
||||
}),
|
||||
_optionBox(
|
||||
OptionBox(
|
||||
instructions:
|
||||
translate('show_recovery_key_page.instructions_view'),
|
||||
buttonIcon: Icons.edit_document,
|
||||
buttonText: translate('show_recovery_key_page.view'),
|
||||
onClick: () {
|
||||
//
|
||||
singleFuture(this, () async {
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (context) => _recoveryKeyDialog(
|
||||
context,
|
||||
widget._writableSuperIdentity.recoveryKey,
|
||||
widget._name));
|
||||
});
|
||||
|
||||
setState(() {
|
||||
_codeHandled = true;
|
||||
});
|
||||
}),
|
||||
OptionBox(
|
||||
instructions:
|
||||
translate('show_recovery_key_page.instructions_share'),
|
||||
buttonIcon: const Icon(Icons.ios_share),
|
||||
buttonIcon: Icons.ios_share,
|
||||
buttonText: translate('show_recovery_key_page.share'),
|
||||
onClick: () {
|
||||
//
|
||||
singleFuture(this, () async {
|
||||
await _shareRecoveryKey(context,
|
||||
widget._writableSuperIdentity.recoveryKey, widget._name);
|
||||
});
|
||||
|
||||
setState(() {
|
||||
_codeHandled = true;
|
||||
});
|
||||
|
|
@ -198,8 +259,9 @@ class ShowRecoveryKeyPageState extends State<ShowRecoveryKeyPage> {
|
|||
},
|
||||
child: Text(translate('button.finish')).paddingAll(8))
|
||||
.paddingAll(12))
|
||||
])));
|
||||
]))).withModalHUD(context, displayModalHUD);
|
||||
}
|
||||
|
||||
bool _codeHandled = false;
|
||||
bool _isInAsyncCall = false;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue