0ct0pu5/ente
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

usage section widget

Browse source
This commit is contained in:
Neeraj Gupta 2022-03-10 17:27:39 +05:30
parent 0525f6b910
commit 21afb79d9a
No known key found for this signature in database
GPG key ID: 3C5A1684DC1729E1
3 changed files with 227 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
fonts/Inter-Medium.ttf Normal file
View file

Binary file not shown.

224
lib/ui/settings/usage_details_widget.dart Normal file
View file

@ -0,0 +1,224 @@
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
class UsageDetailsWidget extends StatelessWidget {
const UsageDetailsWidget({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 343,
height: 196,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
boxShadow: const [
BoxShadow(
color: Color(0x14000000),
blurRadius: 12,
offset: Offset(0, 6),
),
],
color: Color(0xff42b96c),
),
child: Stack(
children: [
Positioned.fill(
child: Align(
alignment: Alignment.topLeft,
child: Container(
width: 343,
height: 120,
child: Stack(
children: [
Container(
width: 343,
height: 120,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: Color(0xff42b96c),
),
),
Positioned.fill(
child: Align(
alignment: Alignment.bottomLeft,
child: Opacity(
opacity: 0.20,
child: Container(
width: 306,
height: 266,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: Colors.white,
width: 1,
),
color: Colors.white,
),
),
),
),
),
Positioned.fill(
child: Align(
alignment: Alignment.topRight,
child: Opacity(
opacity: 0.20,
child: Container(
width: 376,
height: 256,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: Colors.white,
width: 1,
),
),
),
),
),
),
Positioned.fill(
child: Align(
alignment: Alignment.bottomRight,
child: Container(
width: 229,
height: 226,
child: FlutterLogo(size: 226),
),
),
),
Positioned.fill(
child: Align(
alignment: Alignment.topRight,
child: Opacity(
opacity: 0.20,
child: Container(
width: 306,
height: 336,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: Colors.white,
width: 1,
),
),
),
),
),
),
],
),
),
),
),
Positioned.fill(
child: Align(
alignment: Alignment.bottomLeft,
child: Container(
width: 343,
height: 80,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: Color(0x33000000),
),
),
),
),
Positioned(
left: 16,
top: 20,
child: Text(
"Current plan",
style: TextStyle(
color: Colors.white,
fontSize: 14,
fontFamily: "SF Pro Text",
fontWeight: FontWeight.w500,
),
),
),
Positioned(
left: 224,
top: 20,
child: Opacity(
opacity: 0.50,
child: Text(
"Ends 22 Jan’23",
textAlign: TextAlign.right,
style: TextStyle(
color: Colors.white,
fontSize: 14,
fontFamily: "SF Pro Text",
fontWeight: FontWeight.w500,
),
),
),
),
Positioned(
left: 16,
top: 40,
child: Text(
"10 GB",
style: TextStyle(
color: Colors.white,
fontSize: 24,
fontFamily: "SF Pro Display",
fontWeight: FontWeight.w600,
),
),
),
Positioned(
left: 16,
top: 136,
child: SizedBox(
width: 311,
height: 36,
child: Column(
children: [
LinearProgressIndicator(
value: 0.4,
valueColor: AlwaysStoppedAnimation<Color>(
Theme.of(context).buttonColor),
),
Padding(padding: EdgeInsets.fromLTRB(0, 12, 0, 0)),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: const [
Text(
"2.3 GB of 10 GB used",
style: TextStyle(
color: Colors.white,
fontSize: 14,
fontFamily: "SF Pro Text",
fontWeight: FontWeight.w600,
),
),
Text(
"3,846 Memories",
style: TextStyle(
color: Colors.white,
fontSize: 14,
fontFamily: "SF Pro Text",
fontWeight: FontWeight.w600,
),
),
],
),
],
),
),
),
],
),
),
],
),
);
}
}

3
lib/ui/settings_page.dart
View file

@ -13,6 +13,7 @@ import 'package:photos/ui/settings/security_section_widget.dart';
import 'package:photos/ui/settings/social_section_widget.dart';
import 'package:photos/ui/settings/support_section_widget.dart';
import 'package:photos/ui/settings/theme_switch_widget.dart';
import 'package:photos/ui/settings/usage_details_widget.dart';
class SettingsPage extends StatelessWidget {
const SettingsPage({Key key}) : super(key: key);
@ -39,6 +40,8 @@ class SettingsPage extends StatelessWidget {
contents.addAll([
DetailsSectionWidget(),
sectionDivider,
UsageDetailsWidget(),
sectionDivider,
BackupSectionWidget(),
sectionDivider,
AccountSectionWidget(),