ThatOneJackalGuy/OpenContacts
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 2 Packages Wiki Activity Actions

feat: make the storage indicator text more readable

Browse source
This commit is contained in:
Garrett Watson 2024-02-23 16:34:22 -05:00
parent bcff2214aa
commit 77d1ddf458
2 changed files with 85 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
lib/blend_mask.dart Normal file
View file

@ -0,0 +1,49 @@
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
// Applies a BlendMode to its child.
class BlendMask extends SingleChildRenderObjectWidget {
final BlendMode blendMode;
final double opacity;
const BlendMask({
required this.blendMode,
this.opacity = 1.0,
super.key,
super.child,
});
@override
RenderObject createRenderObject(context) {
return RenderBlendMask(blendMode, opacity);
}
@override
void updateRenderObject(BuildContext context, RenderBlendMask renderObject) {
renderObject.blendMode = blendMode;
renderObject.opacity = opacity;
}
}
class RenderBlendMask extends RenderProxyBox {
BlendMode blendMode;
double opacity;
RenderBlendMask(this.blendMode, this.opacity);
@override
void paint(context, offset) {
// Create a new layer and specify the blend mode and opacity to composite it with:
context.canvas.saveLayer(
offset & size,
Paint()
..blendMode = blendMode
..color = Color.fromARGB((opacity * 255).round(), 255, 255, 255),
);
super.paint(context, offset);
// Composite the layer back into the canvas using the blendmode:
context.canvas.restore();
}
}

67
lib/widgets/my_profile_dialog.dart
View file

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:intl/intl.dart'; import 'package:intl/intl.dart';
import 'package:recon/apis/user_api.dart'; import 'package:recon/apis/user_api.dart';
import 'package:recon/auxiliary.dart'; import 'package:recon/auxiliary.dart';
import 'package:recon/blend_mask.dart';
import 'package:recon/client_holder.dart'; import 'package:recon/client_holder.dart';
import 'package:recon/models/personal_profile.dart'; import 'package:recon/models/personal_profile.dart';
import 'package:recon/widgets/default_error_widget.dart'; import 'package:recon/widgets/default_error_widget.dart';
@ -63,18 +64,19 @@ class _MyProfileDialogState extends State<MyProfileDialog> {
imageUri: Aux.resdbToHttp(profile.userProfile.iconUrl), imageUri: Aux.resdbToHttp(profile.userProfile.iconUrl),
radius: 32, radius: 32,
), ),
Padding( const SizedBox(
padding: const EdgeInsets.only(left: 12), width: 12,
child: Column( ),
crossAxisAlignment: CrossAxisAlignment.start, Column(
children: [ crossAxisAlignment: CrossAxisAlignment.start,
Text(profile.username, style: textTheme.titleLarge), children: [
Text( Text(profile.username, style: textTheme.titleLarge),
profile.accountType.label, Text(
style: textTheme.labelMedium?.copyWith(color: profile.accountType.color), profile.accountType.label,
), style: textTheme.labelMedium?.copyWith(color: profile.accountType.color),
], ),
)), ],
),
], ],
), ),
), ),
@ -254,25 +256,28 @@ class StorageIndicator extends StatelessWidget {
height: 48, height: 48,
padding: const EdgeInsets.symmetric(horizontal: 12), padding: const EdgeInsets.symmetric(horizontal: 12),
alignment: Alignment.center, alignment: Alignment.center,
child: Row( child: BlendMask(
mainAxisAlignment: MainAxisAlignment.spaceBetween, blendMode: BlendMode.colorDodge,
crossAxisAlignment: CrossAxisAlignment.center, child: Row(
children: [ mainAxisAlignment: MainAxisAlignment.spaceBetween,
Text( crossAxisAlignment: CrossAxisAlignment.center,
"${(value * 100).toStringAsFixed(0)}%", children: [
style: Theme.of(context).textTheme.titleMedium?.copyWith(fontWeight: FontWeight.bold), Text(
), "${(value * 100).toStringAsFixed(0)}%",
Column( style: Theme.of(context).textTheme.titleMedium?.copyWith(fontWeight: FontWeight.bold),
mainAxisAlignment: MainAxisAlignment.center, ),
crossAxisAlignment: CrossAxisAlignment.end, Column(
children: [ mainAxisAlignment: MainAxisAlignment.center,
// Displayed in GiB instead of GB for consistency with Resonite crossAxisAlignment: CrossAxisAlignment.end,
Text( children: [
"${(usedBytes * 9.3132257461548e-10).toStringAsFixed(2)} GB of ${(maxBytes * 9.3132257461548e-10).toStringAsFixed(2)} GB"), // Displayed in GiB instead of GB for consistency with Resonite
Text("Storage Space Used", Text(
style: Theme.of(context).textTheme.labelSmall?.copyWith(fontSize: 10)), "${(usedBytes * 9.3132257461548e-10).toStringAsFixed(2)} GB of ${(maxBytes * 9.3132257461548e-10).toStringAsFixed(2)} GB"),
]), Text("Storage Space Used",
], style: Theme.of(context).textTheme.labelSmall?.copyWith(fontSize: 10)),
]),
],
),
)), )),
]), ]),
) )