forgot password screen, portoflio screen ui code reformating

This commit is contained in:
jayesh
2024-06-04 17:59:38 +05:30
8 changed files with 494 additions and 3 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@@ -126,4 +126,7 @@ class AppText {
"To restore password please enter phone number";
static const String createNewPasswordText = "Create new password";
static const String submitText = "Submit";
//Wallet
static const String walletTitle = "Wallet balance";
}

View File

@@ -181,7 +181,6 @@ class _AcademyDetailsScreenState extends State<AcademyDetailsScreen> {
videos[index],
fit: BoxFit.cover,
height: 160.h,
// alignment: Alignment.topCenter,
),
),
);

View File

@@ -0,0 +1,342 @@
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:tanami_app/core/routes/route_name.dart';
import 'package:tanami_app/core/routes/routes.dart';
import 'package:tanami_app/core/styles/app_text.dart';
class PortfolioScreen extends StatefulWidget {
const PortfolioScreen({super.key});
@override
State<PortfolioScreen> createState() => _PortfolioScreenState();
}
class _PortfolioScreenState extends State<PortfolioScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: CustomScrollView(
slivers: [
SliverAppBar(
elevation: 0,
scrolledUnderElevation: 0,
expandedHeight: 230.0,
automaticallyImplyLeading: false,
snap: false,
pinned: true,
floating: false,
flexibleSpace: LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
var top = constraints.biggest.height;
var percentage =
((top - kToolbarHeight) / (200.0 - kToolbarHeight))
.clamp(0.0, 1.0);
var opacity = (1 - percentage).clamp(0.0, 1.0);
return FlexibleSpaceBar(
// centerTitle: true,
titlePadding:
const EdgeInsets.only(left: 30, top: 0, bottom: 15),
title: Opacity(
opacity: opacity,
child: Row(
children: [
Text(
AppText.portfolio,
style: GoogleFonts.dmSans(
color: const Color(0xFF888888),
fontSize: 12.sp,
fontWeight: FontWeight.w700,
),
),
Text(
'SAR 178,000',
style: GoogleFonts.dmSans(
color: Colors.black,
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
),
],
),
),
background: Stack(
fit: StackFit.expand,
children: [
Image.asset(
'assets/images/portfolio_screen/bg.png', // Replace with your image asset
fit: BoxFit.cover,
),
Padding(
padding: const EdgeInsets.only(left: 40.0),
child: Opacity(
opacity: percentage,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
AppText.portfolio,
style: GoogleFonts.dmSans(
color: const Color(0xFFC9D9CB),
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
),
SizedBox(
height: 8.h,
),
Text(
'SAR 178,000',
style: GoogleFonts.dmSans(
color: Colors.white,
fontSize: 28.sp,
fontWeight: FontWeight.w700,
),
),
],
),
),
),
],
),
);
}),
backgroundColor: Colors.white,
),
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => Padding(
padding: const EdgeInsets.all(10.0),
child: GestureDetector(
onTap: () {
goRouter.pushNamed(RouteName.porfolioDetails);
},
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: const BorderRadius.all(Radius.circular(20.0)),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.15),
spreadRadius: 2,
blurRadius: 10,
offset:
const Offset(0, 3), // changes position of shadow
),
],
),
child: Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20.0, vertical: 16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Image.asset(
(index == 2)
? 'assets/images/portfolio_screen/clock_off.png'
: 'assets/images/portfolio_screen/clock.png',
height: 25.sp,
),
SizedBox(
width: 5.w,
),
Text(
'Mar 01 2024',
style: GoogleFonts.dmSans(
color: const Color(0xFF004717),
fontSize: 12.sp,
fontWeight: FontWeight.w500,
),
),
],
),
Text(
(index == 2) ? 'Exited' : 'Pending',
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: const Color(0xFF0FA4A4),
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
)
],
),
SizedBox(
height: 8.h,
),
Text(
(index == 2)
? 'Real Estate III'
: 'Private equity portfolio I',
style: GoogleFonts.dmSans(
color: Colors.black,
fontSize: 17.sp,
fontWeight: FontWeight.w700,
),
),
],
),
),
Container(
decoration: const BoxDecoration(
color: Color(0xFFF8F8F8),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20.0),
bottomRight: Radius.circular(20.0),
),
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20.0, vertical: 16.0),
child: Column(
children: [
Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
AppText.investmentamount,
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: const Color(0xFF535353),
fontSize: 14.sp,
fontWeight: FontWeight.w500,
),
),
Column(
crossAxisAlignment:
CrossAxisAlignment.end,
children: [
Text(
'SAR 100,000',
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: Colors.black,
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
),
Text(
' \$ 26,700',
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: Colors.black,
fontSize: 11.sp,
fontWeight: FontWeight.w400,
),
),
],
)
],
),
SizedBox(
height: 8.h,
),
Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
AppText.currentval,
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: const Color(0xFF535353),
fontSize: 14.sp,
fontWeight: FontWeight.w500,
),
),
Column(
crossAxisAlignment:
CrossAxisAlignment.end,
children: [
Text(
'SAR 100,000',
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: Colors.black,
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
),
Text(
' \$ 26,700',
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: Colors.black,
fontSize: 11.sp,
fontWeight: FontWeight.w400,
),
),
],
)
],
),
SizedBox(
height: 8.h,
),
Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
AppText.totalreturn,
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFF8D8D8D)
: const Color(0xFF535353),
fontSize: 14.sp,
fontWeight: FontWeight.w500,
),
),
Text(
(index == 2) ? '- 20.0%' : '+ 20.0%',
style: GoogleFonts.dmSans(
color: (index == 2)
? const Color(0xFFde9595)
: const Color(0xFF066123),
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
)
],
)
],
),
),
)
],
),
),
),
),
childCount: 3,
), //SliverChildBuildDelegate
),
],
),
);
}
}

View File

@@ -1,4 +1,8 @@
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:tanami_app/core/styles/app_text.dart';
class WalletScreen extends StatefulWidget {
const WalletScreen({super.key});
@@ -10,8 +14,150 @@ class WalletScreen extends StatefulWidget {
class _WalletScreenState extends State<WalletScreen> {
@override
Widget build(BuildContext context) {
return const Scaffold(
body: Text('Wallet'),
return Scaffold(
backgroundColor: Colors.white,
body: CustomScrollView(
slivers: [
SliverAppBar(
elevation: 0,
scrolledUnderElevation: 0,
expandedHeight: 230.0,
automaticallyImplyLeading: false,
snap: false,
pinned: true,
floating: false,
flexibleSpace: LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
return FlexibleSpaceBar(
titlePadding:
const EdgeInsets.only(left: 30, top: 0, bottom: 15),
background: Stack(
fit: StackFit.expand,
children: [
Image.asset(
'assets/images/wallet_screen/bg.png', // Replace with your image asset
fit: BoxFit.cover,
),
Padding(
padding: const EdgeInsets.only(left: 40.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
AppText.walletTitle,
style: GoogleFonts.dmSans(
color: const Color(0xFF343434),
fontSize: 14.sp,
fontWeight: FontWeight.w700,
),
),
SizedBox(
height: 4.h,
),
Text(
'SAR 178,000',
style: GoogleFonts.dmSans(
color: const Color(0xFF191B1E),
fontSize: 28.sp,
fontWeight: FontWeight.w700,
),
),
],
),
),
],
),
);
}),
backgroundColor: Colors.white,
),
SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 18.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Center(
child: Container(
decoration: BoxDecoration(
color: Colors.grey.withOpacity(0.2),
borderRadius:
const BorderRadius.all(Radius.circular(20.0)),
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 40.0, vertical: 10.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
Container(
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.black,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Image.asset(
'assets/images/wallet_screen/deposit.png',
height: 20.h,
),
),
),
Text(
'Deposit',
style: GoogleFonts.dmSans(
color: const Color(0xFF363636),
fontSize: 12.sp,
fontWeight: FontWeight.w700,
),
),
],
),
VerticalDivider(
color: Colors.black,
width: 20.0,
),
Column(
children: [
Container(
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.black,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Image.asset(
'assets/images/wallet_screen/withdraw.png',
height: 20.h,
),
),
),
Text(
'Withdraw',
style: GoogleFonts.dmSans(
color: const Color(0xFF363636),
fontSize: 12.sp,
fontWeight: FontWeight.w700,
),
),
],
),
],
),
),
),
)
],
),
),
),
],
),
);
}
}

View File

@@ -103,6 +103,7 @@ flutter:
- assets/images/bottom_bar/inactive/
- assets/images/portfolio_screen/
- assets/images/academy_screen/
- assets/images/wallet_screen/
- assets/images/biometric_screen/
- assets/images/biometric_screen/png/
- assets/images/biometric_screen/svg/